自分のブログは華やかではありません
amebaのブログとか見るとめっちゃ絵文字だらけｗｗｗ
あそこまでいかなくても
ちょっとした絵文字なんかを導入したかった
別件、調べ物をしていたら「FontAwesome5」というアイコンセットが簡単に導入できると知ったので
しかも無料だったので導入してみた
色々調べてみたら「はてなブログ」にはデフォルトのアイコンセットがある事をしったのでさらに導入した・・・
注意事項
はてなブログにはCSSやヘッダーのバックアップ機能はありません。もし修正する場合は必ずバックアップをとって修正してください。私はテスト用のブログで検証してからやっています。もしおこなう場合は自己責任でお願いします
FontAwesome5の導入手順
はてなブログの編集画面に行く
→ 【 設定】をクリック
→ 【詳細設定】をクリック
→ 【headに要素を追加】
下記の内容を追加する
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome-animation/0.0.10/font-awesome-animation.css" type="text/css" media="all" />
FontAwesome5の使い方
- アイコンを探す
fontawesome.com - 記事の編集画面でタグ書く
<i class="fab fa-twitter"></i>
ツイッタのアイコンが表示されいるｗｗｗ
動きがあるアイコンもあります
<i class="fab fa-twitter faa-wrench animated"></i> <i class="fas fa-music faa-bounce animated"></i>
はてなブログデフォルトのアイコンセットを導入と使い方
はてなブログの編集画面に行く
→ 【 デザイン】をクリック
→ 【 カスタマイズ】をクリック
→ 【 デザインCSS】をクリック
下記を追加する
font-family:blogicon;
使用例
<i class="blogicon-hatenablog"></i> <i class="blogicon-bookmark"></i>
参考URL
感想
アイコンが導入できてよかった。うざくならない程度に使いたい
