Wix Harmony エディタ:レイヤーパネルを操作する
8分
この記事内
- セクションやパーツを並べ替える
- レイヤーの名前を変更する
- レイヤーを操作する
- ヘッダーまたはフッターを非表示にする
- モバイルでパーツを非表示にする
- よくある質問
この記事では、2026年1月にリリースされた新 Wix Harmony エディタについて説明します。Wix Harmony エディタまたは Wix エディタのどちらを使用しているか不明な場合は、こちらで詳細を確認してください。
レイヤーパネルを使用すると、ページ上のすべてのセクションやパーツを 1か所で確認することができます。レイヤーの選択、並び替え、調整も簡単に行えるため、各ページを思い通りのレイアウトや構造にすることができます。

セクションやパーツを並べ替える
ページ上のセクションやパーツなどのコンテンツの順序は、ドラッグアンドドロップで簡単に並べ替えることができます。
レイヤーを並べ替える方法:
- エディタに移動します。
- エディタ左下の「レイヤー」
をクリックします。 - (レイヤーパネルで)移動させたいセクションまたはパーツを見つけます。
- レイヤーを上下にドラッグして、ページ上での順序を変更します。
注意:パーツは、現在のセクション内で移動させることができます。セクションをまたいでパーツを移動させる場合は、ページ上でドラッグするか、切り取って目的のセクションに貼り付けてください。

レイヤーの名前を変更する
レイヤーに名前を付けておくと、セクションが多いサイトでも、簡単にそれらを識別することができます。セクションの名前はエディタにのみ表示され、サイト訪問者には表示されません。
レイヤーの名前を変更する方法:
- エディタに移動します。
- エディタ左下の「レイヤー」
をクリックします。 - (レイヤーパネルで)該当するパーツまたはセクションをダブルクリックします。
- 新しい名前を入力し、Enter キーを押します。

レイヤーを操作する
レイヤーパネルでは、ページ上のパーツやセクションをすばやく管理することができます。レイヤーの切り取り、コピー、貼り付け、複製、削除などを使用して効率的に作業したり、重要なパーツを画面に固定して訪問者がスクロールしても常に表示されるようにしたり、重なり合うアイテムを整理したりすることができます。これにより、デザインが整理され、正確にページを編集することができるようになります。
特定のレイヤーを選択して操作する方法:
- エディタに移動します。
- エディタ左下の「レイヤー」
をクリックします。 - (レイヤーパネルで)パーツまたはセクション横の「その他のアクション」アイコン
をクリックします。 - 実行する内容を選択します:
- カット:レイヤーをクリップボードに保存してサイトの別の場所に貼り付け、元の場所から削除します。
- コピー:レイヤーをクリップボードに保存して、サイトの別の場所に貼り付けます。
- 貼り付け:サイトの別の場所からコピーしたレイヤーを貼り付けます。パーツの場合は、現在作業中のセクションに貼り付けられます。セクションの場合は、ページの下部に貼り付けられます。
- 複製:レイヤーを複製します。
- 削除:サイトからレイヤーを完全に削除します。
- 画面に固定:パーツを画面に固定して、訪問者がスクロールしても表示されるようにします。これは、SNS アイコン、メニュー、連絡先などを常に表示させたい場合に最適です。
ヒント:このアクションは、セクションではなくパーツにのみ使用することができます。 - 重ね順:重なり合っているパーツがある場合は、選択したパーツの順序を変更します:
- 前面へ移動:パーツを 1つ前のレイヤーに移動させます。
- 背面へ移動:パーツを 1つ後ろのレイヤーに移動させます。
- 最前面へ移動:パーツを他のすべてのレイヤーの前面に移動させます。
- 最背面へ移動:パーツを他のすべてのレイヤーの背面に移動させます。

ヘッダーまたはフッターを非表示にする
ページのコンテンツに焦点を当てたい場合は、ヘッダーまたはフッターを非表示にして、コンテンツを目立たせることができます。この設定は現在作業中のページにのみ適用でき、いつでも表示と非表示を切り替えることができます。
ヘッダーまたはフッターを非表示にする方法:
- エディタに移動します。
- エディタ左下の「レイヤー」
をクリックします。 - (レイヤーパネルで)「ヘッダー」または「フッター」横の、「その他のアクション」アイコン
をクリックします。 - 「ヘッダーを非表示」または「フッターを非表示」を選択します。

ヒント:
ヘッダーまたはフッターを再度表示するには、上記の手順 4で「ヘッダー / フッターを表示」を選択します。
モバイルでパーツを非表示にする
レイヤーパネルを使用すると、簡単にモバイルで特定のパーツを非表示にすることができます。これにより、モバイルの画面に必要なパーツのみを表示して、モバイルでのエクスペリエンスを向上させることができます。もちろん、非表示にしたパーツは、いつでも再度表示することができます。
モバイルでパーツを非表示にする方法:
- エディタに移動します。
- ページ右上の「モバイル」アイコン
をクリックします。 - エディタ左下の「レイヤー」
をクリックします。 - (レイヤーパネルで)パーツまたはセクション横の「その他のアクション」アイコン
をクリックします。 - 「非表示」を選択します。
ヒント:このパーツはモバイルサイトでは非表示になりますが、デスクトップサイトでは表示されたままになります。

ヒント:
モバイルで非表示にしたパーツを再度表示したい場合は、モバイル表示に切り替え、レイヤーパネル上部の「Hidden from mobile(モバイルから非表示)」タブをクリックします。そして、「モバイルで表示」アイコン
をクリックします。
をクリックします。よくある質問
詳細については、以下の質問をクリックしてください。
アクセシビリティを向上させるため、セクションの DOM 順序を変更するにはどうすればよいですか?
ページ上で重なり合っているパーツを選択するにはどうすればよいですか?
追加できるレイヤーまたはセクションの数に制限はありますか?



