この記事では、『THE THOR（ザ・トール）』のカスタマイズについてご紹介しています。
今回のテーマは「フッターエリアの背景色や文字色をカスタマイズする方法」です。
カスタマイズするフッターエリアってどこのこと？
これからカスタマイズしようとしているのは、サイトの一番下に表示される黒い帯の部分です。ここにはコピーライト情報が表示されています。
カスタマイザーで設定変更できるのは、コピーライト下のリンク（サイト名 by FIT-Web Create.Powered by WordPress.）の表示/非表示のみです。背景の色や、文字の色を設定したい場合は、CSSでカスタマイズをします。
背景色を変更する
1.追加CSSへ進む
外観 ＞ カスタマイズ ＞ 追加CSS へ進みます。
2.CSSコードをコピペーする
以下のCSSコードをコピーし、追加CSSに貼り付けます。
.l-footer .wider .bottomFooter{background:#191919;}
3.カラーコードを入力する
先ほどのCSSコード内の「background:#191919;」という箇所が、背景色を指定する部分になります。#以降の「191919」の部分を、設定したいカラーコードに置き換えましょう。
例えば、「ペパーミントグリーン（#00ac9a）」に設定した場合、フッターはこのように変わります。
4.保存する
最後に「公開」ボタンを押して保存します。
「Copyright」の文字色を変更する
1.追加CSSへ進みます。
外観 ＞ カスタマイズ ＞ 追加CSS へ進みます。
2.CSSコードをコピペーする
以下のCSSコードをコピーし、追加CSSに貼り付けます。
.l-footer .wider .bottomFooter .container .bottomFooter__copyright{color:#191919;}3.カラーコードを入力する
貼り付けたCSSコード内の「color:#191919;」という箇所が、「Copyright」の文字色を指定する部分になります。#以降の「191919」の部分を、設定したいカラーコードに置き換えましょう。
4.保存する
「公開」ボタンを押して保存します。
サイト名の文字色を変更する
1.追加CSSへ進みます。
外観 ＞ カスタマイズ ＞ 追加CSS へ進みます。
2.CSSコードをコピペーする
以下のCSSコードをコピーし、追加CSSに貼り付けます。
.l-footer .wider .bottomFooter .container .bottomFooter__navi .bottomFooter__list li{color:#FFFFFF;}3.カラーコードを入力する
貼り付けたCSSコード内の「color:#FFFFFF;」という箇所が、「Copyright」の文字色を指定する部分になります。#以降の「FFFFFF」の部分を、設定したいカラーコードに置き換えましょう。
4.保存する
「公開」ボタンを押して保存します。