こんにちは@moriyuka317 もりのです^^
今日は、
- ワードプレスにメニューバーを作りたい
- ナビゲーションメニューが何のことかわからない
- そもそもメニューバーの作り方がわからない
こんな風に、「ワードプレスのメニューバーの作成」に悩まれている方に向けて「メニューバーの作り方と、設定方法」についてわかりやすくお伝えします。
今日の記事を読んでいただけると
・ワードプレスのメニューバーを作れる
・ナビゲーションメニューが設置できる
・ピックアップメニューが設置できる
・スマホ画面用のメニューが作成できる
ぜひ最後まで読んでみてください。

目次
WordPressに設置できるメニューの種類
まずは、ワードプレスのメニューの種類についてお伝えします。
私はメニューって1種類だけ作成すればいいと思ってたんですが、実は場所によって変更することが可能なんです
WordPressのメニューに追加できる項目の種類は以下の通りです。
- グローバル(ナビゲーション)メニュー
- ピックアップコンテンツ
- フッターメニュー
- 【スマホ用】ボタンメニュー
- 【スマホ用】フッターメニュー
(※テーマによってメニュー名が違うこともあります。ちなみに私が使っているワードプレスのテーマはJINです)
「メニューだけでもこんなに・・」と、
パソコンが苦手な人はパタン…とパソコンを閉じてしまうかもしれませんね(笑)
でも安心してください!専門用語が多いので、画像を使いながらもう少し噛み砕いて説明していきます。
まず、各メニューの位置はこちらです。
(パソコン画面の上部↓↓)

①グローバル(ナビゲーション)メニュー
これがメインのメニューになります。
②ピックアップコンテンツ
なくてもOKですが、設置すると結構目立ちます!
(パソコン画面の下部↓↓)

③フッターメニュー
サイトの一番下にあるメニューです。
(続いてスマホで見た画面↓↓)

④【スマホ用】ボタンメニュー
右上の3本ラインの入ったボタンをタップすると現れるメニューです。
⑤【スマホ用】フッターメニュー
スマホの一番下にあるメニューです。
これらのメニューは各場所ごとに内容を変えることも可能です。
(もちろん全て同じでもOK)
それでは次の章からメニューバー設置のやり方をお伝えしていきます。
WordPressでメニューバーを作る方法
まず、メニューバーに追加できる項目は以下の通りです。
- 固定ページ
- 投稿ページ
- カスタムリンク
- カテゴリー
- CTA
これらの項目のうち、どのページをどの場所に入れるかをまず決めておきましょう!
1.ワードプレス管理画面からメニュー設定へ
WordPress管理画面にある左側のメニューから
【外観】≫【メニュー】を選択します。

今回は実際に私が設定しているページを追加していきます。
2. 新しいメニューを作成
「メニュー」画面が開いたら「新しいメニューを作成しましょう」の青いリンクをクリックします。

まず、「メニュー名」を入力します。
ここでは『グローバルナビゲーション』と入力しましたが、自分がわかればなんでもOKです!
何種類かメニューを作成する予定のある方は、
設置する場所の名前(ヘッダー・フッター・ピックアップ)などを入れておくとわかりやすいかもしれません。
その後、設置したい位置(場所)にチェックを入れ、「メニューを作成」をクリックします。
(ここではグローバルメニューにチェックを入れます)
3. メニューへ項目を追加する
メニューが作成できたら、次に「項目を追加」していきます。
今回は左から
ホーム | 提供中のメニュー | お客様の声 | お問い合わせ |
を作成していきます。
ちなみにこれらの項目は
■ホーム→(カスタムリンク)
■提供中のメニュー→(固定ページ)
■お客様の声→(カスタムリンク)
■お問い合わせ→(固定ページ)
で作成してありますので、それぞれの項目を追加していきます。
カスタムリンク
まずは「ホーム」というメニューを作成します。
「ホーム」は自分のブログのトップページになるので、ここはカスタムリンクを追加していきます。
左側の「メニュー項目を追加」から「カスタムリンク」の箇所を開きます。
(「▼」をクリックすると開きます)

すると、
- URL
- リンク文字列
を入力する欄が出てきます。
ホームをクリックすると自分のブログのTOPページに移動して欲しいので、ここには自分のブログのURLを入力します。
リンク文字列にはメニューバーに表示させたい文字(ここでは「ホーム」)を入力します。

入力できたら「メニューに追加」します。
固定ページ
続いて、「現在提供中のメニュー」というメニューを追加していきます。
このページは固定ページで作成していますので、固定ページを追加していきます。
「固定ページ」の箇所を開くと
- 最近
- すべて表示
- 検索
のタブと、記事一覧が出てきます。

ここから追加したいページを見つけ、✅を入れたら「メニューに追加」を押して追加します。
投稿ページ・カテゴリーも同じ手順になります。
ピックアップコンテンツ
ピックアップコンテンツとはグローバルメニューとは別のメニューで、
ヘッダーの下に最大4つの画像付きのバナーを設置することができます。
(※テーマによっては名前が違うことがあります)

ピックアップコンテンツは3つでも2つでもいいのですが、個人的に4つ設定しておく方がバランスが取れてキレイです^^
手順は先ほどお伝えした手順と同じです。
私はピックアップコンテンツのメニューには「カテゴリー」を追加していますので、その方法をお伝えしていきます。
まずはメニュー項目を追加ところから「カテゴリー」を選択します。

ここで、ピックアップメニューにしたいカテゴリーを4つ選び、「トップページのピックアップコンテンツ」に✅を入れます。

すると、下の画像のようなメニューが完成します。

「画像がなくて真っ白なんだけど!!」
という人は、ワードプレスの管理画面から、「投稿」≫「カテゴリー」≫「カテゴリー編集画面」に移動し、
(画像を追加したい)「カテゴリー」≫「編集」≫「アイキャッチ画像の設定」からお好きな画像を設定しましょう!
サブメニューを作る
次に、メニューバーにマウスをのせると下の列に現れる「サブメニュー」を作成していきます。

下の画像のように、メニュー設定の画面で「メニュー追加」をし終わった後、
「サブメニュー」にしたい項目を少し右にずらします。

その際の注意点としては
上の画像では
「現在提供中のメニュー」の下に
「ワードプレス記事作成依頼のお知らせ」という項目をサブにしました。
そうすることで下の画像のようにサブ項目になります。

メニューバーを作成する前に準備しておくこと
メニューバーを作成する前に準備しておくこととしては「メニュー」にするための以下の4つの項目です。
- 固定ページ
- 投稿ページ
- リンク
- カテゴリー
これらのページがないとメニューが作成できませんので、まだ作成してない方は作っておきましょう♩
カテゴリーの作成方法に関してはこちらを参考にしてください。

まとめ
メニューはあなたのサイトに来てくれた訪問者が最初に目に入る部分です。パッとみただけであなたのブログには「どんな内容があるのか」がわかるようにしておきましょう♩
- 【ラジオ#1】 傷つきやすい自分はもう嫌!強くなりたいって方へ
- ブログに動画(YouTube)を埋め込む方法【グーテンベルク編】
- WordPressメニューバーの作り方・設定方法
- ブログのカテゴリーの決め方のコツと設定方法
- 簡単3ステップ!canvaでワードプレスのテーマカラーのパレットを作る方法