アイコン

今回はwordpressにfont awesomeをインストールする方法やその使い方、cssでの指定・記述の仕方についてご紹介していきたいと思います。

wordpressにfont awesomeをインストールする方法

wordpressにfont awesomeをインストールする方法・手順としては、下記のような流れになります。

  1. font awesome公式サイトでCDNコードをコピー
  2. これをwordpressのヘッダー(header.php)のheadタグ内に貼り付ける

font awesome公式サイトでCDNコードをコピー

wordpress fontawesome CDN コピー

まずはfont awesome公式サイト(https://fontawesome.com/start)のトップページから、CDNのコードをコピーします。

CDNとはコンテンツ・デリバリー・ネットワーク「Content Delivery Network」の略で、同一のコンテンツを、 多くの配布先、例えば多くのユーザーの端末に効率的に配布するために使われる仕組みです。

2019年1月現在における最新バージョンVersion:5.6.3になりますが、これが古い場合は公式サイトからコピーしてください。

wordpressのヘッダー(header.php)のheadタグ内に貼り付ける

次にfont awesome公式サイトでコピーしたCDNを、お使いのwordpressのヘッダー(header.php)のheadタグ内に貼り付けます。

wordpress fontawesome CDN ヘッダーに貼り付け

まず左側のメニュー「外観」から「テーマの編集」をクリックします。

wordpress fontawesome CDN ヘッダーに貼り付け②

テーマヘッダー(header.php)のheadタグ内にCDNを貼り付けます。

あとは「ファイルを更新」ボタンを押すことで、wordpressにfont awesomeを導入・インストールすることができました。

CDNでのfont awesomeの導入は簡単ですし、サイトの動作も速いのでおすすめです。