APG font-awesome-collectionの代替えでFont-awesome-free」-式を選んだ。

プラグインのAGP font-awesome-collectionを今回もインストールしてメニューとかサイドバーへアイコンを貼り付けたが、カスタマイズから画面を見ると上部にエラー表示される。今のところ問題は無いようだが、いずれ互換性が無いと言うことで利用不可になる可能性がある。又、幾つかのFont Awesomeのプラグインを試したが、なんとなく使いずらい感じなのでプラグインを使わない方法にした。そこで最も簡単なFont-awesome-free」一式をダウンロード、Wordpressにアップロードして使うことを選んだ。

– Font-Awesome-Free –

ダウンロードした fontawesome-free-5.2.0-web.zipを解凍

 #Font Awesomeのダウンロード先:
  https://fontawesome.com/docs/web/setup/get-started

Font Awesomeを使う準備

 1.子テーマのディレクトリ(フォルダ)内に font-awesome ディレクトリを作成。
  /wp-content/themes/twentyseventeen-child/font-awesome
 2.その下に上記①で解凍したディレクトリの下の /webfonts/ 全てと /css/ ディレクトリの中の all.min.css をコピー。

functions.phpに以下を記述。

 wp_enqueue_style( 'font-awesome', get_stylesheet_directory_uri() . '/font-awesome/css/all.min.css', array());

Font Awesomeで表示したいアイコンを探し、クリックで表示されるページのコード(タグ)をコピーして任意の場所に貼る。

 #Font Awesome
  https://fontawesome.com/v5.15/icons?d=gallery&p=2
 #Font Awesome アイコンフォント一覧 [Free (フリー) のみ]
  https://johobase.com/font-awesome-icon-font-list-free/

# 以下のようにコード(<i class=”far fa-smile”></i>)を貼り付ける。      
    このように 表示できたら成功。

メニューへのアイコン、サイドバーにも難なく張り付けることが出来た。たしか、「Free CDN」とかがあるようだけど、詳しくないので上記の方法を選んだ。

TOP

Copyrighted Image