こんにちは
株式会社クラスアクト インフラストラクチャ事業部の大塚です。
これはWordpressのCocoonテーマにFont Awesome6のアイコンを適用するためのメモです。
CocoonはFont Awesome5までは公式で対応しているのですが6は対応していないので、プラグインを導入しないと使用出来ないっぽいです
Font Awesomeとは?
Wikipediaには以下の記載あり。
LESSとは"Leaner Style Sheets"の略で、CSSの拡張のために使われる言語らしいですね。
知りませんでした。
Font Awesomeとは、CSSとLESSをベースとしたフォントとアイコンのツールキットである。
公式サイトは以下
Font Awesomeのバージョン5までであれば、Cocoon設定>全体タブのサイトアイコンフォントの以下の部分を変更することで適用することができます。
ただし「Font Awesomeの6にしかアイコンがないんだが。。。」ということが時たまあるかもしれません。
私の場合「X(旧Twitter)のアイコンを使いたいんだけど、Font Awesome5は無い!6だとあるんだけど・・・」といった状態に陥りました。
以下がそれを示しているものです。
右側のバージョンが5.15.4だとTwitterの旧アイコンはありますが、新しいアイコンはありません。
一方でバージョンを6.7.2にすると新アイコンも使えそうだということがわかります。
解決策としてはWordpressのプラグインであるFont Awesomeを導入するといいっぽいです。
これをインストールして有効化します。
設定はデフォルトのままです。
このように設定を入れておくとFont Awesome6のものもWordpressに表示されるようになりました。
ちなみに、プラグイン有効化前は以下のような表示になってしまっておりました。
Xのアイコンが表示されておりませんね。