「AFFINGER7でメニューを作りたいけど、どこから設定すればいいの?」
「ヘッダーメニューやフッターメニューの違いがわからない……」
AFFINGER7では、メニューを設定することで訪問者が目的の記事へ移動しやすくなります。
特にブログを始めたばかりの方は、わかりやすいメニューを作ることで回遊率アップにもつながります。
この記事では、AFFINGER7のメニュー作成方法を初心者向けにわかりやすく解説していきます。
※ この記事はAFFINGER6時代に作成した内容をAFFINGER7対応版として更新しています。
メニューの種類と位置について
「メニュー」とは主要なページへのリンクをまとめたものです。
例えば下画像の赤枠部分がメニュー(ヘッダーメニュー)です。

「メニュー」は作成する場所によって名称が異なりますので、初心者の方はまず「メニューの種類」を覚えておきましょう。
| ① ヘッダーメニュー | ヘッダーに設置したメニュー |
| ② サイドメニュー | サイドバーに設置したメニュー |
| ② フッターメニュー | フッターに設置したメニュー |
それぞれのメニューの位置はこんな感じです。

メニューを作成する前の準備
「メニュー」は主要なページへのリンクを設置するのが一般的ですが、その中でも「カテゴリー」を設置する場合が多いです。
なので、「メニュー」を作成する前に「カテゴリー」を作成しておきましょう。
カテゴリーって何のこと?
「カテゴリー」とは記事の分類のことです。
例えば、自分のブログが「ワードプレス」や「ブログ」に関する記事を載せたいと思えば記事の分類(カテゴリー)は「ワードプレス」や「ブログ」といったカテゴリーが思いつきますよね。
ヘッダーメニューにカテゴリーを設定しておくと、読者の方にとってわかりやすいブログになります。
カテゴリーの作成方法
「カテゴリー」を作成する手順を解説していきます。
① WordPressメニューから「投稿」→「カテゴリー」を選択します。
② 新規カテゴリーを追加する画面から名前入力欄にカテゴリー名を入力します。
③ 「スラッグ」の欄は入力したカテゴリーを英語表記で小文字で入力しましょう。
英語表記にするのは「グーグル翻訳」を利用すると便利です。

スラッグって何のこと?
「スラッグ」についてはパーマリンク設定方法の記事で詳しく解説しています。
④ 入力が完了したら画面したの「新規カテゴリーを追加」をクリックします。

これでカテゴリーの作成は終了です。
自分のブログが何について発信したいのかある程度決まっている方は、前もってカテゴリーを作成しておきましょう。
AFFINGER7のヘッダーメニュー作成方法
下画像のようなヘッダー部分に表示するメニューです。

AFFINGER6では2通りの方法でヘッダーメニューを作成することができます。
- 「メニュー」から作成する方法
- 「カスタマイズ」から作成する方法
「メニュー」から「ヘッダーメニュー」を作成する方法
① WordPresメニューの「外観」→「メニュー」を選択します。
② 「メニュー名」を入力します。
「ヘッダー」とでも入力しておけば大丈夫です。
③ 「メニュー設定」で「ヘッダーメニュー」を選択します。
④ 「メニューを作成」をクリック

「メニュー項目を追加」の「カテゴリー」タブで「すべて表示」をクリックして、追加したいカテゴリーを選択します。
この例では予め「ブログ作成」というカテゴリーを作成しておいたので「ブログ作成」のカテゴリーが表示されています。
メニューに追加したいカテゴリー項目の選択が終わったら「メニューに追加」をクリックします。

「メニュー構造」に追加したカテゴリーが表示されます。

「ホーム」へのリンクも追加しておきましょう。
「メニュー項目を追加」の「固定ページ」で「すべて表示」をクリックします。
「ホーム」を選択して、「メニューに追加」をクリックします。

「メニュー構造」に「ホーム」と「ブログ作成」が追加されました。
最後に「メニューを保存」をクリックすれば終了です。

実際にブログを確認してみると、ヘッダーメニューが作成されているのがわかると思います。
「カスタマイズ」から「ヘッダーメニュー」を作成する方法
AFFINGER7では「外観」→「カスタマイズ」からも「メニュー」を作成することが可能です。
実際にどのように表示されるかがリアルタイムで確認できるので、初心者の方にはこちらの方が解りやすいかもしれません。
まず、WordPresメニューから「外観」→「カスタマイズ」を選択します。

「メニュー」を選択します。

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

まず「メニュー名」を入力します。
「ヘッダー」とでも入力しておけば大丈夫です。
次に「メニューの位置」で「ヘッダーメニュー」を選択して、「次」をクリックします。

メニューに「ホーム」へのリンクを追加します。
固定ページのタブから「ホーム」をクリック。

カテゴリーを追加します。
カテゴリーのタブから追加したいカテゴリーをクリックします。
画像の左側で追加されたメニュー項目が確認でき、右の画面で実際のヘッダーメニューが表示されて確認することができます。

最後に「公開」をクリックすれば、ヘッダーメニューの作成は終了です。
AFFINGER7のヘッダーメニュー作成方法
次にフッターメニューの作成方法を説明します。
フッターメニューはブログの下部(フッター)に設置されたメニューです。

「お問い合わせフォーム」を作成する方法については別記事で紹介しているので、そちらを参考にしてみてください。
フッターメニューもヘッダーメニューと同様に2通りの方法で作成することが可能です。
- 「メニュー」から作成する方法
- 「カスタマイズ」から作成する方法
作成方法も「ヘッダーメニュー」で説明した方法と一緒です。
「メニュー」から「フッターメニュー」を作成する方法
① WordPresメニューから「外観」→「メニュー」を選択する
② 「メニュー名」を入力する
フッターとでも入力しておけば大丈夫です。
③ 「メニューの設定」で「フッターメニュー」を選択する
④ 「メニューを作成」をクリックします

メニュー名が「フッター」であることを確認してから、「お問い合わせフォーム」の固定ページにチェックを入れて「メニューに追加」をクリックします。

フッターメニューに「お問い合わせフォーム」の固定ページが追加されたのを確認したら「メニューを保存」をクリックします。

フッターメニューに「ホーム」へのリンクも追加したい場合は「固定ページ」の「すべて表示」に「ホーム」項目があるので、そちらをクリックして追加してください。(ヘッダーメニューの時と同じ操作です)
これでフッターメニューの作成は終了です。
ブログを表示して実際の表示を確認してみてくださいね。
「カスタマイズ」から「フッターメニュー」を作成する方法
「カスタマイズ」から「フッターメニュー」を作成する方法は「ヘッダーメニュー」の時と同様の操作になります。
WordPresメニューから「外観」→「カスタマイズ」を選択して「メニュー」→「メニューを新規作成」をクリックします。
次画面でメニュー名を入力(フッターとでも入力しておけば大丈夫です)、メニューの位置で「フッターメニュー」を選択して「次」をクリックします。

「項目を追加」をクリックします。

「フッターメニュー」に追加したい固定ページをクリックして選択します。

「フッターメニュー」に固定ページを追加すると画面右下に実際のフッターメニューが表示されます。

最後に「公開」をクリックすればフッターメニューの作成は終了です。
まとめ
メニューはただ作るだけではなく、サイト全体の価値を高める戦略的な要素です。
AFFINGER7のメニュー機能は強力で自由度が高いですが、初心者にはわかりにくい面もあります。
初心者の方は、まずヘッダーメニューとフッターメニューの作成から取り組んでみてください。
\\ 収益化に強い圧倒的人気テーマ!//
AFFINGER7がついにリリース!
AFFINGER6から更に機能がパワーアップ!
※ AFFINGER6は現在、AFFINGER7へと移行となりました。