WordPressの投稿/ページにナビゲーションメニューを追加する方法

多くの読者から、自分のウェブサイトにメニューが表示されない理由や、特定のページや投稿に異なるメニューを作成できるかどうかについて質問がありました。

両方の質問に対する答えは「はい」ですが、WordPressの投稿やページにメニューを追加するプロセスは、使用するテーマによって異なります。

お役に立てるよう、WordPressのナビゲーションメニューを投稿やページに追加する方法を説明するチュートリアルを作成しました。

WordPressの投稿/ページにナビゲーションメニューを追加する理由

ナビゲーションメニューは、ウェブサイトの重要なエリアを指すリンクのリストで、通常はヘッダーに配置されます。これらのリンクは、訪問者が探しているものを見つけるのに役立ち、顧客体験を向上させ、WordPressウェブサイトに長く滞在してもらうことができます。

メニューの正確な場所は、WordPressテーマによって異なります。ほとんどのテーマでは複数のエリアにメニューを表示できますが、投稿やページにナビゲーションメニューを追加する必要がある場合もあります。

たとえば、特定のセールスページで言及されているすべての製品にリンクするユニークなメニューを追加したい場合があります。

メニューを使用して、WordPressブログで特定の投稿を表示することもできます。このナビゲーションメニューを配置することで、読者がさらに多くのコンテンツをチェックするように促すことができます。

これで、WordPressのナビゲーションメニューを任意の投稿またはページに追加する方法を見ていきましょう。使用したい方法に直接ジャンプするには、以下のクイックリンクを使用してください。

方法1：テーマカスタマイザーを使用する（クラシックテーマのみ）

クラシックテーマを使用しており、ページリンクのリストがページや投稿に表示されない場合は、おそらくまだメニューを作成しておらず、テーマのメニューロケーションに追加していない可能性が高いです。

しかし、心配しないでください。プロセスは非常に簡単です。まず、WordPress管理ダッシュボードの「外観 » メニュー」ページに移動できます。

そこでは、WordPressにナビゲーションメニューを追加する方法に関する初心者向けガイドの手順に従うことができます。

各クラシックテーマには異なるメニューロケーションがあることに注意してください。プライマリナビゲーションメニュー（ヘッダーエリアの内側または周囲）、フッターメニュー、場合によってはサイドバーメニューのロケーションが含まれる場合があります。

希望するメニューの場所がテーマで提供されていない場合は、WordPressでカスタムナビゲーションメニューを作成する方法に関するガイドを読むことができます。ここでは、テーマにカスタムメニューの場所を追加する方法を説明しています。

方法2：WordPressナビゲーションブロックを使用する（個々のページおよび投稿に最適）

WordPressのナビゲーションメニューを投稿やページに追加するもう一つの方法は、組み込みのナビゲーションブロックを使用することです。これにより、ページや投稿のどこにでもナビゲーションメニューを表示できますが、各メニューを手動で追加する必要があります。

この方法を開始するには、WordPressナビゲーションメニューを追加したい投稿またはページを開きます。次に、「+」ボタンをクリックして、ページに新しいブロックを追加します。

ポップアップで「Navigation」と入力します。

右側のブロックが表示されたら、クリックしてページまたは投稿に追加します。

ナビゲーションブロックは、デフォルトでメニューのいずれかを表示します。

メインメニューの代わりに別のメニューを追加したい場合は、「ブロック」タブを開きます。次に、「リスト表示」タブを選択する必要があります。

ここで、「メニュー」の横にある3つのドットをクリックすると、利用可能なすべてのメニューオプションを表示できます。

次に、使用したいメニュー名を選択するか、新しいメニューを作成します。

場合によっては、リンクをさらに追加してメニューをカスタマイズしたいことがあります。たとえば、WooCommerceでオンラインストアを運営している場合、そのページで言及されているすべてのeコマース製品へのリンクを作成するかもしれません。

ナビゲーションメニューにカスタムリンクを追加するには、「リスト表示」タブの「+」アイコンをクリックします。

これにより、さまざまなオプションが表示されるポップアップが開きます。

WordPressサイトの任意のページにリンクを追加するには、「ページリンク」をクリックするだけです。

ドロップダウンメニューからページを選択するか、ページタイトルを入力し始めることができます。目的のページが表示されたら、クリックしてカスタムメニューに追加します。

ナビゲーションメニューにさらにページを追加するには、上記で説明したのと同じプロセスを繰り返すだけです。

WordPressメニューにソーシャルアイコンを追加することもできます。これにより、Twitter、Facebook、YouTube、LinkedInなどでフォローを促すことができます。

開始するには、「リスト表示」タブの「+」アイコンをクリックします。今回は「ソーシャルアイコン」を選択します。

ここに新しいエリアが追加され、ソーシャルアイコンを追加できるようになります。

開始するには、新しい「+プラスをクリックして追加」セクションをクリックします。

次に、リンクしたいソーシャルメディアネットワークを選択します。

例えば、「Twitter」を選択してWordPressでTwitterページを宣伝することができます。

その後、ソーシャルアイコンを設定する必要があります。

正確な手順はソーシャルネットワークによって異なります。ただし、通常はアイコンを選択してクリックし、ソーシャルメディアプロフィールのURLを入力する必要があります。

これらの手順を繰り返すだけで、ナビゲーションメニューにさらにソーシャルアイコンを追加できます。

最後に、人々が興味のあるページ、投稿、製品などを見つけるのに役立つように、WordPressメニューに検索バーを追加することを検討してください。

WordPressには組み込みの検索機能がありますが、基本的なものであり、常に正確な結果を提供するとは限りません。そのため、サイト検索を改善するためにWordPress検索プラグインを使用することをお勧めします。

さらに良いことに、SearchWPのような高度なプラグインを選択すると、デフォルトのWordPress検索が置き換えられます。プラグインを設定すると、ナビゲーションメニュー内の検索ボックスを含め、サイト全体のすべての検索ボックスが自動的にSearchWPを使用するようになります。

WordPressの組み込み機能を使用している場合でも、SearchWPのような高度なプラグインを使用している場合でも、「検索」を選択するだけでメニューに検索バーを追加できます。

メニューの内容に満足したら、見た目を変更したくなるかもしれません。

メニューの配置や向きを含むレイアウトは、「設定」タブを選択することで変更できます。

その後、ナビゲーションメニューのスタイルを変更できます。「スタイル」タブを選択することで、背景色、文字色、タイポグラフィなどを変更できます。

変更を加えると、ライブプレビューが自動的に更新されます。これは、さまざまな設定を試して、WordPressブログに最適なものを見つけることができることを意味します。

設定できる設定は他にもたくさんありますが、投稿やページに役立つWordPressナビゲーションメニューを追加するために必要なのはこれだけです。

ナビゲーションメニューを公開する準備ができたら、「更新」または「公開」ボタンのいずれかをクリックしてください。

これで、このページまたは投稿にアクセスすると、ナビゲーションメニューが機能しているのがわかります。

方法3：フルサイトエディターを使用する（ブロックテーマのみ）

一部の投稿やページにのみナビゲーションメニューを追加したい場合は、方法1が最適です。ただし、各メニューを手動で追加する必要があるため、ウェブサイト全体で同じメニューを表示したい場合には最適なオプションではありません。

ブロックベースのテーマ（例：Hestia Pro）を使用している場合は、ページまたは投稿テンプレートにWordPressナビゲーションメニューを追加できます。

このメニューは、手動で追加する必要なく、すべてのページまたは投稿に表示されます。これは、常に同じナビゲーションメニューをまったく同じ場所に表示したい場合に最適です。

開始するには、WordPressダッシュボードで外観 » エディターに移動します。

左側のサイドパネルにいくつかのメニューが表示されます。

WordPressのページまたは投稿にナビゲーションメニューを追加するには、左側のサイドバーにある「テンプレート」をクリックします。

エディタには、WordPressテーマを構成するすべてのテンプレートが表示されます。

WordPress のブログ投稿にナビゲーションメニューを追加するには、「シングル」テンプレートを選択します。代わりにページにメニューを追加したい場合は、「ページ」テンプレートを選択します。

WordPressは、選択したテンプレートのプレビューを表示します。

このテンプレートを編集するには、小さな鉛筆アイコンをクリックしてください。

これが完了したら、左上にある青い「+」アイコンをクリックします。

表示される検索バーに「Navigation」と入力します。

正しいブロックが表示されたら、テンプレートにドラッグアンドドロップします。

デフォルトでは、ブロックはメニューのいずれかを表示します。代わりに別のメニューを追加したい場合は、「ブロック」タブをクリックします。その後、「リストビュー」を選択します。

これで、「メニュー」の横にある3つのドットをクリックすると、WordPressウェブサイトで作成したすべてのメニューが表示されます。

リストから任意のメニューを選択するだけです。

これが完了したら、方法1の手順に従って、メニューにページを追加したり、検索バーを追加したりできます。

ナビゲーションメニューの外観に満足したら、「保存」ボタンをクリックして公開します。これで、サイトにアクセスすると、すべてのWordPressページまたは投稿で同じナビゲーションメニューが表示されます。

フルサイトエディターとブロックエディターを使用すると、複数のナビゲーションメニューパターンを作成し、特定のページや投稿でのみ使用できます。これにより、多くの時間と労力を節約できます。

詳細については、WordPressのフルサイト編集に関する完全初心者ガイドをご覧ください。

方法4：カスタムWordPressテーマの作成（よりカスタマイズ可能）

もう1つのオプションは、カスタムWordPressテーマを作成することです。これはより高度な方法ですが、メニューが投稿またはページに表示される場所を完全に制御できます。

以前は、カスタムWordPressテーマを作成するために、複雑なチュートリアルに従ってコードを書く必要がありました。しかし、今ではSeedProdを使用して、独自のテーマを簡単に作成できるようになりました。

SeedProdは最高のドラッグ＆ドロップWordPressページビルダーであり、ProおよびEliteユーザーは高度なテーマビルダーも利用できます。これにより、コードを書かずに独自のWordPressテーマをデザインできます。

手順については、カスタムWordPressテーマを（コードなしで）簡単に作成する方法のガイドをご覧ください。

テーマを作成した後、WordPressウェブサイトの任意の場所にナビゲーションメニューを追加できます。

単純にSeedProd » Theme Builderに移動し、投稿またはページのレイアウトを制御するテンプレートを見つけます。通常は「Single Post」または「Single Page」になります。

これにより、テンプレートがSeedProdのドラッグアンドドロップページビルダーで開きます。

左側のメニューで「ウィジェット」セクションまでスクロールします。ここで、ナビゲーションメニューブロックを見つけて、レイアウトにドラッグします。

その後、ライブプレビューでナビゲーションメニューブロックをクリックして選択します。

次に、「メニューを選択」ドロップダウンを開き、表示したいメニューを選択します。

オプションでタイトルを「タイトル」フィールドに入力できるようになりました。これはWordPressナビゲーションメニューの上に表示されます。

メニューがウェブサイトでどのように表示されるかを確認するには、「適用」ボタンをクリックします。

次に、「高度」タブをクリックしてメニューをカスタマイズします。

タイトルを追加した場合は、テキストの色を変更したり、タイポグラフィを調整したり、見出しとメニュー項目の間にスペースを追加したりできます。

メニュー項目の色やフォントを変更することもできます。

これらの変更を行うには、「テキストのタイポグラフィ」と「テキストの色」の設定を使用するだけです。

その後、「詳細」タブの設定を使用して、スペーシングを変更したり、カスタムCSSを追加したり、さらにはCSSアニメーションを追加したりできます。

メニューの外観に満足したら、「SeedProd」ツールバーの「保存」ボタンをクリックしてください。次に、「公開」を選択します。

これで、ウェブサイトにアクセスすると、新しいページまたは投稿のレイアウトが機能しているのがわかります。

ナビゲーションメニューをカスタマイズするその他の方法を学ぶ

ナビゲーションメニューを次のレベルに引き上げたいですか？メニューをカスタマイズするために読める専門家のガイドをいくつかご紹介します。

• WordPressに矢印キーによるキーボードナビゲーションを追加する方法
• WordPressで垂直ナビゲーションメニューを作成する方法
• WordPressでパンくずナビゲーションリンクを表示する方法
• WordPressでスティッキーなフローティングナビゲーションメニューを作成する方法
• WordPressでログインユーザーに異なるメニューを表示する方法
• WordPressでドロップダウンメニューを作成する方法（初心者向けガイド）
• WordPress でメニューに条件付きロジックを追加する方法（ステップバイステップ）

この記事が、WordPress の投稿やページにナビゲーションメニューを追加する方法を学ぶのに役立ったことを願っています。また、WordPress テーマにスライドパネルメニューを追加する方法に関する記事や、WordPress でメニュー項目をハイライトする方法の初心者向けガイドも参照することをお勧めします。

この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。