2013年8月20日
WordPress・ブログ更新

Feedly button with subscribers number title
Feedly Logo / AJC1

RSSリーダーの最大手だったGoogle Readerがサービスを終了し、その代替として一番人気となっているFeedly

他にもRSSリーダーのサービスはありますが、ほぼGoogle Readerの需要を置き換えたといってもいいくらいではないでしょうか。


それに合わせ本ブログでもFeedlyの購読ボタンを設置していたのですが、このたびそのボタンを購読者数つきに変更しました。

たまに自分のブログの購読者数をブックマークレット等でチェックしたりしていたのですが、その手間を省くのとより購読を促せる効果があるかもと考えてのことです。

今回は、その購読者数つきFeedlyボタン設置の際に参考にしたサイトとその実装方法をご紹介。

Feedlyってなに?

welcome to feedly

Feedlyは、前述の通りGoogle Readerと同様のRSSリーダーサービスの1つ。

Google Reader終了時に1ボタンで移行できる機能をつけたことや、Google Readerとかなり近い外観と使い勝手、Reeder等各種RSSリーダーアプリが続々とFeedlyに対応してきたこともあり、現在では多くのRSS購読者が利用するサービスとなっています。

購読者数つきのFeedlyボタンってどんなの?

Feedlyのサイトで公開されている購読ボタンに、購読者数の吹き出しをつけたもの。
見た目はツイートボタンやいいねボタンと似たような感じになります。

Feedly button with subscribers number 1

購読者数をつけることで、記事を読んでくれた方がよりボタンを押しやすくなったり、自分自身も購読者数をすぐに確認できる効果もあります。

参考にしたサイトと実装方法

では、実際の実装方法です。

と言っても私は技術的に詳しい方ではなく、いろいろ調べて以下の2記事を参考にさせていただきました。
(というか以下の記事の組み合わせです)

これらの記事がなければやってみようとすら思わなかったことでしょう・・・。
有益な情報に感謝。

なお、WordPressなどPHPの実行環境がないと動作しませんので、あしからず。


まず、Feedly購読者数付きボタンを表示させたい位置にPHPとHTMLを記述します。

PHP部分は以下。これは前者の方の記事そのままです。

さらに続けて、以下のHTMLを記述。こちらは後者の記事のHTMLに、前者の記事の購読者数表示を組み合わせたもの。
フィードのURLは自分のブログのものと置き換えてくださいね。

ここまででボタン及び購読者数は表示されるはず。あとは、CSSで見た目を整えます。

以下は後者の記事で公開されているCSSを当ブログ用にちょっとだけ変えたものになっているので、適宜イイ感じになるように調整してください。

初心者の方でも、Chromeの「デベロッパーツール」なんかを使うと割とできますよ。

私のブログは現時点(2013/8/18)で3,161人もの方が購読してくれているらしい。ありがたいことです。

あとがき

記事の下のほうに今回紹介した購読ボタンを設置しておりますので(PC版の場合。モバイル版は吹き出しなしの購読者数表示のみ)、このブログちょっと読んでみてもいいなーと思ってくれた方はぜひポチッとお願いいたします!

⇒もっと 「WordPress・ブログ更新」に関する記事をチェックする!

フォローして更新情報をチェック