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