こんにちは!
もブログの千明です。
この記事では、ワードプレスのメニューバーを作っていきます。
ワードプレスに限らず、ほぼすべてのサイトには、ぽちっと押すと、お問い合わせに行ったり、作者のページに行ったりする便利な「メニューバー」が設置されてますね。
メニューバーがないと、読者さんが読みたい記事を探すことができず、迷子になりますよね。せっかく書いた記事も埋もれてしまい二度と日の目を見なくなってしまいます。
これでは、読者さんにとっても、運営にとっても、大きい損失になってしまいます。
とても便利なメニューバーをサクッと設置しちゃいましょう。
ワードプレスのメニューバーの設置位置
ワードプレスには、初期設定でメニューバーが2か所設置できるようになっています。
上から、ヘッダー回りに設置する、グローバルナビゲーションメニュー。略してグローバルメニューとか、グローバルナビとか言います。
ページの一番下に設置する、フッターメニュー。
どのサイトもメニューバーは大体この2か所になっています。
ヘッダー回りのグローバルメニューがパッと目につくので、メインのメニューバーとなります。
メニューバーには何を入れる?
グローバルメニューの内容
目立つところにあるグローバルメニューには、見てほしい項目を入れていきましょう。
- お問い合わせページ、プロフィールなどの固定ページ
- カテゴリーごとの分類ページ
- リンク指定した特定のページ(外部サイト)
人の目は、サイトを見た時に、左から右、という順番で見るので、左から見せたいものを順に入れていきます。
フッターメニューの内容
フッターメニューには、サイトマップ、特定商取引法表示、プライバシーポリシー、などを入れることが多いです。これは、目立たせなくてもよいが、見せないといけないものです。
ワードプレス メニューの作り方手順
ワードプレスは簡単に2種類のやり方でメニューを作ることができます。細かい表示などはテーマによって変わります。例はCocoonを使っています。古いテーマだと、2のやり方には対応していないかもしれません。
1.ダッシュボードから作成
2.サイトを見ながら作成
では順にみていきましょう。グローバルメニュー、フッターメニューともやり方は共通です。
1.ダッシュボードから作成
ダッシュボード左の欄、外観からメニューに入ります。

こちらがメニュー画面です。
メニュー名を入れ、メニューを作成ボタンをクリック。



大まかな流れとしては、
- 入れたい項目に☑
- メニューに追加をクリック
- メニュー設定で位置を指定
- メニューを保存をクリック
となります。



各項目を見てみましょう。
固定ページや投稿をメニューに入れる方法
固定ページで入れたい項目に☑して、メニューに追加をクリック。



右側に☑した項目が表示されます。



一度指定した項目を削除するには、▲マークをクリックすると、下に削除の文字が出ますので、クリック。



各項目の内容を表示したいときは、▼をクリックすると、内容が表示されます。設定したい投稿に☑し、メニューに追加すると、投稿も指定できます。



メニューに外部サイトのリンク入れる方法
外部サイトならカスタムリンクを指定します。
URLにリンク先を入れ、リンク文字列には、グローバルメニューに表示したい文字列を入れます。



あああ。http://を削除してませんね。https://からにしないと、いけませんねえ。



カテゴリーの入れ方とメニューを階層表示させる方法
カテゴリーはおすすめです。指定したいカテゴリーに☑。



右欄では、順番をドラッグアンドドロップで入れ替えられます。上から左に表示されます。
子カテゴリーなど、階層表示したいときは、右にずらします。



内容が良ければ、メニュー設定で場所を指定。ヘッダー回りには、ヘッダーナビ、サイトの下へは、フッターナビです。
メニューを保存しましょう。
サンプルカテゴリーの下に、さんぷる2カテゴリーが表示されています。↓






メニューの削除
メニュー全体を削除するには、メニューを削除を押します。そして、メニューを保存をクリック。
入れた項目を削除



2.サイトを見ながら作成
サイトを見ながら作成することもできます。
サイトを表示させ、上のタスクバー、カスタマイズを押します。



このようなバーが現れますので、メニューをクリック。



メニューを新規作成をクリック。



メニュー名を入れ、表示させたい位置を☑。次へをクリック。



フッターメニューの場合はこうなります↓。今回はフッターメニューを製作しましょう。



入れたいものを指定します。項目を追加をクリック。



あとは、先ほどと似ています。入れたい項目をクリックします。各項目の内容を出したいときは▼をクリックすると、表示されます。



順番の入れ替えも先ほどと同様です。
良ければ、公開をクリック。



左に出ているバーを閉じるには、×をクリック。作成したもの(今回はメニュー)を保存したくないときは、公開を押さずに、×をクリックすると、反映されません。



このように、サイトの一番下に、表示されました。



メニューのスマホ表示
ちなみに、スマホではこのように表示されます。



モバイルヘッダーナビを選ぶと、このように表示されます。



ワードプレスの各種メニューバーの作り方まとめ
使用しているテーマによって多少変化はあると思います。これはCocoonを例に使っています。
グローバルメニュー、フッターナビメニューとも、基本的な作り方は同じで、表示場所が違うだけですね。
固定ページは、メニューやサイドバーからの表示にしないと、自動では表示されませんので、必ずどこかに表示させるようにしてくださいね。
溜まってきた記事は、カテゴリーごとに分類して、グローバルメニューから表示させると読者さんの興味のある内容がまとまって表示されるので、複数記事を読むきっかけにもなります。
ぜひメニューを活用してくださいね。



お疲れさまでした!