WordPress に Elementor メニュー項目を追加する方法

Elementor サイトにメニューを追加しますか?それなら、あなたは正しい場所に来ました！このチュートリアル ガイドでは、次のことを説明します。 Elementor メニューの作成、ナビゲーション メニューのセットアップ、カスタマイズの方法 あなたのウェブサイトで。

どのようなタイプの Web サイトでも、カスタム メニュー項目は必須です。これらによりナビゲーションが簡単になり、数回クリックするだけで必要な情報を見つけることができます。

多くの Web サイト所有者は、サイトのすべてのページに表示されるようにページ ヘッダーにメニューを配置します。その メニューの追加も簡単 Elementor では、特に以下のヒントとコツに従っている場合 😉

この記事では、その使用方法を説明します。 ElementsKit ナビメニューウィジェット エレメンター。この次のガイドでは、独自のメニューを作成したり、カスタマイズしたりすることができます。

Elementor Mega Menu WordPress とは何ですか?

Web サイトにメニューを追加することは、近年ますます人気が高まっています。この豊富なナビゲーション メニューは、次のことを支援します。 サイトナビゲーションの改善 ユーザーが資料を簡単に閲覧して、探しているものを見つけられるようにします。

ページ、投稿、カテゴリ、URL を、テーマによって様式化されたデフォルトの WordPress ナビゲーション メニューのメニュー項目として使用できます。

これはそのうちの 1 つでしょう サイトの最も重要な要素 オンラインでのプレゼンスを最大限に活用するために。そしてメニューは、WordPress サイトに追加することを検討すべき最初の要素です。

ElementsKit – Nav Menu ウィジェットが必要な理由は次の 2 つです。

• 巨大なメニュー レイアウトとカスタマイズされたメニュー レイアウトを作成したいと考えています。
• Web サイト用のオールインワン ソリューションを備えた高度な機能を備えたプラグインが必要です。

Elementorウィジェットと強力なカスタマイズ機能を備えたElementKitオールインワンアドオンを使用すると、 メガメニューを効率的に作成する 非常に柔軟です。

🔔 あなたは知っていますか？
WordPress テーマやページビルダーを使用する場合、ヘッダーやフッターを必要以上に制御することはできません。

もっと知りたい？最新のブログを忘れずにご覧ください ヘッダー フッターを作成およびカスタマイズする方法 – Elementor Page Builder

ElementsKit による Elementor の Mega Menu が提供するもの:

のように 最高のWordPressメガメニュープラグインElementsKit は、通常の WordPress メニューを「ハッキング」するためのさまざまな可能性も開きます。

より具体的に言うと、プラグインは次の点で役立ちます。

• タグ、色、ホバー効果、アイコンを使用してメニューをカスタマイズします。
• トップレベル メニューとサブメニュー メニューの外観を変更します。
• 垂直メニューと水平メニューの両方を作成します。
• ご希望のものをお選びください ElementsKit ライブラリからのヘッダー レイアウト。 
• アニメーション効果を追加して、サブメニューを表示します。
• ナビゲーション メニュー ウィジェットをドラッグ アンド ドロップするだけで、ワンクリックで追加できます。
• eコマースプラットフォーム（WooCommerceなど）でも完全に動作します
• Elementor ページビルダーでコンテンツを構築します。
• 好きな要素ウィジェットを使用してください。
• 100%は反応します。
• タブレットビューのオフキャンバスメニュースタイル。
• ビルダーコンテンツまたは単純なリストをタブレットビューのサブメニューとして表示します。

そしてもちろん、最も良い点は、 ElementsKit Nav メニューは無料とプレミアムの両方で利用できます バージョン。したがって、有料サブスクリプションを購入しなくても、サイトでこの素晴らしい Elementor メニュー機能を体験することができます。

Elementor でメニュー項目を作成する方法

実際の事例をいくつか見て、WordPress メガ メニューのレッスンを確認してみましょう。これで、WordPress メガ メニュー、ヘッダーを作成し、そのコンテンツを追加できるようになります。

メニューを作成する

Elementor メニューを作成するには、次のことを行う必要があります。 オンにする ElementsKit 起動時のメガ メニュー オプション モジュール ページをオンにしてから、 変更内容を保存 ボタン。

要素メニューを作成するには、いくつかの簡単な手順が必要です。ただあなたのところに行ってください WordPress ダッシュボード 次に、をクリックします メニュー。 その後、という名前のセクションが表示されます メニュー構成。次に、あなたのものを入力してください メニュー名 またはメニューヘッダーをクリックして メニューの作成.

今すぐ拡張してください カスタムリンク そしてあなたの URL 同様に リンクテキストをクリックしてください。 メニューに追加.

📝クイックノート
同じ方法を繰り返すことで、メガ メニュー項目を必要なだけ追加、削除、編集できます。

ElementsKit を介して Elementor にメニュー項目を追加します。しかしその前に、✅にチェックを入れる必要があります。 メガメニューコンテンツのメニューを有効にする 「メニュー名」セクションの下にあるセクション。 

すると、メガメニュータグが表示されます。 リンクテキスト。をクリックした後、 メガメニュー タグを付けるとポップアップが開きます。

Mega Menu オプションを有効にするには、有効化をクリックする必要があります。 メガメニューのコンテンツを編集する ボタンを押して保存します。準備は完了です! 

🧐 Elementor メニューの詳細
ドキュメントもぜひご覧ください ElementsKit Elementor 用メガメニュービルダー

メニューのインポート (垂直メガメニュー)

垂直メニューを作成するには、まず次のことを行う必要があります。 オンにする の 垂直メニュー ウィジェット。次に、をクリックします 変更内容を保存.

次に、をクリックします テンプレート ダッシュボードの左側にあります。クリックしただけで テンプレートのインポート.

次に選択する必要があります ファイルを選ぶ デバイスから。次に、クリックするだけです 今すぐインポート。インポートされたすべてのデータが一度に表示されます。

さらに、データを使用して垂直メニューを作成するには、次の場所に移動する必要があります。 外観 次に、をクリックします メニュー。上記からメニューを作成することもできます。詳細については、垂直メニューのドキュメント サイトにアクセスしてください。

メニューのカスタマイズ 

コンテンツをカスタマイズします。そのためには、 メガメニューのコンテンツを編集する ボタン。ボタンをクリックするとすぐに、Elementor メニュー スタイル画面がポップアップ表示されることがわかります。 

クリックするだけです。 ElementsKit アイコン そしてどれを選択しますか 事前定義されたヘッダー あなたのウェブサイトに挿入したい。 

クリックした直後 ElementsKit ウィジェット ボタン、 ウィジェット ライブラリに移動します。この中には、大量の既製のページ、テンプレート、セクションが含まれています。ただし、メガ メニュー セクションを作成するには、 セクション

Elementor でメニュー項目を作成およびカスタマイズします。メガ メニューのアイテムのレイアウトを選択し、思う存分カスタマイズを開始する必要があります。

ここで見つかります 3部 (レイアウト、スタイル、詳細) ElementsKit を使用して Elementor メニューをカスタマイズする方法:

レイアウト：
このセクションでは、次のことを確認します。 複数のオプション Elementor メニューのレイアウトと構造を編集します。メガメニューの表示方法を完全に制御できます。

ElementsKit メガ メニュー ウィジェットを使用すると、 コンテンツの幅、 全画面メニューにすることも、好みのサイズにカスタマイズすることもできます 右または左にスライドして。 カラムギャップ メガメニュー間のメニューもお好みに合わせてカスタマイズできます。

ElementsKit Elementor メニューを使用すると、メニュー項目の高さを編集できます。編集するための複数のオプションもあります 垂直方向の整列, オーバーフロー, HTMLタグ それはあなたの要求に応じて変更できます。

スタイル：
ElementsKit メガ メニュー スタイル オプションを使用すると、メニュー全体の外観を変更できます。より具体的には、 背景, 背景オーバーレイ, 国境, シェイプディバイダー、 そしてもちろん タイポグラフィ.

ElementsKit の Elementor メガ メニュー ウィジェットは救世主です。メニュー項目を最大限に活用するのに役立つ、さまざまなメニュー スタイル要素が含まれています。 

高度な：
WordPress メニュー用のメニュースタイルの高度なオプションは、あなたが常に探していたものです。はい、ElementsKit Elementor メガ メニュー オプションは、高度なセクション全体にアクセスして編集するのにも役立ちます。 

新しいメニュー レイアウトを作成できます。 ElementsKit には より高度な代替手段 合計するような 効果, 粘着性のある, モーションエフェクト, ホバリング カスタマイズなど、編集エクスペリエンスをさらに向上させ、メガ メニューをよりスマートにする多くの機能が含まれています。 

Elementor のナビゲーション メニューのセットアップ

最後で最も重要な部分は、Elementor Web サイトでヘッダーを作成するために必要なメガ メニューを同期することです。 

次に、Elementor カスタム ヘッダー テンプレートを作成する方法を説明します。さて、ElementsKit ナビゲーション メニュー ウィジェットにはもう 1 つの良いニュースがあります。事前に構築された WordPress メニュー レイアウト オプションをクリックするだけで、ナビゲーション メニュー レイアウトを作成できます。 

始めましょう！ 

まず最初に、次の場所に行く必要があります。 ElementsKit WordPress ダッシュボードで、 ヘッダーフッター、Web サイト上のナビゲーション メニュー ウィジェットをアクティブにします。 

次に、をクリックします 新しく追加する テンプレートの直後に記載されています。 

をクリックした後、 新しく追加する ボタンA テンプレートの設定 ポップアップが表示されます。これは、Web サイトにメガ メニューを統合する最後の部分です。

このセクションでは、ナビゲーション メニューに「」という名前を付ける必要があります。 ヘッダーのタイトル。変更することもできます ヘッダーの状態 そして、「アクティベーション」をクリックします (準備が整い、メガ メニュー項目に満足している場合)。

最後の部分では、忘れずにクリックしてください。 エレメントで編集する 直前のボタン 変更内容を保存 ボタン。 

ここでは、ElementsKit のナビゲーション メニュー ウィジェットを使用してメガ メニューを追加する 2 つの方法を説明します。

方法 1: 

Web サイトにナビゲーション メニュー ウィジェットを追加するには、それをクリックした後に実行できる最初の方法 エレメントで編集する ボタンをクリックするだけです。ElementsKit をクリックするだけです。 ウィジェットアイコン それからに行きます セクション を選択し、 ヘッダースタイル どちらでもお好みで。 

その後、あなたのものが表示されます ヘッダ WordPress ダッシュボードから追加したタイトルが選択画面に表示されます。 メニューセクション。ヘッダー タイトルをクリックするだけで、すべてのメガ メニュー項目が表示されることがわかります。

方法 2:

ナビゲーション メニュー ウィジェットを埋め込むこともできます。 ドラッグドロップオプション また、その周囲のさまざまな要素 (画像、ビデオ、他のセクションなど) も追加します。

必要なのは、任意のタイプのセクションを選択することだけです (この例では 3 つのセクションを選択しました)。 Elementor ダッシュボードから追加したいウィジェットを検索します。

この例では、画像、ナビゲーション メニュー、およびビデオをドラッグしました。セクションとウィジェットは好きなだけ追加できます。 

その後、再度同じ方法を使用してアクティベートできます。 ナビメニュー: で メニューを選択 セクションに、WordPress ダッシュボードから追加したヘッダー タイトルが表示されます。ヘッダー タイトルをクリックするだけで、すべてのメガ メニュー項目が挿入されていることがわかります。 

これで、ナビ メニュー ウィジェットの使用が非常に簡単であることがわかり、ロックン ロールの準備は完了です。 ElementsKit ではオフキャンバス メニューも作成できることに注意してください。 

🛠 追加情報
について詳しく知るには、 ElementsKit のオフキャンバス メニュー、最新のビデオをチェックすることを忘れないでください。 ElementsKit を使用してオフキャンバス メニューを構築する

最終的な考え

メガ メニューは、Web サイトのナビゲーションを改善するための素晴らしいツールです。彼らはあなたを許可します 多数のカテゴリや商品をユーザーが使いやすいように整理するため コンテンツを閲覧するには。

Elementor 用の ElementsKit アドオンを使用してメガ メニューを作成すると、いつでも無料で最高のサポートが提供されます。自分で追加する場合は、ElementsKit アドオンの組み込み Nav Mega Menu オプションから始めることができます。

ElementsKit は簡単で、セットアップや調整にほとんど時間がかからず、使い方も簡単です。ただし、この記事がメガメニューの全体像の概要を説明するのに十分役立つことを願っています。

Mega Menu、Nav Menu、またはその機能に関してご質問がある場合は、以下にコメントを残してください。

この記事が気に入った場合は、私たちのブログに参加すると、さらに役立つヒントやブログがきっと見つかります。 WPmet コミュニティ フォローしてください フェイスブック/ツイッター。最後に、チャンネル登録も忘れずにお願いします YouTube 役立つチュートリアルをご覧ください。