
WordPressは、ヘッダー(ページの冒頭部)とフッター(ページの終わり部)など多彩なメニューを配置できる機能を備えています。メニューの構造(項目の構成)を複数作成して、その内の二つを選んでヘッダーとフッターに配置するなどのメニューの管理機能もあります。
メニューは、サイトのナビゲーションを提供する重要な基本機能です。WordPressのヘッダーとフッターメニューの機能を活用することで、サイトのナビゲーションの使い勝手を向上させることもできます。フッターメニューは地味な存在ですが、WordPressではフッターメニューも柔軟に作成できるのが特徴の1つです。フッターメニューの多彩な編集機能を備えていることはWordPressならではの利点とも言えます。
WordPressは多様なメニューを作成、設置することが可能な機能を備えていますが、テーマによってサポートされるメニューの形式や設定可能な位置は異なります。現状、WordPress 標準テーマ、Twenty SeventeenやTwenty Sixteenではフッターメニューはサポートされていません。
フッターメニューはコンテンツが増えてくると重要度が増してきます。始めたばかりのサイトやコンテンツがそれほど多くない場合は、必要性はそれほど高くはありません。必ず設置しなければいけないというものではないです。フッターメニューを設置するかは運営者の判断によります。
CMSが備える機能、持ち味を活かすこともサイト運営では重要なことです。使いやすいナビゲーションを備えることは、ユーザエクスペリエンスの向上に繋がります。サイト内の主要なコンテンツに係るナビゲーションは、ヘッダーメニューで行うのが基本です。ヘッダーのメニューの作成については、WordPressサイトのメインメニューの追加・設定の仕方をご覧下さい。
本記事では、フッターメニューの作成と追加の方法を紹介します。
目次 - Table of Contents
WordPress サイトにフッターメニューを追加する
管理画面(ダッシュボード)の左下に並んで表示されるメニュー内の[外観]を選び、表示されるサブメニューの中から[メニュー]を選びます。
以下の画像の様なメニュー編集画面が表示されます。
[目次に戻る ]
新規メニューの作成
「以下のメニューを編集するか新規メニューを作成してください。」のメッセージ表示内の”新規メニューを作成”をクリックします。
メニュー名の欄に名前を入力します。ここでは例として、”フッターメニュー”を名前に入力しています。続いて、青色の[メニューを作成]のボタンを押します。
新規メニューの作成編集画面が表示されます。新規の場合は、メニュー構造の欄にはまだなにも項目が入っていません。「左カラムからメニュー項目を追加してください。」とメッセージが表示されています。
[目次に戻る ]
メニュー項目の追加
固定ページ、投稿、カスタムリンク、カテゴリーの中から、フッターメニューで表示する項目を選択し、[メニューに追加]ボタンをクリックします。
ここでは例として、固定ページの”ホーム”、”お問い合わせ”、”プライバシーポリシー”、”プロフィール”をフッターメニューに追加します。
備考:
フッターメニューで表示する項目は、ヘッダーと同じでも構いませんが、(少し)異なる項目の組み合わせを表示することが多いです。重複する項目があってもおかしくありません。
サイト内の記事数、カテゴリー数、固定ページ数が増えてくると、ナビゲーションの重要性も高まってきます。サイトのコンテンツが増えるとメニューの項目も増えてくることが多いです。コンテンツの多いサイトでは、ヘッダーとフッターのメニュー項目を使い分ける必要性が高くなります。
本サイトでは、サイトの基本情報のページをフッターメニューに項目として加えて表示しています。
[メニューに追加]ボタンをクリックすると、メニュー構造の下にメニュー項目が追加されます。
4番目に表示されている項目「プロフィール/Blogging Lifeの簡単な紹介」は、メニューラベルの名としては長いので、「About」に変更します。
[目次に戻る ]
ナビゲーションラベル(ラベル名)の変更
メニューの項目として表示される名前をナビゲーションラベルと呼びます。(例:「お問い合わせ」というメニュー項目名がナビゲーションラベルです。)ナビゲーションラベルは、お好みに合わせて表示を変更することができます。例えば、メニューの項目名としては長すぎるカテゴリーや固有ページのタイトルを簡潔な名称に変更することができます。
ここでは例として、「プロフィール / Blogging Lifeの簡単な紹介」と言う固定ページのメニュー項目表示名を「About」に変更する例を紹介します。
ラベル変更前
メニュー構造に表示されている変更したいタイトル表示(メニュー項目名)のタブを選択すると、ナビゲーションラベルの欄が表示されます。ナビゲーションラベルの欄には、固定ページのタイトル「プロフィール / Blogging Lifeの簡単な紹介」が予め入力されています。
[目次に戻る ]
ラベル変更後
ナビゲーションラベルに入力されているテキストを編集します。「プロフィール / Blogging Lifeの簡単な紹介」を「About」に変更しました。(画面内の赤枠で囲った箇所)
ラベルの変更のみ行う場合は、編集後、[メニューを保存]のボタンを押します。
[目次に戻る ]
メニュー項目の表示順の変更
WordPressでは、メニュー項目の順番を自由に変更することができます。以下は、メニュー項目の表示する順番を変更する手順です。
メニュー項目順変更前
以下に表示されている項目を「ホーム」、「About」、「プライバシーポリシー」、「お問い合わせ」の順に変更します。
移動させたい項目をドラッグ・アンド・ドロップして、順番を入れ替えます。上の画像では、4番目にある「About」をドラッグして、「ホーム」下に移動します。同様に上の画像で2番目に表示されている「お問い合わせ」を「プライバシーポリシー」の下に移します。
ドラッグアンドドロップを使用せずに、移動するアイテムのタブを開いて、移動の「ひとつ上へ」、または、「ひとつ下へ」(下の画面赤枠で囲った内側に表示される文言のリンク)をクリックして、順番を変更することもできます。以下の画像の赤枠部をご参照下さい。
メニュー項目順変更後
上で紹介したメニュー項目の順番を変更作業を行い、下の画像のようなりました。
「ホーム」、「About」、「プライバシーポリシー」、「お問い合わせ」の順番となっています。
[目次に戻る ]
メニュー表示位置を指定
メニューの位置のチェックボックスをクリックすると、表示する位置を設定することができます。ヘッダーかフッターの二箇所のどちらかを選択します。両方を選択することもできますが、ヘッダーとフッターのメニュー項目をそれぞれ作成して、適切に設定することでより使いやすいナビゲーションを提供することができます。
メニュー設定の下にある、「メニューの位置」の[フッターナビ]のボックスにチェックを入れて、[メニューを保存]のボタンを押します。
備考 / 注意事項:
メニューの位置を選択しないと、メニューは表示されません。
メニュー設定に表示される「メニューの位置」の項目や名称は、使用しているWordPressのテーマによって異なる場合があります。上の画像は、Simplicityの場合です。Simplicityでは、「ヘッダーナビ」と「フッターナビ」という名前でメニュー位置を2箇所選ぶことができます。テーマによっては、名前が「グローバルメニュー」、「フッターメニュー」と表示されているものなどもあります。さらに多くのメニュー位置の設定ができるテーマもあります。(例:モバイル用とパソコン用それぞれ別にヘッダーとフッターのメニューを作成できる機能を持つテーマもあります。その場合は、メニューの位置の選択肢は4個となります。)
以上で、フッターメニューの追加設定は完了です。
[目次に戻る ]
フッターメニュー表示例
テーマがSimplicityの場合、上記の設定後、フッターメニューはパソコンとスマホで以下のように表示されます。
スマホでのフッターメニュー表示例
左から「ホーム」、「About」、「プライバシーポリシー」、「お問い合わせ」の順で表示されています。
フッターメニューの表示形式は、テーマによって異なることがあります。Simplicityの場合は、メニュー項目を横に並べて表示します。横並びの表示の場合は、スマホ画面は幅が狭いので、メニューが一行で表示されるように項目数をある程度絞ったほうが、表示がすっきりすると思います。
[目次に戻る ]
モバイル画面での異なるフッターメニュー表示例
各メニュー項目毎に一行で表示し、メニュー項目を縦に並んで表示する形式のテーマもあります。
モバイルでは画面幅が狭いため、多くの項目を設置する場合は上の画像のようにメニュー項目を一行毎に縦に並べる表示形式が適しています。
パソコンでのフッターメニュー
以下はSimplicityのパソコン画面でのフッターメニューの表示例です。
[目次に戻る ]
作成設置したメニューを後で設定変更する
メニューをヘッダーとフッターの様に複数作成した場合、前回作成または編集したメニュー構造が表示されます。後でメニュー項目を編集する場合は、編集するメニューを選択して、変更を行います。
例: フッターメニューを作成し、その後でヘッダーメニュー(メインメニュー)を編集する場合は、編集するメニューを選ぶ必要があります。
設定変更するメニューの選択:
下の画面では、フッターメニューが選ばれています。
ヘッダーメニュー(メインメニュー)を編集、設定変更したい場合は、メニュー選択欄をクリックして、メインメニューを選択します。
括弧内に表示されるメニュー種別の名称はテーマによって異なることがあります。Simplicityの場合は、「ヘッダーナビ」と「フッターナビ」です。「グローバルメニュー」、「フッターメニュー」など異なる名称を使用しているテーマもあります。
メインメニュー(作成したメニュー名によって名前は異なります)が選ばれている場合の表示例です。
変更するメニューを選択した後、[選択]ボタンを押すと、選択されたメニューのデータが表示されます。本記事内で紹介しているメニュー項目名(ナビゲーションラベル)の編集、項目の表示順、メニューの設置位置の変更設定ができます。
コメントを残す(承認後表示されます)