こんにちは。Milkです。
ブログに設置されることが多い「Feedly」の登録ボタン。
皆さんのFeedlyボタンは正しく機能していますか？
「Feedly」とは、ブログ等の「RSS」機能を取得して、複数のブログを一括管理するWebサービスです。
「RSS」？
簡単に説明すると、多くのブログサービスは簡単なHTMLタグで表された記事の配信を同時に行っています。
ブラウザで直接に表示させると、リッチな画面表示がされますが、更新通知や一覧を見たい時にはそこまでの画面描画は必要ありません。
よって、より簡素な状態で配信を行い、更新通知を受け取れるようにしようという仕組みです。
個々のブログのRSSを一括で管理するには、「Outlook」などにも実装されていますが、利用率が高い管理サービスに「Feedly」があります。
では、Feedlyに自分のブログを登録してもらうために、ボタンを設置してみましょう。
Feedlyボタン
Feedlyボタンを設置することは、それほど難しいことではありません。
Feedly自体が、ボタンを簡単に設置出来るようにサービスを提供しています。
Feedlyボタンを設置する
こちらのページにアクセスします。
すると、2ステップでボタンの作成と、それを表示させるコードが生成されます。
後は、そのコードを貼り付けるだけです。
- 好きなボタンのデザインを選びましょう。
- RSSが配信されているURLを設定しましょう。
（はてなブログの場合は、自身の「URL/feed」になります。） - 生成されたコードを、自分のブログに設置しましょう。
【設置例】
HTMLとして貼り付けます。
動作の確認
さて、Feedlyで実際に登録が可能か？というのを確認しておきましょう。
Feedlyのアカウントを作成する手順は、ちょいと省略しますね。
設定したボタンを押してみましょう。
すると・・・あれ？
「ブログが見つからない」と表示されてしまいます。
どうして？！
Feedlyボタンのコードバグを修正する
実は、この自動生成コードにはバグが潜んでいます。
どの部分がバグなのかを確かめて見ましょう。
自動生成コードのバグ修正
では、自分でブログのRSSを検索した場合はどのようになるのでしょうか？
おっと・・・意外とあっさり見つかりますね。
一体何が違うのでしょう？
一旦、自分自身でブログを「Forrow」してみて下さい。
実は、大事な部分は「URL」部分になります。
ブラウザに表示されているURLと、ボタンに設定されているURLを比較してみましょう。
<! -- Feedlyで探した場合のURL --> https://feedly.com/i/subscription/feed%2Fhttp%3A%2F%2Fwww.milkmemo.com%2Ffeed <!-- ボタンに設定されているURL --> http://cloud.feedly.com/#subscription%2Ffeed%2Fhttp%3A%2F%2Fwww.milkmemo.com%2Ffeed
注目してほしいのは、「subscription」の後になります。
/feed%2Fと%2Ffeed%2Fになっていますね。
どうやら、subscription/feed%2Fと扱う方が正しく動くようです。
ボタンのコードの部分を%2Ffeed%2Fから/feed%2Fに修正してみて下さい。
そうすれば「登録しますか？」と尋ねるようなページに遷移するようになるでしょう。
これは、自動生成時に/をFeedlyでは%2Fという文字コードに変換しているようです。
（HTMLの文字コードとは違うので少し謎・・・）
それに引きずられて、必要ない部分も自動変換してしまい、これを受け取ったFeedlyは正しくRSSを認識出来ないというバグのようです。
最後に
実際に既に導入している方もいるでしょう。
自分の「Feedly登録」のコードが正しく機能しているか確認してみませんか？
実は、私は正しく動いていると思って1年以上ほっといてました・・・（汗）
新しいブログを立ち上げた時に、正常動作していないことに気づき、どこが問題なのかをサーチ。
いやぁ・・・疲れました。
まさか、自動生成コードにバグが潜んでいるとは・・・
これから設置する方も、既に設置している方も、要注意です！
それでは、今回はこの辺で。
adios！！
