悩んでいる男性フッターに人気記事とかアーカイブとか入れたいんだけど。設定方法を教えて。
今回はフッターの設定について説明しています。画像付きで詳しく説明しています。
- フッターメニューの作成方法
- 固定フッターメニューのカスタマイズ
- フッターに好きなウィジェットを入れてカスタマイズ
フッターとは、ページの一番下のエリアのことです。
一番下まで読まれることはあまりありませんが、スマホの固定フッターメニューは比較的使える頻度が高いので、ユーザビリティを高めるために効果的です。
PC版とスマホ版それぞれ設定できるので、デバイスに合わせて設定しておきましょう。
SWELLでは「テーマカスタマイザー」と呼ばれる、設定の変更をプレビュー画面で確認しながらカスタマイズ出来る機能があります。
画面左側の設定を変更すると、変更内容が右側にプレビューとして表示されます。
この機能を使って、変更を確認しながら基本設定を進めましょう。
「テーマカスタマイザー」を利用してスマホ画面をレビューを見ながらチェックしたい場合は、画面左下のコントロールを非表示の横のマークで切り替えられます。
SWELLをまだ導入していない方は以下の記事が参考になります。
フッターの基本設定
「外観」＞「カスタマイズ」＞「フッター」に進みます。
ここではフッターのカラーや、SNSアイコン、コピーライトが設定できます。
フッターのカラー設定
フッターのカラー設定に関しては以下の記事をご覧ください。
コピーライト設定
コピーライトの表記を変えることができます。@以降をテキストで入力しましょう。
その他の設定
「カスタマイズ」＞「SNS情報」で設定されているSNSアイコンを表示することができます。
表示する場合は、チェックを入れ、SNS情報にURLを入力しておきましょう。
フッターメニューの設定
次にフッターメニューの設定をしましょう。
設定は、Wordpressのダッシュボードの「外観」>「メニュー」から設定できます。
詳細はグローバルメニューの設定方法と全く同じなので、以下を参考にしてみてください。
最後に、メニューの位置を「フッター」にチェックを入れれば設定した内容がフッターに反映されます。
固定フッターメニューのカスタマイズ
固定フッターメニューとは、スマホ画面でスクロールした際に画面下部に表示されるメニューのことです。
SWELLで用意されているフッターメニューの設定
固定フッターメニューは「外観」>「カスタマイザー」>「サイト全体設定」＞「下部固定ボタン・メニュー」内のスマホ用固定フッターメニューの設定から設定できます。
ボタンを表示するかどうかを設定できます。
設定できる項目は以下の4つです。（アイコンは変更できません）
- 「メニュー開閉ボタン」
- 「フリーワード検索ボタン」
- 「ページトップボタン」
- 「目次メニュー」
表示するメニューにチェックをいれ、各メニューのタイトルを入力します。
スマホ用固定フッターメニューの設定をもう少し下にスクロールすると、フッターメニューのカラーを設定できます。
オリジナルでフッターメニューを作成する方法
SWELLで用意されているフッターメニュー以外で、自分でメニューを作成したい場合について説明します。
まずは、Wordpressのダッシュボードで、画面右上にある「表示オプション 」をクリックします。
すると以下のように表示オプションが表示されるので、「説明」にチェックが入っているのを確認してください。
次に、Wordpressのダッシュボードの「外観」>「メニュー」に進み、「フッターメニューの設定」と同様の手順で、固定フッターメニュー専用のメニューを作成します。
最後に固定フッター（SP）にチェックを入れて、メニューを保存します。
メニューが作成出来たら、「外観」>「メニュー」内の②で作ったメニューをクリックします。
すると、以下のようにメニューの設定が出来るエリアが現れます。
まずは表示させたいラベル名を「ナビゲーションラベル」に入力します。
次に「説明」欄に表示させたいアイコンのクラス名を入力します。
SWELLで使用できるアイコンは公式HPで紹介されているので、アイコンのクラス名を知りたい場合はこちらを参考にコピペすればOKです。
以上で、アイコン付きのオリジナルでフッターメニューが完成しました。
フッターに好きなウィジェットを入れてカスタマイズする
フッターには、自分が入れたいウィジェットを挿入することもできます。
例えばフッターにプロフィールを入れたり、人気記事・新着記事リストを入れたりすることもできます。
また、フッター直前にウィジェットを入れることも可能です。
それでは設定方法について説明していきます。
まずはWordpressのダッシュボードの「外観」>「ウィジェット」に進みます。
ウィジェットを挿入させたいエリアを上記の中から選びます。
スマホ版も用意されているので、スマホのフッターが長くなりすぎないように調整ができます。
フッター（PC）ウィジェットの１〜３は、ウィジェットを設置したエリアのみがフッターに表示されます。
例えば、「フッター（PC）１」だけにウィジェットを設置すると、フッターには「フッター（PC）１」に設置したウィジェットが1カラムで中央に表示されます。
「フッター（PC）１〜３」すべてにウィジェットを設置すると、フッターは3カラムでウィジェットを表示します。
画面左にある、「利用できるウィジェット」の中から使いたいウィジェットを、上記のエリアに設置します。
例えば、「フッター（PC）１」にカテゴリを入れると、以下のように設定ができます。
タイトル名を入れ、表示形式を選択し、保存をクリックすればOKです。
もう一つ例として、「フッター（PC）２」に人気記事を入れてみましょう。
タイトル名や、レイアウト、表示項目を選択できます。人気記事を非表示にしたいページも選択可能です。
設定が出来たら保存をクリックすれば、フッターのカスタマイズ完了です。
以上で、フッターの設定は終わりです。