WordPressのHTTPSサイト（常時SSL）にFeedlyのフォローボタンを設置する際、迷った点を説明するよ

さて、今回もコンテンツSEOネタを投稿予定だったんですが、Feedlyボタン設置で少し躓き（つまづき）まして、きっと他にも同じ所でハマる方いるだろうなと思ったのでポスト。

この記事は、次の方に役立ちます。

• WordPressを導入しているサイト
• HTTPSサイト（このブログも常時SSLです。）

にFeedlyボタンを付けたい！方々のために。

この手順を行ってみた

Feedly公式内のボタン作成ページへ行く
http://www.feedly.com/factory.html

各項目を選択、入力する。
※竍垂ﾍクリックで大きい画像

画像の例では、左上の大きなボタンを選択し、
Step 2: Insert your feed URL　では、『https://j-sem.net/feed/』と入力した。
※WordPressサイトのfeedはURLの後ろに/feed/です。『/』で閉じます。

そして、３で生成されたURLを適当に本文なり、サイドバーなりに貼り付けてみたところ。。。

陥った問題点１：真っ白なんですけどー

まっしろ。

この写真のように真っ白。
こうじゃない感。

もっと、記事の一覧がババっと出てきて、もっとスムーズに『+ボタン』を押して貰うつもりなのに。

しかもこれ！

黄色の三角マークが出て、『ただし、このページには安全でない他のリソースが含まれています。』とのエラー。

参った！しかもお腹へってるから早くランチ行きたいのにみたいなタイミングでこれ！

速攻で直しましょう。

上手く動いていないソースコードが手元にありますか？
私の場合、このようなソース。

<a href='http://cloud.feedly.com/#subscription%2Ffeed%2Fhttp%3A%2F%2F
https%3A%2F%2Fj-sem.net%2Ffeed%2F'  target='blank'>
<img id='feedlyFollow' src='http://s3.feedly.com/img/follows/
feedly-follow-rectangle-volume-big_2x.png' alt='follow us in feedly'
 width='130' height='56'></a>

これを直します。

直したのものがこちら。

<a href='http://cloud.feedly.com/#subscription%2Ffeed%2F
https%3A%2F%2Fj-sem.net%2Ffeed%2F'  target='blank'>
<img id='feedlyFollow' src='//s3.feedly.com/img/follows/
feedly-follow-rectangle-volume-big_2x.png' alt='follow us in feedly'
 width='130' height='56'></a>

このふたつを取り除いてます。
http%3A%2F%2F
http:

１つ目の『http%3A%2F%2F』はリンク先のcloud.feedly.com/#subscription%2Ffeed%2Fhttp%3A%2F%2Fhttps%3A%2F%2Fj-sem.net%2Ffeed%2F
ここです。

２つ目の『http:』は、画像ボタンを呼び出す
src=’http://s3.feedly.com/img/follows/feedly-follow-rectangle-volume-big_2x.png’
ここです。

実際に付けてみた

どうでしょうか？
クリック先で一覧表示されているでしょうか？

うまく表示されました！

追記：このブログはドメイン移転及びhttpsからhttpへ戻す作業をしました。

上記ボタンでは、このブログはhttpのため、rss登録が正常に表示されません。登録は右サイドのボタンからどうぞ

このブログはWordPressの使い方や設定方法の説明によりも、どういった内部SEOを行うべきか、どういったコンテンツ設計をするとアクセスが増えるのかといった技術的な内容中心のブログです。
もし人気のブログにしようと一生懸命頑張るブロガーさんやサイトオーナーさんであれば参考になる情報も発信しています。RSS登録も合わせてどうぞ。