2017年1月13日金曜日

Blogger上でFontAwesomeを活用するには

head部へはfontawesomeの呼び出しを追加
<!-- fontawesomeここから -->
<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>
<!-- fontawesomeここまで -->

外部リンク(target="_blank") をcssのみでアイコンを行末に追加するように。Blogger テンプレート デザイナーへは[カスタム CSS を追加]を用いて追記
/* 外部リンク */
.entry-content  a[target="_blank"]:after {
    padding-left:5px;
    content: "\f08e";
    font-family: Fontawesome;
}

font awesomeはhtml側で以下のように書けば平常時のように呼び出せます。
<i class="fa fa-heart fa-fw"></i>
ハートマーク ですよ。