ブログのSSL化に挑戦!・・・httpからhttpsへ・・・なるほどね~

最近、当ブログをSSL化(https化)してみました。内部環境、外部環境いろいろと考慮しないといけない点があり、とても勉強になりました。

恐らく私一人の力で全てをやると言うのはちょっと大変だったと思いますが、ネットの情報の力を借りると結構簡単?・・・でもないですが・・・とりあえず移行できました。

SSL化するブログの環境

SSL化した当ブログの環境を先ずは書いておきます。当ブログをSSL化するという事で、同等条件でブログをSSL化されている方の情報を集めて実践する事になります。

レンタルサーバ:エックスサーバー
プラットフォーム:WordPress
テンプレート:Simplicity2

となります。恐らく独自ドメインでブログを運営されている方で、これと同じ環境という方は多いのではないかと思います。

同じ環境が多いという事は、困った時にもお互い助けになる・・・私は助けるより助けてもらう方みたいですが・・・事も多々あると言うメリットがあります。

では実際にSSL化した時の事をご紹介いたします。

SSL(https)化するにあたりお世話になったサイト様

先に言っておきますが、当記事ではSSL化の手順は書きません。なぜなら・・・私よりも優れた技術と才能、それを誰でも分かるように文章化してネット上で公開されている方がいらっしゃいます。

そういう優れた方の記事と同等の記事を私には書くことが出来ませんので、当記事では私なりに苦労したと言いますか、この辺も気を付けた方がいいかもなと思ったところを書きたいと思います。

まずは、力をお借りいたしましたサイト様をご紹介させていただきます。

寝ログ 様
WordPressをhttpからhttpsにSSL化した全手順まとめ(エックスサーバー環境)

Naifix 様
エックスサーバー独自SSLが無料!WordPressサイトをHTTPS化する方法

上記2サイト様に大変お世話になりました。ありがとうございました。

SSL化の手順は上記サイト様の手順通りで問題ないと思います。問題はSSL化した後の最終チェック・・・特に混在コンテンツ(Mixed Content)のチェックに時間が掛かります。

サイトのSSL化の手順

SSL化後の最終チェック

当ブログは1300件ほどの記事があります。ぶっちゃけ、全記事を確認する事は不可能です・・・頑張ればできるんでしょうが・・・。

ですので、トップページ、固定ページ数件、記事ページ数十件、その他をとりあえずは確認してOKとしました。

正直、SSL化して即効でブラウザにも鍵マークが出て「結構簡単じゃんっ!」って感じになるんじゃないかなと思っていましたが、実際やってみると「えっ!何でまだ混在しているの?」って少し悩みました。

その最終チェックで私が悩んだ・・・と言いますか、見つけたり気付くのに時間が掛かった部分を当記事ではご紹介しておきます。

上記2サイト様の手順でSSL化してどうしても混在が解決できない場合に少しでも参考になればいいなと思っています。

SSL化時のコンテンツ混在チェックポイント

基本的に混在箇所の確認はGoogle Chromeのデベロッパーツールで行っています。そのコンソール上のエラーの中で個人的に忘れがちだなと思うものを挙げておきます。

背景などの画像とファビコン

WordPressの「外観」→「カスタマイズ」のヘッダー画像やロゴ画像は、SSL化後に読み込み直さないといけないのは分かっていましたが、「その他」のファビコンはすっかり忘れていました・・・。

ファビコンを有効にしていなければ関係ないですが、有効にしている場合はヘッダーやロゴ画像と同じように読み込み直す必要があります。

テーマの編集とウィジェット

テーマの編集はfunctions.phpやcssなど皆さん注意して見られると思いますので、問題ないと思います。ウィジェットも同じでしょうが、実は忘れがちだったのがアフィリエイトのリンク画像やブログランキングサイトのランキングバナー画像などはそれぞれのサイトから読み込んでいる場合は、外部サイトがSSL化してなければ、当然httpsで読み込むとエラーとなります。

いわゆる外部環境要因になりますので、自サイトで対応できない部分です。対象画像を保存してWordpressにアップした画像にリンクを貼るか、その画像の表示をやめるかになります。外部サイトがhttps対応になれば問題ないですが、それは先方の都合ですので・・・という感じです。

外部サイトからの画像の拝借は正直ないと思っていましたが、意外と見落としていたりしました。

同時にアフィリエイトサイトの広告リンクがかなり古い場合は、同じくhttpになっている場合もあるようです。最近のものは大丈夫ですが・・・。

ブログランキングサイトなどのhttpとhttpsの影響

SSL化前と後ではサイトのURLも変わります。「http」から「https」になりますので、ランキングサイトや同類サービスを提供しているサイトによってはいろいろ再設定が必要になります。

ちなみに私も参加している「にほんブログ村」の場合は、ランキング用バナーはhttps対応後のものであれば問題は無いようです。但し、ランキング用バナーのオプションの設定次第では変更も必要となります。また、PVランキング用ブログパーツについては、そのタグ内に自サイトのURLがありますので、再取得して貼り替えるか、自分でコードをちょいっと変更する必要があります。詳しくは下記を。

参照:はてなブログ、はてなダイアリーさま、WordPressで INポイントが発生しない場合の対応方法

※当ブログのSSL化とは別に「にほんブログ村」も2017/08/21に常時SSL化するという事ですので、その影響でバナーやブログパーツの貼り替えが必要になる場合もあります。

その他の同等サービスにおいても同様の問題が発生する可能性がありますので、各サイトで確認されると良いと思います。

以上です。

・・・全然大変そうじゃないじゃんって感じですが・・・そうです。そんなに大変ではありません。やはり上述の2サイト様の解説がとても丁寧で分かりやすかったので、私が言えることはこれ位です。

ちょいちょいメンテしつつ・・・

と言う訳で、当ブログのSSL化は一応完了!としました。全記事を確認していませんので、時間を見つけてちょいちょいメンテしていこうと思います。

ちなみに掛った時間は、全体で2時間弱です。

サーバのSSL設定→SSLでアクセスできるようになるのに20~30分程度。
http→https置き換えやその他コードの修正に20分程度。
サイトの確認と混在箇所のチェックと修正に30分程度。
各種登録サイトの登録内容の変更や修正、再連携などに20~30分程度。

といった感じです。

記事数が少なく、カスタマイズも少ない場合は、1時間ちょっとあればできそうな感じですので、休日の暇な時間にサクッとSSL化してみるのもありかもしれません。とは言え上手くいく保証はありませんので、一応バックアップをとってから作業をした方が良いと思います。

※https化後の様子を見ながら、何かあれば随時、当記事を更新していきます。