フッター周りの設定方法

フッター周りの設定方法
記事上のウィジェットエリア

このページでは、SWELLのフッター周りの設定方法を説明していきます。

  • カスタマイザーでのデザインカスタマイズ方法
  • フッターメニューの設定方法
  • フッター周りで使用できるウィジェット

について、まとめていきます。

目次前広告表示エリア
目次

テーマカスタマイザーで設定できること

SWELLでは、デザインに関する設定はほぼ全てテーマカスタマイザーから行うことができます。

フッター周りのカスタマイズは、カスタマイザーの「フッター設定」にまとめています。

フッター設定

この「フッター設定」を選択すると、以下のような設定項目がでてきます。

フッター設定の各項目について
  1. ページトップボタン」の表示に関する設定
  2. コピーライト」として表示するテキストの設定
  3. フッターに「SNSアイコンリスト」を表示するかどうか

ページットップボタン

ボタンの形を四角にする丸くするか、もしくは表示しないか、を選択できます。

ページトップボタン2種
ページトップボタン2種

コピーライトの文章

ページ下部に表示している©︎~の部分の表示を好きにカスタマイズ可能です。
当サイトでいうと、以下のオレンジ線で囲んだ部分のことです。

コピーライト

SNSアイコンを表示するかどうか

ヘッダー周りの設定にて、ヘッドバーにSNSアイコンリストを表示できますが、フッターにも表示できます。

画像

チェックボックスで表示・非表示を切り替えることができます。

フッターのカラー設定について

フッターの色味に関する設定は、「フッター設定」ではなく、カスタマイザーの「カラー設定」から設定できます。

背景色文字色を設定できます。

画像

スマホの画面下部に表示される「固定フッターメニュー」について

スマホの画面下部に表示される「固定フッターメニュー」に関する設定も、同じくカスタマイザーの「フッター設定」からカスタマイズできます。

固定フッターメニューに関しては、以下の記事で個別に設定方法をまとめていますので、ぜひご覧ください。

あわせて読みたい
スマホ用の固定フッターメニューの設定方法
スマホ用の固定フッターメニューの設定方法このページでは、スマホ画面下部に固定表示されるフッターメニューの使用方法・設定方法について紹介いたします。以下、「固定フッターメニュー」とは、以下のオレンジ...

フッターメニューの設置方法

次に、コピーライトの上部に設置することのできる「フッターメニュー」の設定について説明します。
フッターメニューとは、以下のオレンジの線枠で囲まれた部分のことです。

フッターメニュー

このフッターメニューは、「外観」>「メニュー」から設定することができます。

フッターメニュー設定ガイド
フッターメニューの設定画面
  1. 管理画面の「メニュー」をクリックすると、上記のメニュー編集画面に入ることができます。
  2. フッターメニューを初めて作成する場合は、「新しいメニューを作成しましょう」のリンクをクリックして新規メニューを作成してください。
  3. フッターメニューに追加したいページを選択します
  4. 現在設定されている項目(マウスで掴んでドラッグすると並び替えできます)
  5. 作成したメニューを「フッターメニュー」として使用するため、チェックを入れてください
  6. 「メニューを保存」ボタンを押すと、設定が保存されます。

といった感じで設定できます。

⑤ の、「フッターメニュー」にチェックを入れる、というのがポイントです。

ここではざっくりと説明しましたが、カスタムメニューの基本的な作成方法については、グローバルナビの設定方法にてもう少し細かく丁寧に説明しているので、参考にしてみてください。

フッター周りで使用できるウィジェットについて

SWELLでは、フッター周りのウィジェットは大まかにいうと2種類、細かくいうと5種類のウィジェットを用意しております。

例えば、当公式サイトでは、以下の部分がウィジェットエリアとなっており、

フッターに表示されるウィジェット
  1. フッター直前に表示されるウィジェットエリア
  2. フッター内部に表示されるウィジェットエリア
    1. PC表示では最大3列表示となり、3つのウィジェットを用意
    2. SP表示では、専用に1つのウィジェットを用意(設定がなければ自動でPCと同じものが反映されます)

といった構成になっています。

管理画面の「外観」>「ウィジェット」から、該当するウィジェットエリアに項目を配置してご利用ください。

ウィジェット一覧
ウィジェット一覧

フッター(PC)ウィジェットの1〜3について

中身にウィジェットアイテムを配置しているものだけが有効となり、有効となっているウィジェットの数に応じて、フッターのウィジェットエリアのカラム数が自動で変化します。

例えば、「フッター(PC)1」だけにウィジェットアイテムを配置しても、「フッター(PC)3」だけに配置しても、どちらも1カラムで中央に表示され、左だけ、右だけに偏って表示されるといったことはありません。

フッター(スマホ)ウィジェットについて

この設定エリアの中にウィジェットアイテムが配置されている場合、「フッター(PC)の1〜3」はスマホでは表示されず、「フッター(スマホ)」ウィジェットのみが表示されます。

これにより、PCでのフッターウィジェットがそのまま表示されてしまい、スマホのフッターが長くなりすぎる、ということを防ぐことができます。

「フッター(スマホ)」の中身が空の場合は、「フッター(PC)の1〜3」が順に縦並びで表示されます。

記事下のウィジェットエリア

この記事が気に入ったら
フォローしてね!

目次
目次