今回は、モバイルで表示されるフッターメニューの
カスタマイズです
デフォルトで設定されているアイコンを変えたいと思います
Font Awesome 5を使う設定にする
Font awesome 5 というサイトにある
アイコンを使えるようにする作業です
Font Awesome 5でアイコン選び
Font Awesomeのサイトで好きなアイコンを
選ぶのですが、ここで注意してもらいたいのは
Ver.5.××を選んでおくことと
Freeにチェックを入れること
使用可能なアイコンを選ばないと、ちゃんと
表示されませんでした
（これが一番悩んだポイントだったので！！）
アイコンを選ぶと、コードが表示されるので
その中の fas fa-○○○○ の部分を使います
フッターメニューを作成、カスタマイズ
「外観」→「メニュー」で「モバイルフッターメニュー」を作成します
具体的な作成方法は参考にさせていただいたサイトを
ご参照ください
↑こちらのサイトではFont Awesome4での作り方に
なっていましたので、それを5でやれる方法に練り直しました
それが前項に書いた Font Awesome のVer.選択です
4だと fa fa-○○ なのが
5だと fas fa-○○ になってたみたいで
そこを理解するのにいろんなサイトのいろんなやり方を
試して泥沼になったことも・・・
こんな感じでメニューを作成、それぞれの
アイコンを指定して終了です
一括で色を変更するやり方は
こちらのサイト様を参考にさせていただきました
「外観」→「テーマファイルエディター」で
Cocoon Childのスタイルシート（style.css）に
色を変える合言葉を入力・更新
/* モバイルフッターボタンの色 */
.menu-button,
.mobile-menu-buttons .menu-button > a {
color: #c6ac29;
}
#c6ac29はこのサイトで指定した色なので好きなコードに
変えてOK
こんな感じでなんとかモバイルフッターメニューの
カスタマイズが終了しました
今回地味に大変だったのは、Font Awesome5の
アイコンを使う方法が載っているサイトがなかなか
見つからなかったことに尽きます
結果、どのコードを使えばいいのか、どうやって
それを探せばいいのかが分かれば一番シンプルな
設定でできましたので、その方法をまとめました
こういうなんてことない微々たるカスタマイズを
引き続き続けています・・・
