読者です 読者をやめる 読者になる 読者になる

はてなブログで「FontAwesome」を使う

FontAwesome はてなブログ

FontAwesome とは何か?

fontawesome.io

WEBフォントと呼ばれるアイコンフォントを提供するサービスです。

こちらはSeesaaブログで使用した記事です。
【WEBフォント】Font Awesomeのアイコンフォントを使ってみた、WEBフォントでSeesaaブログをパワーアップ!


はてなブログで使ってみよう

まず、FontAwesomeを使えるようにするためのコードを取得しましょう。こちらのページから、はてなブログに組み込む「link」タグをコピーしましょう。
Get Started with Font Awesome

はてなブログへの組み込みは、「設定」→「詳細設定」タブの中の「headに要素を追加」の部分にコーピーした「link」コードをペーストして変更を確定しましょう。
f:id:k-144:20160228194053j:plain


アイコンフォントを使ってみよう

「FontAwesome」のIconページから利用したいアイコンを選んでみましょう。
Font Awesome Icons

例えば、この記事内で利用している外部リンクのアイコンを利用するにはこちら
fa-external-link: Font Awesome Icons
表示されている「i」タグをコピーして記事内の表示させたいところにペースト。


こんな風に。

簡単ですね。