ブログのカスタム

feedlyフォローボタンのわかりやすいブログへの導入方法【図解あり!】

スポンサーリンク


f:id:soul-vibration:20170707235703j:plain

ブログを巡回していて上記のようなアイコンやボタンを見たことは無いでしょうか?

これは何のサービスだろ?FacebookやTwitterのようなSNSなのかなーと思っていたのですが、調べてみたらRSSリーダーの一つで「feedly」というサービスでした。

feedlyでどんなことが出来るのかについてはこちらに丁重に書かれていました。

ユレオはRSSを今まで利用したことがなかったため、これを機に利用してみて当ブログでもfeedlyフォローボタンを導入することに致しました。

f:id:soul-vibration:20170708002214j:plain

RSS(Rich Site Summary リッチ・サイト・サマリー)は直接サイトを行かなくても、

ブログなどが更新されたかどうかを知ることができます。

多くのニュースサイト等で導入されており、一部のブログでも目にすることがあります。

RSSの情報をまとめて表示するツールのことをRSSリーダーといい、RSSリーダーを使用することで気になるニュースやブログの新着情報を効率よくチェックすることができます。

「feedly」はRSSリーダーとして人気が高く、利用者が多いとのことです。

”ブログを定期購読で読んでいただけるようにfeedlyフォローボタンを導入したい!!”

今回はそんな便利なfeedlyのfeedlyフォローボタンの導入方法ご紹介したいと思います。

 設定手順1 feedlyの登録を行う

1:以下のリンクをクリックして「feedly」のページへ移動します。

2:画面中央にあるFOLLOWボタンを押します

f:id:soul-vibration:20170708003501j:plain

3:Google、Facebook、Microsoft等のアカウントで新規登録してください。

アカウントが無い場合は先にいずれかの登録を行ってからの設定をお勧めします。

f:id:soul-vibration:20170708003901j:plain

4:画面左下の ADD CONTENT をクリックします。

f:id:soul-vibration:20170708004724j:plain

5:画面左下の Sources をクリックします。

f:id:soul-vibration:20170708010314j:plain

6:画面中央の What source do you want to follow? にブログのURLを入力します。ブログのタイトル名などでも検索可能です。

f:id:soul-vibration:20170708005854j:plain

7:フォロアーさせたいリンクが出ますので「FOLLOW」を選択します。

f:id:soul-vibration:20170708011829j:plain

8:CREATE A COLLECTION をクリックします。

f:id:soul-vibration:20170708012135j:plain

9:Collection name を入力します。入力後 CREATE を押します。

(例:ブログ、ニュース)

f:id:soul-vibration:20170708012347j:plain

10:画面左にFEEDSに Collection name?が表示され、FOLLOWING に替わります。

f:id:soul-vibration:20170708012948j:plain

11:Collection nameを選択すると目的のURLの情報が画面右側に表示されます。

記事を読むには画面右側の記事を選択してください。これでfeedlyの登録は終了です。

f:id:soul-vibration:20170708013320j:plain

スポンサーリンク

設定手順2 feedlyフォロアーボタンのコードを作成する

1:以下のリンクをクリックしてfeedlyフォロアーボタンを作成ページへ移動します。

2:フォロアーボタンのデザインを選択します。

他のボタンにデザインを合わせるのであれば下の左から3番目をお勧めします。

f:id:soul-vibration:20170708014914j:plain

2:feed URLを調べます。

feed URL を簡単に調べるには以下のURLを開いてください。

RSSフィード取得・検出ツール – RSSリスティング

3:ブログのURLを入力します。入力後自動検出スタートを押します。

f:id:soul-vibration:20170708020030j:plain

自動検出後に表示されたURLを選択してコピーします。

4:feedlyフォロアーボタンを作成ページ戻り、「3」で自動検出されたfeed URLを以下にペーストします。

f:id:soul-vibration:20170708020655j:plain

5:生成されたコードを全てコピーします。

f:id:soul-vibration:20170708021258j:plain

以上でfeedlyフォロアーボタンのコードを作成は終了です。

設定手順3 feedlyフォローボタンをブログに張り付ける

1:feedlyフォローボタンを張り付けたいページを編集で開き、HTML編集を選択します。

2:先ほど生成されたfeedlyフォロアーボタンのコードを張り付けます。

f:id:soul-vibration:20170708021959j:plain

3:プレビュー表示に切り替えるとfeedlyフォローボタン表示されます。

f:id:soul-vibration:20170708022230j:plain

設定方法は以上となります。

feedlyフォロアーボタンは好きなところに張り付ける事ができます。

私はサイドバー等に張って使用しております。

feedlyフォロアーボタンが付いているとブログがレベルアップして少しかっこ良くなった気がします。

スポンサーリンク


おすすめのアフィリエイトASPランキング

「ASP(アフィリエイト・サービス・プロバイダ)」とは、アフィリエイトの広告主とトやブログ運営者を繋ぐ仲介業者のことで、ブログ運営で広告などを掲載するにはASPに登録する必要があります。

そうしたASPは数多くありますが、初心者向けのおすすめのASPをご紹介いたします。

1位 A8.net
A8.netは広告主数が豊富で、ブログ運営者の多くが利用するアフィリエイトサービスです。
ブログを始めたばかりの方もwebサイトやブログを登録できますし、手続きも簡単でアフィリエイトを手軽に始めることができます。
また、A8.netでは「セルフバック」が充実しており、自分で商品の購入やサービス申込むことでアフィリエイトの報酬が得られ、実際の商品をお得に購入できるのでレビュー記事が書きやすいというメリットもあります。
総合
商品種類
初心者向け

A8.netの詳細ページはこちら

2位 もしもアフィリエイト
もしもアフィリエイトはブログ運営の初心者でも成果を上げられるように成果を上げる為の方法について詳しく書かれたマニュアルがあるなど、「ブログ運営初心者に対して嬉しいサービス」が充実しています。
また、Amazonアソシエイトと楽天アフィリエイトをまとめれるのは、管理がしやすい点が初心者にとってポイントが高く、W報酬制度やプレミアム報酬などの独自の報酬制度があります。
総合
商品種類
初心者向け

もしもアフィリエイトの詳細ページはこちら

3位 バリューコマース
バリューコマースはYahooショッピングでの報酬の取りまとめに力をいれていたり、スマートフォン向けのオーバーレイ広告が掲載できるなど、ポイントの高いサービスが提供されています。
また、メルカリなどのバリューコマースにしかない広告案件があり、メインのASPがすでにあったとしても広告案件の隙間を埋めたり、比較として登録しておいて損はありません。
総合
商品種類
初心者向け

バリューコマースの詳細ページはこちら