Elegant ThemesのDiviでメガメニューの作成

Diviでメガメニュー（Mega Menu）作成

Avada, Enfold, Newspaper などいくつかの有料テーマにメガメニュー機能が内蔵されており、メニュー項目をクリックしたときにメニューが表示されるように作成されたメガメニューを実装することができます。 Elegant ThemesのDiviでも簡単にメガメニューを作成することができます。

Diviでメニューメニューを作成するプロセスを簡単にまとめてみると次のとおりです：

1. テーマのデザイン>メニューに移動します。 （WordPress バージョンに応じて、「テーマのデザイン "の代わりに"外見 "という用語が使用されることがあります。）
2. 右上部にある 「画面のオプション」（Screen Options）をクリックして、 詳細設定]メニューのプロパティを表示 下の "CSSクラス」をチェックします。
   
3. メガメニュー形式で表示最上位のメニュー項目から「CSSクラス"に"メガメニュー"を追加します。
   
4. これで、メニュー項目がメガメニューで動作します。
   

実際の動作は、 ここで確認することができます。 上記のプロセスは、次の動画で説明されているので参照してください：

ちなみに、メニュー項目にアイコンを追加する方法は、次の機会に説明します。

メガメニューをサポートしていないテーマの場合、プラグインを使用してメガメニュー機能を実装することができます。

• UberMenuメガメニュー
• メガメニュープラグイン
• 反応型メニューのプラグインSuperfly

Enfold テーマでメガメニューを使用する

人気のテーマである Enfold テーマでも簡単にメガメニューを構成することができます。 Enfoldは ルックス>メニューで、メニュー項目の 「Use as Mega Menu」（メガメニューに使用） オプションをクリックします。

これにより、次のようにMega Menuが動作します。

次の動画を参照してみてください。 （Enfold メガメニュー項目にイメージを追加する方法も説明しています。）

Avada テーマでメガメニューを使用する

WordPress 有料テーマの中で最も多く販売されているベストセラーのテーマである Avada(Avada)もメガメニュー機能はデフォルトで組み込まれています。 Avadaテーマオプションでメガメニュー設定を構成することができます。

そして、実際のメニューにメガメニュー機能を追加するには、外観>メニューから目的のメニューの1次のメニュー項目に表示される "Avada Options "をクリックします。

Avada Optoinsをクリックすると、メニューオプションが表示されます。 下部の Fusion Mega Menuのオプションを "On"に設定すると、追加で 「Full Width Mega Menu」（全幅メガメニュー）、メガメニューカラム数、Mega Menu Thumbnail（メガメニューサムネイル）という隠されたオプションが表示されます。

メガメニューオプションは、1次のメニュー項目（最上位のメニュー項目）のみの構成が可能です。

メモ：

• Diviで Slider Revolution（Revolution Slider）を全体の幅に追加する方法