A2-blog

feedlyのボタンがクリックしたらエラーを吐いた！

投稿日:2018/2/3 更新:2019/3/22 コメント 0件 サイト運営 feedly, RSS, フィード, ワードプレス

Feedlyボタンが正しく設置できていなかったようなので修正しました。

 

状況

Feedlyは使ってなかったのでボタンだけ公式サイトからコードを生成して各サイトに設置していたんですが何気にボタンをクリックしたら以下のようなエラーが表示されました。下記のボタンをクリックするとエラーが表示されます。

{"errorCode":404, 
"errorId":"ap1int-sv2.2018020209.2056582", 
"errorMessage":"invalid alias"}

ブラウザ(chromeを使用)による不具合かもと思ったのでFirefoxとEdgeで確認してみたんですが同じようなエラーメッセージが表示されました。図はFirefoxのエラー(errorId:”ap4int-sv2.2018020301.57333″)です。

 

 

公式サイトのやり方

公式サイトでのやり方を追ってみます。

Feedly button

 

Step1

ボタンを選択します。

Step2

feed URLを入力します。ワードプレスの場合はサイトアドレスに「/feed」を追加します。

Step3

feed URLを入力するとコードが生成されるのでこのコードをサイトに貼り付けます。当記事の執筆時に知ったんですが図にあるボタンをクリックすると動作確認できるのでここで確認しておくとエラーになってもすぐに確認できます。因みにコードが生成されたあとにボタンを変更したい場合はボタンをクリックしてFeed URLの入力フォームにカーソルを合わせてEnterキーをクリックすると更新されるみたいです。

 

 

コードを読み解く

公式サイトで生成したコード(hitfilmサイト用)をワードプレスのウィジェット(カスタムHTML)にペーストするとエラーだらけでした。

HTMLコードをよく見るといろいろとおかしなところがありますよね。

HTMLは独学なので詳しくは分かりませんが通常、ダブルクォーテーション(“)で囲まれている箇所がシングルクォーテーション(‘)で囲まれていたり、スラッシュ(/)の部分が「%2F」に置き換わってたりしています。因みに「%2F」は「/」をエスケープしたものらしいですがその辺のことは全く分かりません。尚、ウィジェット(カスタムHTML)でのエラーはシングルクォーテーションをダブルクォーテーションに変換したら消えました。

また、コード的には問題ないんですが当サイトでは常時SSLにしているのでSSL非対応の「http://～」から始まるURLが使われているところも気になるところです。

<a 
href='http://cloud.feedly.com/#subscription%2Ffeed%2Fhttp%3A%2F%2F
https%3A%2F%2Fedit-anything.com%2Fblog%2Ffeed%2F' target='blank'>
<img id='feedlyFollow' 
src='http://s3.feedly.com/img/follows/feedly-follow-rectangle-volume-small_2x.png' 
alt='follow us in feedly' width='66' height='20'>
</a>

 

 

コードを修正

ぶっちさんのところに埋め込まれたFeedlyボタンのアドレスを確認したら以下のようになっていました。

https://feedly.com/i/subscription/feed/https://bucci.bp7.org/feed

細かく調べていくのも面倒なので取り敢えず上記アドレスを参考に書き換えてみました。

https://feedly.com/i/subscription/feed/https://edit-anything.com/blog/feed

書き換えたコードを設置してボタンをクリックするとちゃんとFeedlyのページに飛んでいけたのでこれでいいみたいです。

フォロワーがいない場合は上記のように表示されるようですが、フォロワーがいる場合は下図のようにサイト名とフォロワー数が表示されるようです。取り敢えず1件落着です。

こちらのボタンは不具合を修正したものです。フォロー宜しくです。

参考までに上記ボタンのコードです。

<a href="//feedly.com/i/subscription/feed/
https://edit-anything.com/blog/feed" target="blank">
<img id="feedlyFollow" src="//s3.feedly.com/img/follows/feedly-follow-rectangle-flat-big_2x.png" 
alt="follow us in feedly" width="131" height="56" />