WordPressのメニューを編集する方法｜ブロックテーマの追加・並べ替え・スマホ確認
ヘッダーのナビゲーションを、公開ページと結び付ける実践手順。ページ一覧との違い、メニュー名とリンク先、スマホで開閉できない場合まで4枚の図解で説明します。
この記事でわかること
WordPressのブロックテーマでは、ヘッダー内の「ナビゲーション」ブロックを選んでメニューを編集します。 本文を変える作業とは別です。表示する名前と移動先を確認し、スマホでメニューを開く・閉じるところまで試します。
この記事はブロックテーマが対象です。「外観」→「メニュー」で操作するクラシックテーマの手順とは分かれます。項目が見つからないことだけを理由に、テーマを変更しないでください。
1．先にメニューに載せるページを決める
架空の体験教室なら、次の4項目を用意します。これは編集部の構成例で、メニューの項目数に共通の正解があるという意味ではありません。
| 見せる名前 | 移動先 | 読者が知りたいこと |
|---|---|---|
| 教室について | 教室案内の固定ページ | どんな教室か |
| 体験内容 | 体験案内の固定ページ | 何ができるか |
| お知らせ | 投稿一覧 | 最近の変更 |
| お問い合わせ | 問い合わせページ | 質問する方法 |
公開URLがまだないページは、先に本文を作って状態を確認します。「新しいページを作成」の操作で空のページを増やすと、メニューだけ立派で中身がない状態になるためです。
編集前のメニューは画面保存またはメモで残します。並び順とリンク先に加え、どのページのヘッダーを編集しているかも書いておきます。
2．サイトエディターから対象のナビゲーションを選ぶ
管理画面の「外観」からサイトエディターを開き、編集対象のヘッダーへ進みます。サイトエディターの「ナビゲーション」一覧からメニューを探せる構成もあります。
ヘッダーはページ上部の共通部分です。画面上で選びにくければ、エディターのリスト表示を開き、ヘッダーの中にある「ナビゲーション」を探します。本文に新しいナビゲーションを追加する前に、すでにあるものを選んでいるか確認してください。
| 画面の状態 | 次にすること |
|---|---|
| 「外観」→「エディター」がありヘッダーを編集できる | ナビゲーションブロックを探す |
| 「外観」→「メニュー」で場所を割り当てる画面 | クラシックテーマ側の手順を確認する |
| 外観そのものがない | 管理者に編集権限と使用テーマを確認する |
| 選ぶと本文の段落だけが反応する | リスト表示からヘッダー内の部品を選ぶ |
3．「ページ一覧」のままなら、個別編集へ切り替える
初期状態でページ一覧ブロックが入っている場合、公開ページが自動的にメニューへ並びます。個々の項目を選んで編集する操作を確定すると、独立したページリンクの集まりへ変わります。
個別リンクへ変換したあとは、新しく公開したページが自動追加されるとは限りません。 「ページは公開したのにメニューにない」という場合、この違いを確認してください。
すでに個別の項目を編集できるなら、変換操作は不要です。既存メニューがあるのに新規メニューを何個も作る必要もありません。
4．既存ページを追加し、名前とリンク先を整える
- ナビゲーション内の「＋」からページを追加します。
- ページ名の一部を入力し、目的の既存ページを選びます。
- 表示文字を、読者にわかる短い名前へ整えます。
- リンク先が目的のページになっているか確認します。
- リスト表示や移動ボタンで順序を整えます。
表示文字を「体験内容」にしても、リンク先が「お問い合わせ」なら別のページに移動します。文字とURLは二つとも確認します。
外部ページを登録する場合はカスタムリンクを使い、必要なHTTPSのURLを入れます。管理画面の編集URL、下書きのプレビューURL、ログイン用URLを入れないでください。
階層を作るために項目を右へずらすと、下位のサブメニューになる場合があります。横並びの順序だけを変えるつもりなら、意図しない入れ子になっていないかをリスト表示で確認します。
リンクをメニューから外す操作と、リンク先のページ自体の削除は別です。ページを残したいときは、ナビゲーション内の項目だけを選んで削除します。
5．保存する範囲を確認する
保存時に複数の変更対象が表示される場合は、メニュー、ヘッダー、テンプレートなどの名前を確認して確定します。同じメニューを複数の場所で使っているなら、そこにも変更が反映されます。
「このページのヘッダーだけ」のつもりで共通のヘッダーを編集すると、ほかのページも変わるため、トップページと記事ページの両方を開いて確認します。保存できたら公開URLへ移動し、4項目を一つずつ押してください。
6．スマホの開く・選ぶ・閉じるを確認する
小さい画面でメニューアイコンにまとめる設定は、ナビゲーションの表示・オーバーレイ設定で確認できます。公式説明では「オフ」「モバイル」「常に」に相当する表示方法があります。翻訳やバージョンによって名前は変わります。
| 動作 | 確認すること |
|---|---|
| メニューを開く | アイコンまたは「メニュー」の文字を押せる |
| 項目を選ぶ | 一つずつ読め、別の項目を誤って押さない |
| サブメニューを開く | 開閉操作がわかり、目的ページを選べる |
| メニューを閉じる | 閉じる操作が見つかり、本文へ戻れる |
| ページを移動する | 表示文字に合った内容が開く |
画面を狭めたプレビューに加えて、実際のスマホでも確認します。可能ならキーボードでも操作し、Tabキーでサイトを点検する方法に沿って移動先を見ます。
よくあるつまずきと戻し方
「保存したのに変わらない」場合は、別のメニューを編集していないか、別のヘッダーが使われていないかを先に確認します。「項目が増える」なら、自動のページ一覧か、別に存在する二つ目のナビゲーションかを調べます。
並び順だけが違うなら、控えておいた順へ戻して保存します。リンク先を間違えたなら、その項目のURLを修正します。共有メニューを丸ごと削除して作り直すより、変更した項目を一つずつ戻すほうが影響を限定できます。
完成の目安は、PCでもスマホでも「何を押すか」「どこへ行くか」「どう戻るか」が一通り確認できることです。図は独自の模式図で、実画面ではありません。公式資料確認日：2026年10月14日。
