Wix エディタ：メガメニューを追加・設定する

読了時間：7分

メガメニューとは高度な横型メニューにアイテムとして追加できるコンテナのことです。訪問者がライブサイトのメニューアイテムにマウスオーバーすると、コンテナが開きます。

コンテナにパーツを追加して、重要で関連性の高いコンテンツを表示できます。また、外観をカスタマイズして、訪問者にユニークなナビゲーション体験を提供することもできます。

まず、ページに横型メニューを追加して高度なメニューとして設定します。高度なメニューでは、複数のアイテムとナビゲーションオプションを使用して、訪問者にカスタムで整理されたブラウジング体験を提供することができます。

備考：

メガメニューコンテナは高度なメニューとして設定した横型メニューにのみ追加できます。メガメニューコンテナは、通常のサイトメニューやおすすめメニュー、縦型メニューには対応していません。

高度な横型メニューを追加・設定する方法：

エディタ左側で「パーツを追加」をクリックします。
「メニュー・アンカー」をクリックします。
「横型メニュー」をクリックします。
メニューデザインをクリックし、ページ上の希望する場所にドラッグします。
メニューを高度なメニューとして設定します：
1. エディタで新しいメニューを選択します。
2. 「設定」アイコンをクリックします。
3. 「高度な設定」パネルで「設定する」を選択します。
4. ポップアップで「設定する」をクリックします。

「パーツを追加」パネルの「メニュー・アンカー」タブ。カーソルが横型メニューにマウスオーバーしています。

高度な横型メニューを作成したら、メガメニューコンテナをアイテムとして追加して、好きな名前を付けます。「サービス」や「沿革」など、意図するコンテンツを反映したタイトルを使用することをおすすめします。

メガメニューを追加する方法：

エディタで高度なメニューを選択します。
「メニューを管理」をクリックします。
パネル下部の「＋メニューアイテムを追加」をクリックします。
「メガメニュー」を選択します。
コンテナのタイトルを入力します。
「完了」をクリックします。

エディタ内の高度なメニュー用の「メニューを管理」パネル。カーソルがメガメニューを追加するオプションにマウスオーバーしています。

ステップ 3 | コンテナにコンテンツを追加する

コンテナを追加して名前を付けたら、ボタン、シェイプ、テキストなどのパーツを追加して、必要なコンテンツを作成します。

パーツを追加する方法：

「メニューを管理」パネルでメガメニューコンテナにマウスオーバーします。
「編集」をクリックします。
エディタ左側で「パーツを追加」をクリックします。
追加するパーツを選択します。
パーツをクリックして、コンテナ内の任意の位置にドラッグします。

「パーツを追加」パネルからメガメニューコンテナにテキストボックスが追加されている様子を示した GIF。

必要なパーツを追加したら、ページ構造に合わせてメガメニューコンテナのレイアウトを変更します。間隔を調整したり、どのくらいコンテナを引き延ばすかを選択したりできます。

レイアウトを変更する方法：

メガメニューコンテナをクリックします。
「レイアウトを変更」をクリックします。
オプションを使用してコンテナを調整します：
- レイアウトを選択：コンテナを訪問者の画面の幅いっぱいに引き延ばすか、サイトページの幅（グリッド線内）に引き延ばすかを選択します。
- メニュー・サブメニューの間隔：スライダーをドラッグして、メニューとメガメニューコンテナ間の間隔を調整します。

Wix エディタ内のメガメニューのコンテナレイアウトパネル。カーソルが間隔スライダーにマウスオーバーしています。

コンテナのレイアウトを調整したら、枠線や背景などをデザインします。一貫した外観を維持するために、メガメニューに加えた変更は、追加したサブメニューにも適用されます。

コンテナのデザインをカスタマイズする方法：

メガメニューモードバーで「モードを終了」をクリックします。

2. 高度なメニューをクリックします。

3.「デザインを変更」アイコン

をクリックします。

4.「デザインをカスタマイズ」をクリックします。

5.「何をデザインしたいですか？」ドロップダウンメニューから「サブメニューコンテナ」を選択します。

6. オプションを使用してコンテナをデザインします。

デザインオプションを表示

背景の塗りつぶし ：
- カラーボックスをクリックして、メニューコンテナの色を選択します。
- スライダーをドラッグして不透明度を調整します。
枠線：
- カラーボックスをクリックして、枠線の色を選択します。
- ドロップダウンメニューをクリックして、枠線のスタイルを選択します。
- 「ロック / ロックを解除」アイコンをクリックして、枠線のすべての側面を同じにするか、異なるサイズにするかを選択します。
- ボックスにピクセル数を入力して、枠線のサイズを変更します。
角：
- 「ロック / ロックを解除」アイコンをクリックして、角の丸みを同じにするか、異なるサイズにするかを選択します。
- ボックスにピクセル数を入力して、角を丸くするか、四角にします。
影：
- 「影を追加する」をクリックして、コンテナに影を追加します。
- スライダーをドラッグして、影の不透明度を調整します。
- ボックスをクリックして影をカスタマイズします：
  - カラーボックスをクリックして影の色を選択します。
  - 影の種類を外側にするか、内側にするかを選択します。
  - ボックスに角度を入力します。
  - スライダーをドラッグして、コンテナと影の間の距離を調整します。
  - スライダーを使用して、影のぼかしを調整します。
  - スライダーをドラッグして、影の大きさを調整します。
レイアウト ：
- 「ロック / ロックを解除」アイコンをクリックして、余白を全ての側面で同じにするかどうかを選択します。
- ボックスにピクセル数を入力して、余白のサイズを変更します。