超速!最短30分で簡単にワードプレスブログをSSL化する7つのステップ

超速!簡単にワードプレスブログをSSL化する7つのステップ

自分のワードプレスブログを常時SSL化してみたい方、必見!

ちゃおしこ!
ブログ大好きカルロ・クマです。

今日は、最短30分で簡単にワードプレスブログをSSL化する7つのステップをご紹介します(とかいう自分の備忘録(笑))

実際に私が常時SSL化した際の手順の要点だけ、立て板に水のごとく(!?)解説していきます。所要時間は30分。熟練の方は、もっと早く片付くはずです。

当ブログも常時SSLに対応

このブログも遅ればせながら、常時SSL化(2017年4月~)に対応しました。ブラウザのURL欄に、緑の鍵マークや「保護された通信」といった表示がなされているはずです。

ブログの常時SSL化は、もはや珍しいことではなくなってきました。もちろん、その旗振り役としてはgoogleの存在があり、常時SSLに対応しているサイトの評価を優遇するといった理由もあって、SSL化が促進されているという側面もあると思います(というか、それがメイン)

また、そういった時代の波を反映して、無料または安価でSSLの設定のできるレンタルサーバが少しずつ増えてきていますね。

常時SSLってそもそも何?

以前から、申し込みフォームなどユーザーが何かを入力するページでは、SSLによる暗号化が利用されていました。

「常時」SSLとは、その暗号化をブログ(サイト)全体に渡って行うということです。すなわち、ブログの全てのページを暗号化することを、常時SSL化と呼びます。

これにより、ユーザーとブログ(サーバ)とのやり取りの全てが暗号化されるため、第三者に通信内容を傍受されるリスクが減るといったメリットがあります。

何で常時SSL化したのか

私が実際に常時SSL化に踏み切ったのは次の理由からです。

SEO的に有利

SSL化することをgoogleは歓迎しており、効果は限定的ではありますが多少のSEO効果があると言われてます(本当に微々たるもの。やらないよりはやったほうがいいぐらいのレベル)

SSLが無料で利用できた

現在、「じゆしこ」で利用しているレンタルサーバでは、SSLが無料で理由できるため、費用的な負担が無かったのも理由としてあげたいところ。無料ならやりますよね(笑)

まだ弱小ブログだから

軌道に乗った人気サイトであれば、なかなかこうした大きな作業は心理的な抵抗が大きいはずです。余計な事をして、アクセスが止まったら死活問題ですからね。

その点、「じゆしこ」は、まだまだこれからのブログですから、SSL化に仮に失敗しても、そんなに痛手を追わないですみます。というよりも、今のうちにやっておいた方がいいと思いました。

新しいことはいいこと

なんでも新しいものを取り入れたい性格なので、じゃあやりましょう! ってことですね。

訪問者のためになる

私のブログを見るのにリスクなんてほとんど何もないとは思いますが、暗号化されていることが訪問者にとって、少しでも安心材料になるならいいなと思います。

客観的に見れば、常時SSL化している=ちゃんとしているという風ににも見えますし……ニヤリ。

実際にブログを常時SSL化した手順

ここからは私が実際に、当ブログで行った、常時SSL化の手順について解説していきたいと思います。

常時SSL化の流れ(概要)

1.レンタルサーバ側で、該当ドメインにSSLの設定をする
2.ワードプレスのアドレス設定を変える
3.httpsとhttpのアクセスを統一する
4.コンテンツ内のURLを置換してhttpsに統一する

5.ブラウザでSSLが、ちゃんと実現できているか確認する
6.サーチコンソールの設定変更
7.アナリティクスの設定変更

1.レンタルサーバ側で、該当ドメインにSSLの設定をする

まずは、契約しているレンタルサーバのコントロールパネルからSSL化したいドメインに、SSLが適用されるように設定します(各レンタルサーバのヘルプを参照してください)

2.ワードプレスのアドレス設定を変える

上記の設定が終わったら、実際にSSLが適用されているかどうか、ブラウザでアクセスして確認します。「https」で、自分のブログが表示出来ていれば確認OKです。

続いてワードプレスの管理画面から「設定」⇒「一般設定」で、次の項目に記入されているアドレスを「http」から「https」に変更します。

・WordPress アドレス (URL)
・サイトアドレス (URL)

(例)じゆしこの場合 http://jiyushiko.com/ ⇒ https://jiyushiko.com/

3.httpsとhttpのアクセスを統一する

このままでは、「http」と「https」のURLが混在することになりますので、「https」だけに統一してアクセスされるように制御を変更する必要があります。

制御には、ルートに設置してある「.htaccess」に301リダイレクトを追記することで対応します。

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
</IfModule>

4.コンテンツ内のURLを置換してhttpsに統一する

ブログの既存の記事などに書かれた「http」で始まるURLを、全て「https」に書き換えます。

一つづつ手作業で変更するのは現実的ではありませんので、『Search Regex』というプラグインを使って一括で置換修正します。

追記:『Search Regex』で置換する方法では、不十分だということがわかりました。データベースを直接修正することをおすすめします。

やり方はこちらの記事に書きました。

『Search Regex』の使い方はこちら。

(例)じゆしこの場合
search regex 記入例

なお、この工程は、今回の作業の中で一番リスクの高い部分です。作業する前にSQLのバックアップを取ることをお勧めします。

5.ブラウザでSSLが、ちゃんと実現できているか確認する

ひととおり記事の中のURLは書き変わったハズですから、次に、自分のブログの色んなページをランダムに「https」でアクセスして正常にSSL化出来ているか確認しましょう。

正常にSSL化出来ていれば、ブラウザのURLの欄に、鍵アイコンが適切に表示されているはずです。

chomeの場合

うまくいっている場合は「保護された通信」と鍵アイコンが緑表示される
chrome SSL OK

うまくいっていない場合は、グレーのhttpsとなる。
Chrome SSL NG

Fire Foxの場合

うまくいっている場合は緑の鍵アイコンが表示される
Fire Fox OK

うまくいっていない場合は警告マークがつきます
Fire Fox SSL NG

Microsoft Edgeの場合

うまくいっている場合は、鍵アイコンが出ます
edge SSL OK

うまくいっていない場合は、何も出ません。
edge SSL NG

上記の状態にならない場合は

上記のように、正常にSSL化出来ているアイコンが出ない場合は、ページのソースコード内に「http」でリンクしている何らかのファイルが存在しています。それらのオブジェクトのURLが、全て「https」になるように調整していく必要があります。

チェック方法

SSLがうまくいっていないページを開いた状態で、ソースコードを表示します(ctrl+u)。

次に、ソースコード内を検索するために、検索窓を開いて(ctrl+f)、そこへ「http://(ブログのURL)」を記入します。すると、「http://」から始まる、リンクがどこかわかりますので、該当の場所が「https://」となるように、ワードプレスの管理画面などから調整します。

主に、SSLで引っかかるポイントは次のような場所だと思います。

・ウィジェット周り
・テーマ周り
・画像

複数のページをチェックして、漏れのないようにしましょう(後日、気づくケースもあります)

全てのページでSSLの鍵アイコンが表示されていることが確認出来たら。ブログでの作業は完了です。

6.サーチコンソールの設定変更

設定変更という見出しを付けましたが、実際は再登録になります。
Google Search Consoleを開き、画面右上の「プロパティ」を追加から、「https」で始まる、ブログのURLを登録します。

7.アナリティクスの設定変更

続いてアナリティクスの設定変更です。

(1)Google アナリティクスにアクセスしたら、該当のプロパティを選択し、(画面左下にある)歯車マークの管理ボタンを押します。

(2)続いて、「プロパティの設定」の中にある「デフォルトの URL」を「https」に変更します。

(3)さらにその下にスクロールしたところにある「Search Consoleの調整」を開き、先ほどサーチコンソールで設定した「プロパティ」を紐づけます。

(4)最後に保存を押して完了です。

お疲れ様でした

これで常時SSL化の作業はひとまず完了です。

私の環境では、上記の作業だけで完了しましたが、人によってはプラグインなど他にもいじらなければいけないところもあるかもしれません。

また、SSL化をしようと思う人のスキルを想定して、馬鹿丁寧な解説にしていないぶん、分かりにくい部分があったかもしれません。先に誤っておきます(って後か)ごめんなさい。

あなたもこの記事をきっかけに、ぜひ常時SSLに挑戦してくださいね。

やっちゃえば簡単です。

今日の記事、面白いなと思ったらツイッターのフォローお願いします。ブログの更新情報なども流しています。