サイト内の全ページで表示されるフッターと、PC用CTA・スマホ用固定フッターの設定方法を解説します。
>> WEBサイトのフッターが重要な理由
設定できる内容
| フッターバナー | 画像つきバナーを表示（上段：4つまで 下段：3つまで） |
| フッターメインエリア |
フッターの主な表示内容を設定 ・ロゴ |
| 固定フッター（モバイル端末専用） | モバイル表示時の固定フッター（アイコンメニューorCTA（バナー画像orテキスト）を設定 |
設定箇所
ダッシュボード内のTCDテーマ > フッターで設定します。
バナーリスト
レイアウトの異なる2タイプのバナーを表示できます。「アバウトページ」「アクセスページ」「サービスページ」など、ユーザーにとって重要なページへの導線にご活用ください。
| バナータイトル すべてのバナーに反映されます。 |
・フォントタイプ ・文字サイズ（PC/スマホ別） |
| バナー（上） 背景画像の上にタイトルを表示します。 |
・画像 ・タイトル ・サブタイトル ・URL ・オーバーレイ（共通） |
| バナー（下） 左側にスクエア画像・右側にタイトルを表示します。 |
・画像 ・タイトル ・サブタイトル ・URL |
設定画面はこのようになっています。バナーごとに開閉して設定できます。
フッターメインエリア
ロゴや基本情報のほか、メニューも表示できます。
| 視差効果 | 視差効果をオフにできます。 ※視差効果：スクロールと少しずれてフッターが表示されるエフェクトのこと |
| ロゴ | TCDテーマ > 基本設定 > ロゴで設定したロゴを表示します。 |
| 情報 | テキストを表示します。テキストリンク（<a>～</a>）使用可。 |
| SNSアイコン | TCDテーマ > 基本設定 > SNS > SNSアイコンでURLを入力します。 |
| メニュー | 外観 > メニューの「フッターメニュー」を表示します。 >> メニューの設定方法 |
| コピーライト | コピーライトを設定します。例：© 2025 サイト名 |
設定画面はこちら。マニュアルを見なくても設定箇所がわかるように設計しています。
固定フッター（モバイル端末専用）
スマホ閲覧時の画面下部に固定フッターを表示できます。すぐタップできる位置に重要リンクを固定表示でき、ユーザーの利便性を高めます。
表示する内容を以下の3パターンから選択します。
- アイコンメニュー
- CTA（バナー画像）
- CTA（テキスト）
CTA（Call to Action）とは
「行動を促す呼びかけ」のことで、Webサイトの訪問者に対して、特定の行動を取るように促すメッセージやボタンを指します。サイト訪問者を顧客や見込み客に変換するための重要なパーツです。
アイコンメニュー
アイコンつきのリンクを表示します。テーマのアイコンだけでなく、お好みの画像も設定できます。
「タイプ」を使い分けてご利用ください。
| リンク | 任意のリンク先URLを設定 テーマ同梱のアイコンまたは画像と組み合わせて使用 |
| 電話番号 | 電話番号を設定する。タップで電話可能 「電話アイコン」を使用推奨 |
| シェア | TCDテーマ > 基本設定 > SNS > シェアボタンの内容を表示 「シェアアイコン」を使用推奨 |
ボタンは4つくらいまでが綺麗に見えます。
CTA（バナー画像）
バナー画像を表示します。右上にバナーを非表示にできる「閉じる」アイコンが付きます。
CTA（テキスト）
テキストとボタンを組み合わせて表示します。お好みの背景色を設定可能です。
設定が済んだら、以下のポイントを確認しておきましょう。
- ロゴはぼやけず表示されている？
- メニューは適切な数・ラベルになっている？
- スマホ固定フッターの表示・リンク先や動作は適切か？
フッターには、ユーザーにとって大切な情報をまとめるようにしましょう。バランスなどまずは当デモサイトを参考にしてみてください。
こちらの記事でも設定のコツをご紹介しています。
コメント
この記事へのコメントはありません。