WordPressのナビゲーションメニューを設定する方法

  • このエントリーをはてなブックマークに追加

ナビゲーションメニューの役割は明確で、読者が迷うことなくコンテンツを見つけるためにある。また同じように検索エンジンのクローラーにもサイト内のすべてのコンテンツをスムーズに巡回できるように促して SEO 対策になる。

そこで、ここではナビゲーションメニューの

  • 追加
  • 並び替え
  • ドロップダウンメニューの設定
  • 削除

の方法を図解で説明する。操作はとても簡単なので安心してほしい。

SEO効果を最大にするナビゲーションメニューとは?
ナビゲーションメニューはサイト全体のSEOにも大きな影響を及ぼす。『キーワード選定とコンテンツプランニング』をしっかりと読み込んで、最適なリンク構造になるように考えてナビゲーションを設定しよう。

1.WordPressメニューとは

結論を言うと、WordPress においてメニューとは主に下図の赤枠点線のグローバル ナビゲーションを指す。WordPress ではこのメニューを操作して思うようにナビゲーションメニューが設定できる。

またこのメニューはテンプレートによって異なるが、グローバルナビゲーション以外にもサイドバーなど複数のメニューを持つテンプレートもあるし、php を編集できる知識があれば自由自在にテンプレートを作ることができる。

それでは、メニューの設定方法を紹介しよう。

2.メニューの画面へのアクセス方法

WordPress の管理画面にログインして、左メニューにある「外観」にカーソルをあてる。すると「メニュー」が表示されるのでクリックしよう。

続いてメニューを設定する方法を解説しよう。

3.メニューを追加する方法

まず「新規メニューを作成」をクリックする。

すると下図のように新規メニュー名の入力が求められる。入力して「メニューを作成」をクリックしよう。

下図の赤枠内の「メニュー構造」でナビゲーションメニューの編集ができる。

注:テーマの位置について
メニュー設定にあるテーマの位置は、テンプレートによって異なる。メインメニューだけではなくサイドバーに表示できるテンプレートもある。このページでは、WordPress のデフォルトテーマの一つ ” Twenty Twelve “を例として解説している。表示内容はテンプレートによって異なるが操作方法は同じなので安心してほしい。

ちなみにナビゲーションメニューに追加できるのは、次の通り「固定ページ」「リンク」「カテゴリー」の3つから選べる。

固定ページとカテゴリーは、それぞれ作成すると自動的にタイトルが追加される。作り方の詳しい解説については「固定ページの使い方」と「カテゴリーの設定方法」を確認しよう。リンクについてはタイトルとURLを入力するだけなので設定は簡単だ。

また固定ページとカテゴリーにだけ「最近」「すべて表示」「検索」という3つのタブがある。「最近」だとタイトルが表示されないケースがあるので「すべて表示」を使うようにしよう。

実際にナビゲーションメニューにテキストリンクを追加する手順は下図の通りだ。

ここでは追加したい固定ページのリンクにチェックを入れた。もしカテゴリーのリンクを追加したい場合は、カテゴリーバーの右横にある▼をクリックすると追加できるリンクが表示される。続いて「メニューに追加」をクリックすると、画面右側のメニュー編集画面にタイトルが追加される。

最後に「メニュー設定」の設定をしよう。

それぞれチェックを入れると次のように機能する。

  • 固定ページを自動追加:固定ページを作る度に固定ページのリンクを自動でナビゲーションメニューに追加できる
  • テーマの位置:サイトにナビゲーションメニューを表示できる

「固定ページを自動追加」はリンクが勝手にナビゲーションメニューに追加されるのでチェックを外そう。また「テーマの位置」にチェックを入れないとナビゲーションメニューに表示されないので必ずチェックを入れよう。

メニューの設定は以上だが、他にも注意する点、複数メニューがある場合の便利な設定方法を解説する。

3−1.ドラッグ & ドロップができない場合の対処法

WordPress でサイトを管理していて、稀にドラッグ&ドロップができない方もいる。その場合、公式サイトの『問題解決のためのチェックリスト』を確認すると良い。トラブルシューティングの基本に解決手順が掲載されているので試してみると良いだろう。

どうしても機能しない場合は、手動で設定するしかない。メニューはドラッグ&ドロップがなくでも手動で設定できるように作られている。ただし、ウィジェットなど他の設定画面で不都合が生じるので必ず解決しておこう。

3−2.メニューが複数ある時の便利な設定方法

テンプレートによってメニューは異なり、メニューを複数持つテーマもある。その複数メニューを一覧画面で設定する方法がある。

まず「位置の管理」というタブをクリックしよう。すると下図の画面が表示されて、どのメニューがどこに配置されているかが一目でわかるので便利だ。

一つひとつの位置にメニューを設定していこう。

4.メニューの並び替え方法

設定したナビゲーションメニューのリンクを下図のように並び変えることができる。

設定方法は移動したいリンクタイトルをドラッグ&ドロップするだけだ。

並び替えが終わったら「メニューを保存」をクリックすると完了だ。

5.メニューにドロップダウンメニューを設定する方法

ナビゲーションの一部のリンクをまとめてドロップダウンメニューに設定することができる。

リンクタイトルをドラッグして親メニューの直下にドロップしよう。下図のように「サブアイテム」と表示されたらOKだ。

設定が完了したら「メニューを保存」をクリックすると反映される。

注:ドロップダウンメニューの使用はなるべく避けよう
ナビゲーションメニューに掲載するリンクが多すぎるとドロップダウンメニューを使用した方が収まりが良い。ただし、検索エンジンのクローラーがうまく巡回できないことがあるため極力避けるべきだ。2014年11月現在、バズ部ではドロップダウンメニューを採用しているが、改善策については社内で協議している。

6.メニューのリンクを削除する方法

ナビゲーションメニューのリンクを削除するなら、削除したいタイトルリンクを選び右側の▼をクリックしよう。下図のように開いて「削除」をクリックするだけだ。

ここで「タイトルの属性」とあるが、これはリンクにタイトルタグを挿入する時に使う。SEO 対策としておススメできないので、使用しないでも問題ない。

そして忘れずに「メニューを保存」をクリックするとナビゲーションメニューに反映される。

  • このエントリーをはてなブックマークに追加

最高の結果を出すためのサイト制作サービス
『 bazubu-shiki 』

cta_bazubushiki“ bazubu-shiki(バズブシキ)” は、バズ部の運営ノウハウを詰め込んだ、メディアサイトの制作サービスです。

  • ・WEBの専門知識がなくても、ブログ記事の更新が可能
  • ・検索エンジンを徹底的に研究した内部構造なので、SEO対策に最適
  • ・お問い合わせやリードの獲得に繋げる、導線の実装が簡単

デザインの作成、SNSへの連携、サーバー管理などはバズ部が一貫して行いますので、あなたは、安心してコンテンツ作りに集中することができます。
WEBマーケティングで最高の結果を出すために、ぜひ導入してみてください。


" bazubu-shiki " について詳しく見る

最新の記事情報が取得できます

Facebook

「いいね!」ボタンを押すと、最新情報がすぐに確認できるようになります。

Twitter

「フォローする」ボタンを押すと、最新情報がすぐにツイート上で確認できるようになります。

コメントはこちらから

  1. 初めまして。ワードプレスを始めてホームページ作成を目指している者です。

    ナビゲーションメニューの設定についてつまづいてしまいお手上げなのですがこちらのサイトを見つけたので質問をお願いします。

    「メニューを追加する方法」の手順に従い設を行ったのですかページ上部にナビゲーションメニューが表示されません。どうすればよいでしょうか?

    初歩的な質問であり申し訳ございません。ご教授をお願いします。

    1. Tさん、コメントありがとうございます。
      表示されないとのことですが、下記2点をもう一度ご確認いただけますでしょうか?

      ・「テーマの位置」にチェックが入っているか?
      ・設定後、「メニューを保存」のボタンをちゃんと押したか?