WordPressのメニューを作成する方法|ブロックテーマとクラシックテーマの手順を解説

WordPress

WordPressで固定ページを作っても、読者がそのページへ移動できる導線がなければ見つけてもらいにくくなります。そこで必要になるのが、ヘッダーやフッターに表示するナビゲーションメニューです。トップページ、プロフィール、お問い合わせ、カテゴリー一覧などを分かりやすく並べることで、初めて訪れた人でも目的の情報へ進みやすくなります。

ただし、WordPressのメニュー作成画面は、使っているテーマによって異なります。ブロックテーマでは「外観」からサイトエディターを開いてナビゲーションを編集し、クラシックテーマでは「外観」の「メニュー」画面を使うのが基本です。管理画面に「メニュー」が見当たらなくても、故障とは限りません。

この記事では、初心者が迷いやすいテーマの見分け方から、メニュー項目の選び方、ブロックテーマとクラシックテーマそれぞれの作成手順、表示されないときの確認方法まで順番に解説します。画面名はテーマやWordPressの状態によって多少異なることがありますが、考え方と確認順は共通して使えます。

  1. WordPressのメニューが果たす役割
    1. ヘッダーメニューとフッターメニューの違い
  2. 作業前に準備しておくこと
    1. メニューに載せる候補を整理する
    2. リンク先を先に確認する
  3. ブロックテーマとクラシックテーマを見分ける
    1. 「外観」にメニューがない場合
  4. ブロックテーマでメニューを作る手順
    1. サイトエディターを開く
    2. ヘッダーのナビゲーションブロックを選ぶ
    3. 新しいメニューを作成する
    4. ページとカスタムリンクを追加する
    5. 順番とサブメニューを整える
    6. 表示設定を確認して保存する
  5. クラシックテーマでメニューを作る手順
    1. 新しいメニューを作成する
    2. ページやカテゴリーを追加する
    3. 並び順と階層を設定する
    4. 表示位置を割り当てて保存する
  6. 分かりやすいメニュー構成の考え方
    1. 項目数を絞る
    2. 名称の粒度をそろえる
    3. 現在地と次の行動が分かるようにする
  7. 保存後に確認する項目
  8. メニューが表示されないときの確認順
    1. 表示位置またはナビゲーションブロックを確認する
    2. 編集したメニューを取り違えていないか確認する
    3. キャッシュを確認する
    4. テーマ固有のヘッダー設定を確認する
    5. 変更を戻す判断をする
  9. メニュー編集でよくある失敗
    1. 未公開ページをメニューに入れる
    2. 階層を深くしすぎる
    3. 外部リンクを確認せず登録する
    4. パソコン表示だけで完了にする
  10. 公開前の最終チェック
  11. 運用開始後にメニューを改善する方法
    1. 追加したページをすぐ載せる必要があるか判断する
    2. 項目名を読者の言葉に合わせる
    3. リンク切れと転送を定期的に確認する
    4. 季節やキャンペーンに合わせた変更を戻す
    5. テーマ変更後は必ず再確認する
    6. 改善履歴を簡単に残す
  12. メニューは小さく作って定期的に改善する
  13. 参考にした公式情報

WordPressのメニューが果たす役割

メニューは、サイト内の主要なページを案内するためのリンク集です。単にリンクを横一列に並べるものではなく、サイト全体の構成を読者へ伝える案内板でもあります。どのページを上位に置き、どのページを下位にまとめるかによって、サイトの分かりやすさが変わります。

たとえば個人ブログなら、トップページ、プロフィール、記事カテゴリー、お問い合わせをヘッダーに置くと、サイトの内容と運営者情報を短時間で把握してもらえます。事業サイトなら、サービス案内そのものをコラム側に重複して作るのではなく、本体サービスサイトの該当ページへ必要な範囲で案内する設計が考えられます。

メニューには多くの項目を詰め込むほど親切になるわけではありません。選択肢が増えすぎると、読者はどこを押せばよいか迷います。まずは重要なページだけで小さく作り、アクセス状況やサイトの成長に合わせて調整する方が管理しやすくなります。

ヘッダーメニューとフッターメニューの違い

ヘッダーメニューは、ページ上部で主要な導線を示す役割があります。頻繁に見てほしいページや、サイトの内容を理解するために重要なページを優先します。スマートフォンではメニューアイコンの中に折りたたまれることが多いため、実機表示の確認が欠かせません。

フッターメニューは、ページを読み終えた人の次の行動を支えます。プライバシーポリシー、運営者情報、サイトマップなど、常に目立たせる必要はないものの、どのページからでも到達できるようにしたい情報に向いています。テーマによってはヘッダー用とフッター用で別の表示位置が用意されています。

作業前に準備しておくこと

メニュー編集を始める前に、掲載するページとリンク先を確認します。存在しないページを先にメニューへ置くと、空のページを公開したり、リンク切れを作ったりする原因になります。未公開ページへの導線は作らず、公開済みで内容を確認できるページを中心に構成しましょう。

操作前には現在のメニューを記録します。パソコン表示とスマートフォン表示のスクリーンショットを残し、項目名、順番、サブメニューの親子関係、表示位置をメモしておくと、変更後に比較できます。事業サイトなど重要度が高いサイトでは、テーマ側の変更を伴う場合に備えてバックアップも確認します。

メニューに載せる候補を整理する

最初のメニューでは、読者がサイトを理解し、必要な情報へ進むためのページを優先します。一般的な候補は次のとおりです。

  • トップページ
  • 記事一覧または主要カテゴリー
  • プロフィールや運営者情報
  • お問い合わせページ
  • 読者に常時案内したい固定ページ

プライバシーポリシーや免責事項は、ヘッダーよりフッターにまとめると主要導線がすっきりします。記事単位のリンクを大量に並べるより、カテゴリーやまとめページを入口にする方が更新の手間も減らせます。

リンク先を先に確認する

候補ページを別タブで開き、公開状態、URL、ページタイトル、スマートフォンでの読みやすさを確認します。古いURLや転送前のURLを登録すると、余計なリダイレクトが発生することがあります。外部サイトへリンクする場合は、URLの入力間違いと接続先を必ず確認してください。

メニューに表示する短い名称と、ページ本来のタイトルは同じでなくても構いません。長いページタイトルをそのまま使うと折り返しやすいため、「運営者プロフィール」を「プロフィール」とするように、意味が変わらない範囲で簡潔にします。

ブロックテーマとクラシックテーマを見分ける

メニュー作成で最も大きな分岐は、現在のテーマがブロックテーマかクラシックテーマかです。ブロックテーマではヘッダーやフッターを含むサイト全体をブロックで編集でき、サイトエディターのナビゲーション機能を使います。クラシックテーマでは、従来のメニュー編集画面やカスタマイザーを使うことが一般的です。

管理画面の「外観」を開き、「エディター」が表示される場合はブロックテーマである可能性が高く、「メニュー」や「カスタマイズ」が表示される場合はクラシックテーマである可能性が高いと考えられます。ただし、テーマや権限、プラグインによって表示が変わるため、項目名だけで断定せず、現在有効なテーマの説明も確認しましょう。

「外観」にメニューがない場合

「外観」に「メニュー」がなく「エディター」がある場合は、ブロックテーマの操作方法へ進みます。WordPress公式ドキュメントでは、サイトエディターのナビゲーション管理はブロックテーマで利用する機能として案内されています。クラシックテーマの手順を無理に探す必要はありません。

「エディター」も「メニュー」も見当たらない場合は、ログイン中のユーザー権限を確認します。外観を変更できない権限では必要な画面が表示されません。管理者へ確認し、権限を自己判断で広げないようにしてください。

ブロックテーマでメニューを作る手順

ブロックテーマでは、ナビゲーションメニューを作ることと、そのメニューをヘッダーなどへ配置することを分けて考えると理解しやすくなります。メニューを保存しただけでは表示されず、ナビゲーションブロックに作成したメニューを割り当てる必要がある場合があります。

サイトエディターを開く

WordPress管理画面で「外観」から「エディター」を開きます。左側のメニューから「ナビゲーション」を選べる場合は、そこで既存メニューの一覧や内容を確認します。画面構成はWordPressのバージョンやテーマによって異なるため、「デザイン」「パターン」「テンプレートパーツ」などからヘッダーへ進む場合もあります。

既存のメニューがあるときは、いきなり削除せず、名前と使用場所を確認します。同じメニューが複数のヘッダーやテンプレートで使われている可能性があるためです。大きく組み替える場合は、複製機能が利用できるなら複製してから試すと戻しやすくなります。

ヘッダーのナビゲーションブロックを選ぶ

サイトエディターでヘッダーのテンプレートパーツを開き、ナビゲーションブロックを選択します。画面上で選びにくい場合はリスト表示を使うと、グループ、行、サイトロゴ、ナビゲーションなどの入れ子構造を確認できます。親のヘッダー全体ではなく、メニュー項目を持つナビゲーションブロックを選ぶことが重要です。

ナビゲーションブロックが存在しない場合は、ブロック追加から「ナビゲーション」を挿入します。既存のヘッダー配置を崩さないよう、ロゴやボタンとの並びをリスト表示で確認しながら追加してください。

新しいメニューを作成する

ナビゲーションブロックの設定またはリスト表示でメニューオプションを開き、「新しいメニューを作成」に相当する操作を選びます。最初からページ一覧が表示される場合は、編集操作によって個別のページリンクへ変換してから、必要な項目だけに整えられます。

メニューには管理しやすい名前を付けます。「メニュー1」ではなく、「ヘッダー用」「フッター用」のように用途が分かる名前がおすすめです。名前は読者に表示されない管理用情報として使われることが多いものの、テーマや設定画面での識別に役立ちます。

ページとカスタムリンクを追加する

ナビゲーションブロック内の追加ボタンから、公開済みページを検索して追加します。サイト内ページは候補から選び、外部サイトや特定のURLへ案内するときはカスタムリンクを使います。新しいページをその場で作成・公開できる表示が出る場合がありますが、内容がないページを誤って公開しないよう注意してください。

追加後は各項目のラベルとURLを確認します。リンクラベルは短く具体的にし、「こちら」より「プロフィール」「お問い合わせ」のように移動先が分かる表現を使います。外部リンクを新しいタブで開くかどうかは、読者の操作を予測して必要な場合だけ設定します。

順番とサブメニューを整える

項目は重要度と利用頻度を基準に並べます。最初にトップページ、続いて主要カテゴリーや案内ページ、最後にお問い合わせを置くなど、一貫した流れにします。ドラッグ操作が難しい場合は、ブロックの移動ボタンやリスト表示を使うと誤操作を減らせます。

サブメニューを作るときは、親となる項目の下へ子項目を入れます。階層を深くしすぎると、スマートフォンで目的の項目へ到達しにくくなるため、初心者のサイトでは一段程度から始めるのが無難です。親項目そのものがクリックできるか、展開専用かもテーマの表示で確認します。

表示設定を確認して保存する

ナビゲーションブロックには、横並びか縦並びか、項目の配置、文字色、背景色、間隔、モバイル表示などの設定があります。最初はテーマの初期設定を生かし、必要な部分だけ変更します。装飾を増やす前に、文字の読みやすさと押しやすさを優先してください。

保存ボタンを押すと、ナビゲーションだけでなくヘッダーやテンプレートパーツの変更も保存対象として表示されることがあります。意図しない変更が含まれていないか確認してから保存します。保存後はサイト表示を新しいタブで開き、メニューが正しい位置に表示されるか確認します。

クラシックテーマでメニューを作る手順

クラシックテーマでは、管理画面の「外観」から「メニュー」を開いて作成する方法が基本です。テーマによっては「外観」の「カスタマイズ」内にメニュー設定が用意され、プレビューしながら編集できます。ここでは従来のメニュー編集画面を基準に説明します。

新しいメニューを作成する

「外観」から「メニュー」を開き、「新しいメニューを作成」に相当するリンクを選びます。メニュー名へ「ヘッダーメニュー」など用途が分かる名前を入力し、作成ボタンを押します。既存メニューがある場合は、編集対象を取り違えないよう選択欄の名前を確認してください。

ページやカテゴリーを追加する

画面左側の「固定ページ」から公開済みページを選び、「メニューに追加」を押します。必要に応じて投稿、カテゴリー、カスタムリンクも追加できます。項目の種類が見当たらない場合は、画面上部の表示オプションで表示対象を確認します。

追加した項目は右側のメニュー構造へ並びます。各項目を開くとナビゲーションラベルを変更できます。元ページのタイトルはそのまま残し、メニューに表示する文言だけを短くすることができます。

並び順と階層を設定する

項目を上下へドラッグすると表示順を変更できます。項目を少し右へずらして親項目の下へ置くと、サブメニューになります。意図せず右へずれると階層が変わるため、保存前にすべての項目の左端を見比べてください。

ドラッグ操作が難しい場合は、各項目を開いて移動操作を使えることがあります。キーボード操作や狭い画面では、無理にドラッグするより移動リンクを使う方が確実です。

表示位置を割り当てて保存する

メニューを作成しただけでは、サイトに表示されないことがあります。画面下部の「メニュー設定」や「表示位置」で、メインメニュー、ヘッダー、フッターなどテーマが用意した場所を選びます。表示位置の名称と数はテーマごとに異なります。

保存後、サイトのパソコン表示とスマートフォン表示を確認します。別のメニューが表示される場合は、編集したメニューと割り当てた表示位置の組み合わせを再確認してください。

分かりやすいメニュー構成の考え方

操作が完了しても、項目が分かりにくければ読者は利用しません。メニューはサイト運営者の分類ではなく、読者の目的に合わせて並べます。社内用の呼び方、曖昧な略語、意味が重なる項目を避け、初見でも移動先を予測できる名称を使いましょう。

項目数を絞る

ヘッダーでは、優先度が低い項目をフッターやサイトマップへ移し、主要な選択肢を絞ります。特にスマートフォンでは表示領域が狭く、長いメニューはスクロールや展開操作を増やします。追加したい項目が多いときは、親カテゴリーを作り、その配下へ関連項目をまとめます。

名称の粒度をそろえる

「ブログ」「制作について」「お問い合わせはこちら」のように表現の長さや視点がばらばらだと、見た目と理解の両方でまとまりに欠けます。「ブログ」「プロフィール」「お問い合わせ」のように名詞を中心にそろえると、短時間で把握しやすくなります。

カテゴリーを並べる場合も、「WordPress」「SEO」「画像改善」のように分類軸をそろえます。読者が違いを判断できないカテゴリーは統合を検討し、似た項目を隣接させすぎないようにします。

現在地と次の行動が分かるようにする

テーマによっては、現在表示しているページのメニュー項目が色や下線で強調されます。この表示が背景色と十分に区別できるか確認します。また、メニューだけですべてを案内しようとせず、記事本文の関連リンクやパンくずリストなど、別の導線と役割を分けます。

保存後に確認する項目

メニューは管理画面で完成したように見えても、実際のサイトでは折り返し、重なり、リンク間違いが起きることがあります。ログイン中の表示だけで判断せず、シークレットウィンドウや別のブラウザでも確認すると、キャッシュや権限の影響を切り分けやすくなります。

  • すべての項目が意図した順番で表示される
  • 各リンクが正しいページへ移動する
  • サブメニューがマウスとタッチ操作の両方で開く
  • スマートフォンのメニューを開閉できる
  • 長い項目名が不自然に折り返さない
  • 文字色と背景色に十分な差がある
  • キーボード操作でも項目へ移動できる
  • ログアウト状態でも必要なページが表示される

変更直後だけでなく、新しい固定ページやカテゴリーを追加したときにもメニューを見直します。自動でページを追加する設定を使っている場合は、意図しないページが増えていないか定期的に確認してください。

メニューが表示されないときの確認順

保存したのにメニューが見えない場合は、闇雲に作り直さず、表示位置、使用中のメニュー、キャッシュの順に確認します。原因を一つずつ切り分けると、既存のメニューを壊さずに解決できます。

表示位置またはナビゲーションブロックを確認する

クラシックテーマでは、作成したメニューがヘッダーなどの表示位置へ割り当てられているか確認します。ブロックテーマでは、ヘッダー内のナビゲーションブロックが作成したメニューを参照しているか確認します。メニューの保存と配置は別の操作になる点が重要です。

編集したメニューを取り違えていないか確認する

ヘッダー用、フッター用、過去のメニューなど複数存在すると、別のメニューを編集していることがあります。管理用の名前、項目内容、割り当て先を見比べ、現在表示されているメニューを特定します。不要なメニューでも、使用場所が分かるまでは削除しないでください。

キャッシュを確認する

キャッシュプラグイン、サーバーキャッシュ、CDN、ブラウザキャッシュが古いヘッダーを表示していることがあります。まず別ブラウザやシークレットウィンドウで確認し、それでも古い場合は利用中の仕組みに応じてキャッシュを消去します。キャッシュ機能を一度にすべて変更すると原因が分からなくなるため、一つずつ確認します。

テーマ固有のヘッダー設定を確認する

テーマ独自のヘッダービルダーやページビルダーが標準メニューとは別の表示を管理している場合があります。テーマの説明書で、ヘッダーの編集場所とメニューの割り当て方法を確認します。標準機能とテーマ独自機能の両方を変更すると二重表示になることがあるため、現在どちらが使われているかを先に特定します。

変更を戻す判断をする

ヘッダー全体が崩れた、スマートフォンで操作できない、重要ページへ移動できない場合は、追加変更を重ねず、記録した変更前の状態へ戻します。保存履歴やリビジョン、複製したメニューが利用できる場合は活用します。復旧方法が分からない事業サイトでは、変更内容と発生時刻を記録して制作者や保守担当へ相談しましょう。

メニュー編集でよくある失敗

未公開ページをメニューに入れる

作成途中のページへリンクすると、読者が内容のないページや権限エラーに遭遇します。メニューへ追加するのは公開済みで内容確認が終わったページに限り、公開予定のページは原稿と公開準備が完了してから追加します。

階層を深くしすぎる

サブメニューを何段も作ると、マウス操作では開けてもスマートフォンで選びにくくなります。メニューは情報構造をすべて再現する場所ではありません。主要な入口だけを示し、詳細な分類はカテゴリー一覧やサイトマップへ任せます。

外部リンクを確認せず登録する

URLの貼り間違い、httpとhttpsの違い、古いキャンペーンページへのリンクなどに注意します。外部サイトのリンクは管理外で変更される可能性があるため、定期的にリンク先を確認します。

パソコン表示だけで完了にする

スマートフォンではメニューアイコン、オーバーレイ、サブメニューの開き方がパソコンと異なります。文字が読めるだけでなく、指で押しやすいか、閉じる操作が分かるか、画面外へはみ出さないかまで確認します。

公開前の最終チェック

メニュー変更を完了する前に、次の項目を確認します。すべて満たしていれば、初心者のサイトでも大きな混乱を起こしにくい状態です。

  • 使用中のテーマに合った編集画面を使っている
  • 公開済みの重要ページだけを登録している
  • メニュー名から移動先を予測できる
  • 項目数と階層が多すぎない
  • ブロックテーマではナビゲーションブロックへメニューを割り当てた
  • クラシックテーマでは表示位置を割り当てた
  • パソコンとスマートフォンで表示を確認した
  • すべてのリンク先を実際に開いた
  • 変更前の状態へ戻すための記録がある

運用開始後にメニューを改善する方法

メニューは、作成時の予想だけで最適な形を決めるのが難しい要素です。公開後に実際の利用状況を見ながら、項目名や順番を少しずつ改善します。ただし、短期間に何度も大きく変えると、よく利用する読者が迷うため、一度に変更する範囲を絞りましょう。

追加したページをすぐ載せる必要があるか判断する

新しい固定ページを公開するたびにヘッダーへ追加すると、メニューはすぐに長くなります。そのページがサイト全体の主要な入口なのか、特定の記事から案内すれば十分なのかを考えます。多くの記事に共通して必要な案内ならメニュー候補になりますが、期間限定の告知や一部の読者だけが使うページは本文内リンクの方が適している場合があります。

項目名を読者の言葉に合わせる

運営者には分かりやすくても、初めて訪れた人には意味が伝わらない名称があります。たとえば独自のサービス名だけを表示するより、必要に応じて内容が分かる一般語を添えた方が移動先を予測しやすくなります。一方で、ラベルを説明文のように長くするとヘッダーが崩れやすいため、短さと具体性の両方を確認します。

問い合わせが多い内容や、読者がサイト内検索で探している言葉が分かる場合は、メニュー表記の改善材料になります。ただし、アクセス解析の数値だけで判断せず、サイトの目的やページの重要性も合わせて考えましょう。

リンク切れと転送を定期的に確認する

固定ページのスラッグを変更したり、外部サイトのURLが変わったりすると、メニューから古いURLへ移動することがあります。転送されるから問題ないと放置せず、メニューにはできるだけ現在の正規URLを登録します。削除したページへのリンクが残っていないかも定期的に確認してください。

季節やキャンペーンに合わせた変更を戻す

期間限定ページをメニューへ追加した場合は、終了後に外す日を決めておきます。公開終了ページを残すと、読者が古い情報を見たり、申し込めないページへ移動したりします。開始時に変更前の構成を記録しておけば、終了後に元へ戻しやすくなります。

テーマ変更後は必ず再確認する

テーマを変更すると、表示位置の名前、ナビゲーションブロックの配置、モバイルメニューの動作が変わることがあります。メニューの項目データが残っていても、ヘッダーへの割り当てが外れる場合があります。テーマ変更後はトップページだけでなく、投稿、固定ページ、カテゴリー、検索結果など複数の画面でヘッダーとフッターを確認します。

改善履歴を簡単に残す

事業サイトや複数人で運営するサイトでは、変更日、変更した項目、理由、確認した端末を短く記録します。問題が起きたときに、いつ何を変えたか分かれば原因を切り分けやすくなります。大がかりな管理表でなくても、保守メモに一行残すだけで役立ちます。

メニューは小さく作って定期的に改善する

WordPressのメニュー作成では、最初にブロックテーマかクラシックテーマかを見分けることが重要です。ブロックテーマならサイトエディターとナビゲーションブロック、クラシックテーマなら「外観」の「メニュー」と表示位置を中心に設定します。どちらも、メニューを作るだけでなく、実際の表示場所へ正しく割り当てるところまでが一連の作業です。

完成後は、項目数、名称、リンク先、スマートフォンでの操作を確認します。最初から複雑な階層を作らず、読者にとって重要な入口だけを並べ、サイトの成長に合わせて見直しましょう。メニューは一度作って終わりではなく、新しいページを公開したときやサイト構成を変えたときに更新する案内板です。

参考にした公式情報