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

2018年2月3日 2018年4月2日 0件のコメント サイト運営 , , ,

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

 

状況

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

follow us in 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件落着です。

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

follow us in feedly

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

<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" />

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください