Font Awesome Iconsがなぜか表示されない…version更新してる？解決策紹介 【Stinger5】

費用：0円　時間：5分

このサイトはStinger5をもとに作成しています。

Stinger5は既定でFont Awesome Iconsの設置ができるということなので、Font Awesome Iconsのアイコンを設置してみると…

長方形の謎のマークが表示されます。

文字化け？でしょうか。

この理由をいろいろと考えたのですが、Font Awesome Iconsのversionが関係しているのではないか？と思いました。

Font Awesome Iconsは昔のバージョンのままではなく、新しいアイコンのために持続的に更新しています。

しかし、Stinger5でのFont Awesome Iconsのversionは特別、自動で更新されることはありません。

ということは、Font Awesome Iconsの更新に伴って、+αとして追加されたアイコンや機能は利用できないんじゃないのかなあ…と思ったというわけです。

ということで、Stinger5にFont Awesome Iconsのアイコンを新規で設置する場合はversionを更新しておきましょう！

sponsored link

header.phpを編集

WordPress管理画面＞＞外観＞＞テーマを編集　をクリックしましょう。

そして　font　などとページ内検索して以下のコード部分を編集しましょう。

<link href="//netdna.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.css" rel="stylesheet">

書き換えるべきは、font-amesome/以下の数字の部分です。

これがversionを表しています。

このバージョンの確認方法は、

Font Awesome Iconsの公式ページのトップ部分に書かれていますよ。

そして保存すればおｋです。

おそらくはフォントが文字化けなしに設定できるのでは？

できない場合は、リンクがわかりづらいからだと思うのでhrefにhttp:を書き足しましょう。

<link href="http://netdna.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.css" rel="stylesheet">

ということで、Font Awesome Iconsの最新アイコンをぜひとも使ってみてください(*^^)v