【第13回】フッターの編集

連載講座：WordPressで作る簡単Webサイト

このテーマでは３つのフッターエリアがあります。メインフッター「Primary footer」の他に、その上下に「Above footer」と「Below footer」があります。
Below footer にはフッターメニューとコピーライトを表示させ、メインフッターにはウィジェットを追加して表示する内容を設定します。

カスタマイザーに移動し、[フッタービルダー] をクリックします。
Below footer をクリックして、Footer Menuエレメントを追加します。
Footer Menu が Copyright の前になるよう、ドラッグして位置を調整します。
Below footer の設定ボタンをクリックします。
DESIGNタブをクリックし、[色と背景] のプレビューボタンをクリックします。
[16進数での色指定：#277e4c] と設定します。
Copyrightエレメントをクリックします。
表示する文字列の後半を消して以下のようにします。
Copyright [copyright] [current_year] [site_title]
DESIGNタブをクリックし、[文字色] のプレビューボタンをクリックします。
[16進数での色指定：#eeeeee] と設定します。
Footer Menuエレメントをクリックします。
タブレットとスマホビューで、[レイアウト：インライン] に変更します。
DESIGNタブをクリックし、[メニューの色] の編集ボタンをクリックします。
通常タブで [リンク/テキスト色：#eeeeee]、マウスオーバータブで [リンク色：#aaaaaa] に設定します。
次にメインフッターの設定をしますので、Primary footer の設定ボタンをクリックします。
[カラム：3] にして、[レイアウト] は3つ目のレイアウトを選択します。
DESIGNタブをクリックし、[上枠線：0] に設定します。
[色と背景] のプレビューボタンをクリックし、[16進数での色指定：#eefdf4] に設定します。
左カラムの +ボタンをクリックし、Widget 1 エレメントを追加します。
同様に中カラムには [Widget 2]、右カラムには [Widget 3] を追加します。
公開ボタンをクリックしてカスタマイザーを閉じます。
[外観]-[ウィジェット] をクリックします。
[Footer Builder Widget 1] に、画像ウィジェットを追加し、メディアライブラリから「logo_pc_small.png」を追加します。追加したら保存ボタンをクリックし、[完了] をクリックします。
[Footer Builder Widget 2] に、テキストウィジェットを追加し、テキストタブにして以下を入力します。
　[タイトル：]なし
　[内容：]
　〒100-8111
　東京都千代田区千代田1-1-1
　電話：03-1111-2222
　メール：info@example.com
[Footer Builder Widget 3] に、最近の投稿ウィジェットを追加します。
[タイトル:] を "お知らせ" にし、表示する投稿数は "3" に設定します。
カスタマイザーに移動して、[フッタービルダー]-[Widget 1] をクリックします。
デスクトップビューの [マージン左] を [20] に設定し、スマホビューは [0] にします。
[Widget 3] をクリックします。
[ウィジェットの色] の編集ボタンをクリックします。
デスクトップビューにしてから、通常タブで [リンク：#3a3a3a]、マウスオーバータブで [リンクホバー：#aaaaaa] に設定します。
ブラウザでフッターの表示を確認しましょう。