
前回、ブログRSSフィードを出力する方法をお届けしました。
→ ブログRSSフィードを出力する方法
今回は、テーマに組み込まれている Font Awesome を利用してRSSボタンを設置したいと思います。
Font Awesome にあるアイコンは、ウェブフォントと同じ様に利用できる様にした物ですので、CSSで色・サイズなど文字同様に指定ができます。
デザイン部分を白に、背景色をそれぞれ指定してあげることで、各イメージロゴが浮き上がってきます。
※イメージ図

右の図の様に背景が同色(白)だと見えません^^;
他のアイコンも同様に背景色が指定されていて、ご覧のように表示されています。
スポンサードリンク

赤枠部分を追加しました。青枠はTwitter
この時点では、背景色が無い状態ですので白いボタンだけが表示される状態になります。
→ WEB色見本 原色大辞典
既出の物は、テーマ製作者さまが style.min.css に記載して下さってますが、他のものはこの様に追記が必要になります。
→ アイコン一覧表
→ 詳しい使い方はこちらがおすすめ

脱線しましたが、RSSフィードURLをリンク先にしておけばOKです。
RSSボタンを設置する方法は以上になります。
safari からアクセスしてみると・・・

商品の販売やサービスの提供もよりスムーズになるかもしれません。しかし、最も大切なのは、定期的な更新と良質なコンテンツの提供だと思いますので、私自身も努力してまいります。
お役に立てましたら、いいね!&シェアして頂けると幸いです。
ご覧頂きありがとうございます。
P.S.
Twitter はじめました。
→ https://twitter.com/ratio32
→ ブログRSSフィードを出力する方法
今回は、テーマに組み込まれている Font Awesome を利用してRSSボタンを設置したいと思います。
Font Awesome にあるアイコンは、ウェブフォントと同じ様に利用できる様にした物ですので、CSSで色・サイズなど文字同様に指定ができます。
Font Awesome にあるアイコンの活用方法
追加後

デザイン部分を白に、背景色をそれぞれ指定してあげることで、各イメージロゴが浮き上がってきます。
※イメージ図

右の図の様に背景が同色(白)だと見えません^^;
他のアイコンも同様に背景色が指定されていて、ご覧のように表示されています。
実践編
ますはアイコンをセットします。ウィジェット番号8に移動します。
追加前にソースのバックアップを取っておくことをおすすめします。

赤枠部分を追加しました。青枠はTwitter
実際のコード
<li><a target="_blank" href="/news/index.rss" class="btn btn-round btn-rss">
<i class="fa fa-rss"></i><span class="sr-only">RSS</span>
</a></li>
この時点では、背景色が無い状態ですので白いボタンだけが表示される状態になります。
背景色を設定する
→ custom.css に移動して下記を追加します。
a.btn-rss,
a.btn-rss:active,
a.btn-rss:focus,
a.btn-rss:hover,
a.btn-rss:visited{color:#FFF;}
.btn-rss,
.btn-rss:active,
.btn-rss:focus,
.btn-rss:hover,
.btn-rss:visited{background:#f6ad49!important}
.btn-rss .fa{top:5px;left:1px;font-size:24px;}
5行目でアイコン(フォント)の色を、10行目で背景色を指定しています。この#から始まる色番号を変えると変更できます。→ WEB色見本 原色大辞典
既出の物は、テーマ製作者さまが style.min.css に記載して下さってますが、他のものはこの様に追記が必要になります。
→ アイコン一覧表
→ 詳しい使い方はこちらがおすすめ
新しくアイコンが追加された時は・・・
新しい Font Awesome をダウンロードし、テーマ内のCSS一覧→ font-awesome.min.css を上書きしてあげれば使えるようになります。
脱線しましたが、RSSフィードURLをリンク先にしておけばOKです。
RSSボタンを設置する方法は以上になります。
Firefox から RSSボタンをクリックしてみると・・・

safari からアクセスしてみると・・・

最後に・・・
RSSボタンがあれば、購読してもらえる可能生が上がると思います。再訪問者が増えればファンになってくれることもあります。商品の販売やサービスの提供もよりスムーズになるかもしれません。しかし、最も大切なのは、定期的な更新と良質なコンテンツの提供だと思いますので、私自身も努力してまいります。
お役に立てましたら、いいね!&シェアして頂けると幸いです。
ご覧頂きありがとうございます。
P.S.
Twitter はじめました。
→ https://twitter.com/ratio32