【WordPress】Font Awesome(アイコンフォント)が使えるようになるプラグイン
- 2021年2月27日
追記と一部書き直しをしました。
前々回、前回とアイコンフォント『Font Awesome』についての記事を書きました。
https://kirari-yums.net/post-2636/
これはプラグインを使わずにFont Awesomeを使うことができる方方法です。
私がこの方法を使う前は『プラグイン』を使っていました。
プラグインを使う方法も簡単にできますのでご紹介したいと思います。
2021年2月27日
この記事で紹介している『Better Font Awesome』はショートコードを使用してアイコンを表示させるプラグインです。
Font Awesome公式のプラグイン『Font Awesome』を使うと導入が簡単にでき、iやspanといったHTMLやCSSでFont Awesomeの本来のコードで使えます。「Font Awesomeのアイコンを使いたい」と思っているならFont Awesome公式プラグイン『Font Awesome』がオススメです。
プラグイン 『Better Font Awesome』
『Better Font Awesome』は、 などのアイコンフォントが使うことができるようになるプラグインです。
Better Font Awesomeのインストール
インストール方法
- WordPress管理画面から［プラグイン］［新規追加］
- 『Better Font Awesome』を検索
- ［今すぐインストール］して［有効化］する
設定
［設定］⇒［Better Font Awesome］で上のような設定画面が出ますが、特に設定は必要ありません。
なので説明は省きます。
使い方
記事投稿画面上部に［Insert Icon］というボタンが追加されているのでそこをクリック。
ビジュアルエディタ・テキストエディタどちらでもOK
するとこんなボックスが表示されるので、使いたいアイコンを選択(クリック)すれば記事内にショートコードが挿入されます。
CSSで大きさや色も変えられます。
きらり
結耶
スポンサーリンク
Better Font Awesomeのメリット／デメリット
Better Font Awesomeは設定は特に必要ないのでプラグインをインストールするだけで使えます。また記事投稿画面からアイコンを探して挿入することができます。
簡単に使えるプラグインですが、当然WordPressでしか使えません。
また、Better Font Awesomeはショートコードを使いアイコンを表示させます。そのためCSSで設定できません。
一方、前々回、前回で私が導入した方法は、Font Awesomeのサーバーから読み込んで表示させる方法です。
使うための準備としては、<HEAD> ～</HEAD>間に表示させるためのコードを挿入させる必要があります。
2021年2月27日
Font Awesomeの導入方法が変わっています。導入方法として『アカウント登録』か『Font Awesome公式プラグインを使う』『テーマに搭載されている機能を使う』の3つの方法を紹介しています。
それにアイコンを記事に挿入するために、Font Awesomeのアイコン一覧から使いたいアイコンを探してアイコンコードをコピーしてこなくてはなりませんがHTML、CSSで使えるため記事に挿入させるだけではなく、テーマのカスタマイズなどにも使うことができます(*^^*)
ちょっと面倒くさい点もありますが、この方法ならWordPress以外のブログでも使うことができます。
きらり
それは…CSSでアイコンフォントが指定できるから！
CSSでアイコンフォントの指定ができれば、箇条書きや囲み枠、見出しなどのデザインのカスタマイズなどで使うことがで気ます。
でもプラグインのショートコードではCSSに組み込むことはできません。
最後に
記事の書き方は人それぞれです。
プラグインも私が導入した読み込む方法もどちらもCSSを使ってのサイズや色の変更はできます。
記事にアイコンフォントを使いたいだけであればプラグインで十分だとは思いますが、見出しやサイトのカスタマイズでアイコンフォントを使いたい場合はFontAwesomeの導入をした方がいいとは思います。
どの方法を使うかはみなさま次第です。ご自分にあった方法を使ってみてください。
スポンサーリンク
結耶(ゆうや)
2017年9月からブログを始め、2018年1月にWordPressに変更しました。知識ゼロのから始めた超初心者で、WordPressやHTML、CSSなど勉強したことを書いています。
愛知県在住。多発性硬化症(MS)という難病と闘っています。
ある日ひょっこり現れ住みついた居候(いそうろう)。今は結耶と一緒にWordPressやアフィリエイトのことを勉強している。
性別は♂ 。どこから来たかは不明。