Font Awesomeが正しく表示されない時の対処法
久しぶりにまともに記事を書くつもりが、結構しょうもない話になってしまいそうです。
以前からFont Awesomeを愛用していて「久しぶりに変えてみよっかな～」とか「ヘッダーメニューに追加したいな～」と思っていじってみたら…。
変な四角しか表示されない！
とこんな事態におちいってしまい、何時間も対処法を探る…とか、そんな恥ずかしいことしてませんか？
…そうだね。僕だね。
注意：この記事はFont Awesome4から5への切り替えを行なっていない方へ向けての記事になります。
もうすでにFont Awesome5へ切り替え済みの方はうまく設定出来てない可能性ありますので以下参照。
https://ksukelife.com/blog/1302/Contents
Font Awesomeの文字化け対処法
おそらく色々調べた結果、「font-weight」をいじってみたりとかされたかも知れません。ですが残念。それでは何も変わりません。
結論から言います。
そのアイコンのコードなりタグなり…
どっから取ってきた？ｗ
Font Awesomeのver4と5以降では仕様が異なっているため、当然関連付けされてませんので読み込むべきファイルが見当たらない為四角の表示しかされない、ということですね。
Font Awesomeで検索すると新しいページの方が表示されてしまう為、そこで探してしまいがちですが実は見慣れたページはまだあります。
つまりこっから取らなかったら、Font Awesome5以降のCSSファイルを持ってるか読み込んでるかしないとダメってことですね。
こんなしょうもないことにだいぶ時間を費やしてしまうとは…。
なんてこったい／(^o^)＼
まぁ可能性として、こんなこともあり得るのでお試しを。