1. 管理画面・基本設定
  2. メニューの作成と設定

メニューの作成と設定

2016/11/17

WordPressには、メニュー(ナビゲーションメニュー)を簡単に作成する機能があります。メニューの設置は、訪問者にやさしいサイト作りには欠かせません。このページでは、メニューの作成と設定について基本的な方法を紹介します。

WordPressのメニュー機能とは?

WordPressには、サイト内に表示するメニューを簡単に作成できる機能があります。メニューには、サイト訪問者が目的のページにたどり着きやすくなるという役割があります。

たとえば、このサイトの上部には[基礎知識][導入・準備][基本設定]などのページにアクセスするためのリンクがあります。これもメニューのひとつで、一般的に「ナビゲーションメニュー」「グローバルメニュー」「グローバルナビゲーション」などと呼ばれます。

WordPress超初心者講座 メニューの例

メニューを作成する主な手順は、次の通りです。

  1. メニューに表示するページを作成しておく
  2. メニューに表示するページを選択する
  3. 選択したページを並べ替え
  4. メニューを表示する位置を決定する

メニュー作成手順①
メニューに表示するページを作成しておく

 
メニュー作成の前に、あらかじめメニューに表示させたいページを作成しておきます。「投稿」「固定ページ」どちらでも構いません。すでに作成済みの場合は、この手順は読み飛ばしてください。

その他にも、「カテゴリーページ」や「タグページ」などもメニューに加えることができます。

「カテゴリーページ」・「タグページ」とは、特定のカテゴリー・タグに属する投稿の一覧を表示するページです。くわしくは、カテゴリとタグとの違いは?をご覧ください。

メニュー作成例の説明

今回の例では、下の画像のようなメニューを作成していきます。

メニュー作成例

企業サイトなどによくある次の1~5を「固定ページ」で作成します。さらに「ブログ」カテゴリーを作成して、そのカテゴリーページをメニューに加えます。計6項目を、下記の順番通りにメニューとして表示させることにします。

  1. トップページ
  2. 会社案内
  3. 製品紹介
  4. アクセス
  5. お問い合わせ
  6. ブログ(カテゴリーページへのリンク)

1~5の固定ページを実際に作成するには、下記を参考にしてください。

メニュー作成手順②
メニューに表示させるページを選択する

メニューに表示させるページを選択するには、管理画面[外観]>[メニュー]をクリックします。

WordPress管理画面[外観]>[メニュー]
管理画面[外観]>[メニュー]

メニュー名を入力します。今回は「グローバルメニュー」としました。入力できたら、メニューを作成をクリックします。

WordPress メニューを作成

メニューに表示させるページを選択します。初期状態では、

  • 固定ページ
  • 投稿
  • カスタムリンク
  • カテゴリー

から選ぶことができます。

「タグページ」を選択するには?
先ほど「タグページもメニューに加えることができます」と紹介しましたが、初期状態では選択することができません。解決するには、画面右上の[表示オプション]をクリックし、[タグ]にチェックを入れます。
メニュー機能 表示オプション

固定ページをメニューに追加

まずは、先ほど作成しておいた5つの固定ページをメニューに加えます。画面左の[固定ページ]一覧から選択したいページ名にチェックを入れ、メニューに追加をクリックします。

固定ページをWordPress メニューに追加

カテゴリーページをメニューに追加

次に、カテゴリーページをメニューに加えます。画面左の[カテゴリー]をクリックし、選択したいカテゴリー名にチェックを入れ、メニューに追加をクリックします。

カテゴリーページをWordPress メニューに追加

以上で、メニューに表示させたいページの選択が完了しました。しかし、このままの状態でサイト上にメニューを表示させても、希望通りの順番に並んでくれません

メニュー作成手順③
選択したページを並べ替える

メニュー項目を並べ替えるには、ドラッグ・アンド・ドロップします。

メニュー項目を並べ替え

メニュー作成手順④
メニューを表示する位置を決定する

作成したメニューをサイト上のどの場所に表示するかを決めます。画面下部の[メニュー設定]>[テーマの位置]で選択できます。

選択できる項目は、使用するテーマによって異なります。今回の例では、WordPress標準テーマ「Twenty Sixteen」を使用しています。

「Twenty Sixteen」でサイトの上部にメニューを表示させるには、[メインメニュー]にチェックを入れ、メニューを保存をクリックします。

WordPress メニューを表示する位置を決定

実際にサイト画面を確認すると、下のようにメニューが表示されました。

WordPress メニューのプレビュー

メニュー画面で設定できること

ここまで、基本的なメニューの作成・設定方法を紹介しました。その他にも、メニュー画面で設定できる主なものを紹介しておきます。

メニュー項目の表示名を変更する

今回の例の「トップページ」という表示名を「ホーム」に変更してみます。[トップページ]の右端にある▼をクリックします。

WordPress メニュー項目の表示名変更手順-1

[ナビゲーションラベル]に「ホーム」と入力し、メニューを保存をクリックします。

メニュー項目の表示名変更手順-2

メニュー項目を削除する

削除したいメニュー項目の右端にある▼をクリックした後、[削除]をクリックし、メニューを保存をクリックします。

メニュー項目を削除

その他のメニュー機能の使い方については、WordPress Codex 日本語版の管理画面/外観/メニューページを参考にしてください。

おすすめの書籍

小さなお店&会社の WordPress超入門

WordPressでビジネスサイトを作るために必要な、基本的な知識が理解できる“超”入門書。Web制作に必要なHTML・CSS・PHPなどの専門知識がなくても読み進められる1冊です。SEO(検索エンジン最適化)やセキュリティの対策についても解説されています。

おすすめのテーマ

WordPressテーマ「NEXTAGE (tcd021)」

WordPressテーマ「LAW」

コーポレートサイト(企業サイト)向けのテーマ。第一印象で信頼性や専門性を的確にアピールし、Webサイトのゴールである「お問い合わせ」まで自然に繋がっていく“導線”にこだわったテンプレートです。

カテゴリー

ビジネスサイトを作りたいあなたに

おすすめのテーマ、あります。