Font Awesomeを使ってアイコンを表示

「Font Awesome」を開いたら「icon」をクリックします。

使いたいアイコンを英単語で検索します。ここでは「home」を検索しました。濃い色のアイコンのみ無料で使うことができます。

「Start Using Font Awesome」をクリック。

表示されたコードを使ってアイコンを表示させることができます。

たとえば、homeのアイコンを使いたい場合は、このように指定すると表示されます。

<a title="ホーム" href="URL">
<i class="fas fa-home"></i>
</a>

ルクセリタスのフッターに使ってみた

あいにくルクセリタスにはCocoonのようなフッター機能はなく、「外観→メニュー」からフッターナビを作成しようとしたのですが、上手くいきませんでしたのでウィジェットで設定することにしました。

まずは、外観→カスタマイズ→「ヘッダー/フッター」の1番下の項目「フッターウィジェットエリア表示数」を「横一列（中央）」に設定します。

ウィジェットの「フッター中央」に「テキスト」を使ってコードを埋め込みました。

<center>
<a title="ホーム" href="URL">
<i class="fas fa-home"></i></a> | 
<a href="URL">プライバシーポリシー</a> | 
<a href="URL">著作権</a> | 
<a title="お問い合わせ" href="URL">
<i class="far fa-envelope"></i></a>
</center>

こんな感じに完成！アイコンを使うことによりスマホでもコンパクトに1列に表示することができました。