「いつかやらなきゃ」と思いつつ、つい「面倒臭そう」と思って先延ばしにすることってありませんか?

私にとっての”それ”とは、このBlogを「常時SSL化」すること。

理由は2014年8月にGoogleが「httpsをランキングシグナルに使用します」と、発表したことにあります。

「SSL」というのはネット上の情報を暗号化して送受信ができるようにする仕組みです。「別に個人情報を扱うわけでもないし…」と、しばらく様子見をしていました。

ところがネット界隈では「常時SSL化」への流れが活発となり、それを受けてようやく私も一大決心。重い腰を上げて「常時SSL化」に踏み切りました。

結果から言えば、悪戦苦闘しつつも562記事全てを「https」に変えることに成功しました。

いやいやそれにしても、メッチャ大変でした。

今回は私がつまづいた箇所を中心にお話しを進めていきます。なお今回取得したSSL証明書はCoreSSL。利用しているサーバーは格安で使えるミニバードです。詳細＆お申込みは、以下のバナーをクリック！

難しいことはないけど、とても面倒でした!

やってみれば特に難しいことはありません。ミニバードのマニュアルに沿ってやっていけば、半日程度で独自SSLの導入が可能です。

ざっくり言えばやることは以下の3つ。

1.WordPress側の設定

「管理画面」に入り「設定」→「一般」へと進み、WordPress アドレス (URL)とサイトアドレス(URL)を、それまでの「http://ドメイン名」から「https://ドメイン名」に変更。次に設置しているSNSのボタン、記事や画像のURL、内部リンクなど、とにかく全てを「http」から「https」に変更します。

もちろんテーマファイルやウィジェットエリアの見直しなども必要です。

膨大な数になるので考えただけでもめげそうになりますが、こんな時に便利なのがWordPressプラグイン・「Search Regex」。ダウンロードして有効化するだけですぐに使えるので事前に準備しておくといいですね。

ここまでやれば個別ページはともかく、最低でもトップページには緑の鍵マークがついているはずです。

2.301リダイレクト

ftpソフトを立ち上げて「.htaccess 」をダウンロードします。以下のように記述して、再びアップロード。

3.外部リンクの変更

Search Consoleの登録もしておきます。それまでの「http://」から始まるサイトとは別扱いになるので、新たにプロパティを追加します。

Googleアナリティクスも同様ですが、こちらは「プロパティ設定」→「デフォルトの URL」のセレクトボックスから「https」を選択するだけでokです。ここまで終わったらXMLサイトマップを送信します。

またブログのランキングサイトやアフェリエイト関連の修正も済ませておきましょう。このあたりはみな、サイトの移転を経験したことのある方ならすんなりできる作業です。

ただし、問題はその後。ここからが本題です。前置き長くてすみません(_ _).｡o○

個別ページに飛ぶと、以下のようなエラーが出まくり。頭を抱えました。

1.Google Chromeのデベロッパーツールでエラーを突き止める

エラーの原因はいったい何か？

Google Chromeにはその原因を突き止めるのに便利なデベロッパーツールというのがあります。画面を右クリックして「詳細」を選択するか、もしくは上の画像にある青い文字で書かれた「詳細」をクリックします。

「Console」を選択すると、なにやらずらずらと細かい文字列が表示されてきますが、黄色い部分がエラーです。

私の場合はいずれもミックスドコンテンツ(Mixed Content)、つまり「”https”で作られているはずのサイト上に、”http”の画像が紛れ込んでいる不完全なサイトですよ」というもの。

エラーが出ているページはアフィリエイトのコード、あるいはカエレバ・ヨメレバのコードが貼られているページばかりでした。

それ以外にも、以前貼っていたブログ村のバナーとかクックパッドの小さなアイコンとか、いずれも外部から読み込んだ画像もエラーの原因でした。

このようにいくつかのページを検証してみると、何がエラーなのかがはっきりと見えてきます。

2.アフィリエイトの広告コード全てを貼り直し

私が登録しているアフィリエイトはさほど多くなく、A8.net、バリューコマース、もしもアフィリエイトくらいです。それらも現在は全てSSLに対応しています。

数も多くないこともあり、リンク切れのチェックも兼ねて全てを見直すことに。残すものは新たに貼り直し、不要なものはエイッと削除。

もし数が多ければ、先ほどご紹介したプラグイン・Search Regexで該当箇所を検索・置換してもいいですね。

もし提携しているアフェリエイトがSSL未対応なら、そのページのSSL化を諦めるか、もしくは業者を見切るしかないようです。

けれど世の中の流れがSSLに傾いているので、気長に対応を待ってその時に直すという手段もあります。

3.カエレバ・ポチレバのSSLをどうするか?

便利なのでよく使用するカエレバとポチレバ。アマゾンの画像にはSSLの対応がされています。

「画像ssl化(Amazonのみ)」を「ON」にすればいいとのこと。それでもエラーが出てしまいます。これには困りました。

アマゾンの商品に関して言えば、「Amazon JS」というプラグインもあるのでそれを使ってもいいのですが、やはりカエレバ・ヨメレバのブックマークレットは非常に使いやすい…。ということで、対応策を探してみました。

するとFirefoxのアドオン・「FoxReplace」が非常に使えるということで、早速試してみました。

・Amazonアソシエイト
「http://ecx.images-amazon.com」を「https://images-fe.ssl-images-amazon.com」に変更。
・バリューコマース
「http://ck.jp.ap.valuecommerce.com」を「//ck.jp.ap.valuecommerce.com」に変更。
「http://ad.jp.ap.valuecommerce.com」を「//ad.jp.ap.valuecommerce.com」に変更。
・もしも
「http://c.af.moshimo.com」を「//af.moshimo.com」に変更。
「http://i.af.moshimo.com」を「//i.moshimo.com」に変更。

情報源: Firefoxアドオンの「FoxReplace」でカエレバ・ヨメレバのアフィリエイトリンクを一括(Multi Replace)でSSLに置換する

しかしこれだけではアマゾンはよくても、楽天の画像を読み込む時にエラーになります。日本のショッピングサイトといえば、ほとんどが楽天かアマゾンかなので、これは痛い。

そこで私はこの5行の文字列の他に、楽天の商品にも対応できる以下の1文を追加。

「http://thumbnail.image.rakuten.co.jp/」を「//thumbnail.image.rakuten.co.jp/」に変更。

すると今までエラーになっていたページに次々と緑の鍵マークがつくではないですか!

ずっとここでつまづいていただけに、もうホント、嬉しかったなぁ…。

これでカエレバ・ヨメレバは無事に解決しました。

しかしポチレバはエラーになります。

そこでサムネイル画像を一旦自分のサイトにダウンロードして、そこの部分だけを書き換えることにしました。画像を外部からの読み込みにするのではなく、自分のサイトから見せるという苦肉の索。邪道かもしれませんが、今のところこれしか思いつきません。

4.Pz-LinkCardがエラーになった!さてどうする?

リンク先をはてなカードのように表示できるWordPress・プラグイン「Pz-LinkCard」。

これもエラーになりました。やはり外部からの画像の読み込みが原因。そこでサムネイル画像の読み込みを諦めました。

「管理画面」→「Pzカード設定」と進み「外部リンク」の項目にある「サムネイル」と「サイトアイコン」ともに「なし」にして「変更を保存」。これでokです。

5.なんといっても最後は目視チェック!

先にご紹介した「Search Regex」を使用しても、内部URLのいくつかが「http」のままでした。

となると残る手段は目視チェックしかありません。一つ一つに目を通し、全て直していきました。

大変といえば大変でした。でもこれをしておけば「全ページ、SSL化に成功しました」と言いきれるし、なによりも自分の安心材料になります。

最後に

以上が今回やったことの全てです。

途中でめげそうになりましたが、これ以上記事が増えてから直すのはもっと大変!

そう思うと、やってよかったと思っています。

それになにより久しぶりにこんな風に手をかけたことにより、このブログが今まで以上により愛おしく感じるようになりました。

ではまた。