 はてなブログのアイコンフォントを使う

ブログの中ではてなブログの機能のことを書こうとしたけれどテキストでは説明しにくいのではてな特有のアイコンを使いたくなりました。例えばとかなどです。

はてなブログでアイコンを提供していてフォントをインストールしなくても使えるそうです。またそれらのフォントは環境に左右されません。提供されているフォントは123種類あってこちらはてなブログで使えるアイコンフォント(Webフォント)123種類 - FOXISMで確認できます。

はてなアイコンフォントを使う

1.アイコンフォントを利用するにはHTMLで利用します。編集モードを「Markdown」か「はてな記法」モードに切り替えます。
2.アイコンフォントの記事から使いたいフォントのclassをコピーして次のコードに設定します。「blogicon-hatenablog」の部分です。

<i class="blogicon-hatenablog"></i>

するとといったようにアイコンが表示されます。アイコンの大きさや色の変更については→【はてなブログ】アイコンを使う(はてな編) - みずー工房さんを参考にしてください。

 まとめ

簡単にアイコンが使えるのには驚きました。こんなところにもはてなのサービスがありました。

See you tomorrow!

follow us in feedly