「メニューバーが思い通りに編集できない」。この苛立ち、よく分かります。
ボタン一つのはずなのに、出ない・動かない・崩れる――初心者も上級者もつまずく“難所”が、ワードプレスのメニューバー編集です。
本記事では、単なる手順書ではなく、なぜその操作が必要なのか、テーマや仕様の違いまで踏み込み、現場で使える「プロの作法」まで解説します。
結論:ワードプレスのメニューバー編集は「外観→メニュー」を軸に、①項目設計→②階層設計→③表示位置指定の“3工程”で決まる。
理由は単純です。WordPressは「内容(項目)」「構造(階層)」「場所(位置)」を分離して管理しているから。どれか一つでも欠けると、メニューは“見えるけど使えない”か“そもそも表示されない”状態になります。
メニューバーの基礎:WordPressが採用した“3層モデル”

WordPressのメニューは、見た目だけのUIではありません。
内部的には「項目」「構造」「位置」という3つのレイヤーで管理されています。
これは2009年のNav Menus API(WP 3.0)で導入された設計思想で、現在も変わっていません。
① 項目(What):何を並べるか
固定ページ・投稿・カテゴリー・カスタムリンク・タグ。
この5種類が“素材”になります。
公開されていないページ(下書き)は選べない仕様です。
② 構造(How):どう並べるか
ドラッグ&ドロップで順序と階層を設計します。
右にずらすと子階層(サブメニュー)になるのは、
WordPressが採用する「親ID=0以外」の階層表現に基づく挙動です。
③ 位置(Where):どこに出すか
テーマが定義する「メニュー位置」に紐づけます。
例:Header、Footer、Drawer(スマホ)など。
ここを設定しないと、いくら編集しても表示されません。
実務で失敗しない編集フロー(現場標準)

多くの初心者は「項目だけ」いじって詰みます。
プロは必ず次の順で作業します。
ステップ1:項目設計(5〜7個が黄金比)
可読性の観点から、トップレベルは最大7個まで。
人間の短期記憶の上限(ミラーの法則:7±2)に基づく実務基準です。
ステップ2:階層設計(親=概念、子=実体)
例:「ブログ」→ 子に「WordPress/SEO/運用」。
親は抽象、子は具体。これがUXの鉄則です。
ステップ3:表示位置指定(テーマ依存)
Cocoonなら「ヘッダーメニュー」、SWELLなら「グローバルナビ」。
名称は違っても、役割は同じ“主要ナビ”です。
テーマ差異という“見えない壁”を理解する
同じWordPressでも、テーマで挙動は激変します。
ここを無視すると、必ず迷子になります。
クラシックテーマ(Cocoon・SWELL・JIN)
「外観→メニュー」が中心。
Nav Menus APIに忠実で、操作が直感的です。
ブロックテーマ(Twenty Twenty-Four)
「外観→エディター→ヘッダー」で編集。
ナビゲーションブロックを直接触る設計に変わりました。
これは2022年以降のFSE(フルサイト編集)の影響です。
ハンバーガーメニューのカスタマイズ実践
モバイル比率が7割を超える時代。
ハンバーガー設計は“必須スキル”です。
標準機能でできること
多くのテーマは自動で切替。
中身は同一メニューをレスポンシブ表示します。
プラグインで拡張する場合
・WP Mobile Menu:ドロワー型に強い。
・Max Mega Menu:大規模サイト向け。
・Menu Image:視認性重視のアイコン表示。
よくある質問(FAQ)と根本原因
Q.メニューが出てこないのですが?
A.9割は「表示位置の未指定」。
残りは「ブロックテーマで場所が違う」か「キャッシュ」です。
Q.メニューを編集できないのはなぜ?
A.権限不足(編集者ロール以下)か、
ブロックテーマで「外観→メニュー」が非表示のケースが典型。
Q.順番を変えるには?
A.ドラッグ&ドロップ。
保存しないと反映されないのが、最も多い凡ミスです。
Q.ナビに項目を追加するには?
A.左パネルで選択→「メニューに追加」。
公開済みであることが前提条件です。
まとめ:今日からできる“プロのチェックリスト”
最後に、実務で使える最短チェックを置きます。
- 項目は5〜7個以内か
- 親子関係は概念→実体か
- 表示位置は正しいか
- スマホ表示を実機確認したか
- 保存ボタンを押したか
この5点を守れば、ワードプレスのメニューバー編集で迷うことは、ほぼなくなります。
次にやるべきは、あなたのテーマ名(Cocoon・SWELL・JIN・Lightning・Twenty Twenty-Four)を決め、最適化設定を詰めること。そこまで伴走します。
