WordPress:サイトをSSL化する手順

WordPressサイトSSL化

WordPressで作成したサイトをSSL化する際に必要な手順です。
https化という人もいるかもしれませんが、
SSL化とします。

前提

以下、非SSLサイトのURL（SSL化対応前）を
http://www.xxxxx.yy
とします。

また、SSL化後のサイトURLを
https://www.xxxxx.yy
とします。

サイト構成はドキュメントルート下にWordPressがインストールされているものとします。
また、サイトはNginxを使用していないものとします。¹

その1:SSL化申請

どうにもこうにもSSL証明書の申請ができていないとSSL化できません。
申請は事前にしておきましょう。
申請の方法はサーバによって異なると思うので、
サーバのヘルプを読み、それでも書いてないようでしたら、
サーバのお問い合わせ窓口に問い合わせてみてください。

SSL化申請が通り、SSLが使用できるようになったら下記の手順で対応を行います。

その2:DB置換

DB内を一発置換します。
方法は2つあるので、2つとも紹介します。

DBを入れ替えする方法

静的なメンテナンス画面を用意する必要がありますが、
確実な方法です。
また、シングルサイト・マルチサイト共に同じ手順で行うことができます。

DBをエクスポートする。

使用しているDB（仮にコーポレートDBとします）をエクスポートします。
ファイルとしてエクスポートし、ローカルに保存しましょう。

エクスポートしたファイルをコピーする。

エクスポートしたものをバックアップとし、
SSL対応用にコピーした方を編集します。
（コピーしたファイルのほうをコーポレートDB-new.sqlとします）

SSL化対応のため置換をする。

http://www.xxxxx.yy→https://www.xxxxx.yy
こうなるようにコーポレートDB-new.sqlファイル内を置換をします。
置換が完了したら上書き保存してください。

静的メンテナンスページを用意する。

過去の修正や実装により既にメンテナンス画面を作成している場合は、
それを使用します。
ない場合は、短時間で作業が済むことからスタイルを当てていない画面でもいいので作成します。
合わせてドキュメントルートの.htaccessにも追記をします。

<IfModule mod_rewrite.c>と書かれている行と
</IfModule>と書かれている行の間に下記を記述します。
ただし、これは
# BEGIN WordPress
# END WordPress
これらより前の行に記述してください。

RewriteEngine On
RewriteCond %{REQUEST_URI} !(^/xxxx/)
RewriteCond %{REQUEST_URI} !=/mente/index.html
RewriteCond %{REMOTE_ADDR} !^(nnn\.nnn\.nnn\.nnn)$
RewriteRule ^.*$ - [R=503,L]

2行目の!(^/xxxx/)には除外するフォルダを指定します。
メンテナンス画面で/asset/ディレクトリ下のcssや画像、
あるいは/css/や/img/といったフォルダからファイルを読み込む場合には

RewriteCond %{REQUEST_URI} !(^/asset/)

または

RewriteCond %{REQUEST_URI} !(^/css/)
RewriteCond %{REQUEST_URI} !(^/img/)

となります。

3行目の!=/mente/index.htmlについては、
用意したメンテナンス画面の相対パスを指定します。
この例では、
「/mente/フォルダをドキュメントルート下に作成し、
その中にメンテナンス画面として表示するindex.htmlを設置している」という状態となっています。
ドキュメントルート直下にmente.htmlを置くのであれば
RewriteCond %{REQUEST_URI} !=/mente/index.html
となります。

4行目の!^(nnn\.nnn\.nnn\.nnn)$は自身の作業環境のグローバルIPを記載してください。
グローバルIPはあなたが現在インターネットに接続しているグローバルIPアドレス確認で確認できます。
これを記述することにより、自身はメンテナンス画面を閲覧せずにサイトの動作を確認することができます。
メンテナンス画面が表示されるかどうかはWi-Fiを解除したスマートフォンなんかで確認してください。

ドキュメントルートの.htaccessに常時SSLとする記述を追記する。

RewriteEngine On
RewriteCond %{HTTPS} off
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]

これを
<IfModule mod_rewrite.c>と書かれている行と
</IfModule>と書かれている行の間に追記します。
ただし、これは
# BEGIN WordPress
# END WordPress
これらより先の行、かつ先ほどのメンテナンス画面用設定の前に記述してください。

また、WordPress管理外の静的ページを設置しているサイトの場合、

RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]

こちらも追記しましょう。
こちらは
# BEGIN WordPress
# END WordPress
これらより後の行に記述します。

なお、WordPress管理外の静的ページを設置している場合には、
各ファイル内にもhttp://www.xxxxx.yyで記述されている箇所がないかGrep検索を行いましょう。
あった場合はhttps://www.xxxxx.yyになるようGrep置換します。

ここまでの.htaccessおさらい

説明が長くなったので、一度.htaccessの記述をまとめます。
WordPressのデフォルトをベースとするならば、

.htaccess

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{REQUEST_URI} !(^/asset/)
RewriteCond %{REQUEST_URI} !=/mente/index.html
RewriteCond %{REMOTE_ADDR} !^(nnn\.nnn\.nnn\.nnn)$
RewriteRule ^.*$ - [R=503,L]

RewriteEngine On
RewriteCond %{HTTPS} off
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]

# BEGIN WordPress
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
# END WordPress

RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]

このようになっているかと思います。
既にプラグインやサーバの設定によりデフォルトから記述が異なる場合も多いと思いますが、
そのときは、上から記述を追ってどの間に記載するか検討をしてください。
どうしてもわからないときはローカルで一度試してください。

ファイルのアップロード

まず.htaccessを除くメンテナンス画面用のファイルをアップロードします。
次に.htaccessをアップロードします。
この順番で行わないと存在しないメンテナンス画面を見に行かれる時間ができます。

ファイルのアップロードが完了したら、
Wi-Fi接続を解除したスマートフォンなんかでサイトにアクセスします。
メンテナンス画面が表示されればオッケーです。
されない場合は、設定が今回前提で紹介しているものと異なっている可能性があるので、
適宜修正を行ってください。

DB入れ替え

バックアップを取っていることを確認してから
コーポレートDBを空にします。

コーポレートDBが空になったらコーポレートDB-new.sqlを
コーポレートDBにインポートします。

表示確認

サイトにアクセスします。
htaccessで設定したIP以外で接続するとメンテナンス画面が表示されるので、
設定したIP（PC、またはそのIPにWi-Fi接続しているスマートフォン）で接続してください。

サイト内のページを色々周り、
どれもブラウザのアドレスバーがSSL化対応していることを示していることを確認したら完了です。

メンテナンス画面の解除

手順4で記述したメンテナンス画面へのリダイレクト設定を解除します。
該当記述を#でコメントアウトします。

RewriteEngine On
RewriteCond %{REQUEST_URI} !(^/asset/)
RewriteCond %{REQUEST_URI} !=/mente/index.html
RewriteCond %{REMOTE_ADDR} !^(nnn\.nnn\.nnn\.nnn)$
RewriteRule ^.*$ - [R=503,L]

コメントアウトしたらアップロードして上書きします。

メンテナンス画面を使用せずに置換を行う方法

現在サポートされていないプラグインを使用するため、非推奨です。
この手順で行う場合は自己責任でお願いします。

また、シングルサイト・マルチサイトで方法が一部異なります。
マルチサイトの場合は、DBを直接修正する必要があります。

DBをエクスポートする。

使用しているDB（仮にコーポレートDBとします）をエクスポートします。
ファイルとしてエクスポートし、ローカルに保存しましょう。
この方法ではこのファイルをバックアップとして扱います。

サイト設定を書き換える。

WordPress管理画面内の「設定」＞「一般」から
"WordPressアドレス"と"サイトアドレス"を書き換えます。

書き換える内容はhttp://www.xxxxx.yyの箇所をhttps://www.xxxxx.yyに書き換えるだけです。
もし、書き換えることができない場合は
ドキュメントルート直下などにあるwp-config.phpに直接記入しているものと思われるので、
そこを書き換えてください。

マルチサイトの場合はサイトネットワーク管理画面へ遷移し、
「サイト」から各サイトの編集画面を開き、そこで行います。
ただし、親サイトのアドレスだけは書き換えることができないので、DBを直接修正します。
親サイトのアドレスは
コーポレートDB内のwp_optionsテーブル（'wp_'はプレフィックス設定により異なる）に記載されています。
wp_2_optionsテーブル等あるとは思いますが、ナンバリングが入っていないテーブルです。

このテーブルのうち、
'option_name'が「siteurl」が"サイトアドレス"、"home"が"WordPressアドレス"となっています。
直接書き換えます。

これでサイト設定書き換えは完了です。

WordPress管理画面からプラグイン「Search Regex」をインストールする。

Search Regex
プラグイン新規インストール画面で「Search Regex」と入力しても出てきます。
（2019/01/28時点）

マルチサイトの場合は、サイトネットワーク管理画面内の「プラグイン」から新規インストールを行います。

インストールが完了したらこのプラグインを有効化します。

Search Regexを使用する。

管理画面内「ツール」に「Search Regex」というメニューが追加されているので、これを選びます。

"Source"欄で色々選択できますが、
解説サイトなどを参考に、自身のサイトに応じて選択してください。
複数条件で行う場合は、単一選択しかできないので、そのぶん下記を繰り返す形になります。

"Search pattern"欄にhttp://www.xxxxx.yyを入力します。
入力後、[Search >>]ボタンを押下します。
検索結果がなにも表示されない場合は特になにもしないで構いません。

検索結果が表示された場合は、
"Replace pattern欄"にhttps://www.xxxxx.yyを入力し、[Replace & Save >>]ボタンを押下します。

マルチサイトの場合は、全サイトに対してこの手順を行います。

Search Regexをアンインストールする。

無効化し、アンインストールしてください。

ドキュメントルートの.htaccessに常時SSLとする記述を追記する。

RewriteEngine On
RewriteCond %{HTTPS} off
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]

これを
<IfModule mod_rewrite.c>と書かれている行と
</IfModule>と書かれている行の間に追記します。
ただし、これは
# BEGIN WordPress
# END WordPress
これらより先の行に記述してください。

また、WordPress管理外の静的ページを設置しているサイトの場合、

RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]

こちらも追記しましょう。
こちらは
# BEGIN WordPress
# END WordPress
これらより後の行に記述します。

なお、WordPress管理外の静的ページを設置している場合には、
各ファイル内にもhttp://www.xxxxx.yyで記述されている箇所がないかGrep検索を行いましょう。
あった場合はhttps://www.xxxxx.yyになるようGrep置換します。

.htaccessをアップロード

追記した.htaccessファイルをドキュメントルートにアップロードします。

その他設定

Goole Analyticsの設定や、ogpをはじめとしたmeta情報の設定、
SNSシェアボタンの設定、サイトマップ更新などなど
サイトとしてはまだやることはありますが、WordPressとしてはここまでです。
WordPress以外の設定について、何が必要か事前に把握し作業内容をまとめておくようにしましょう。

最後に

長くなりましたが、だいたいこんな感じです。
指摘などありましたらお気軽にコメントください。

1. mod_rewriteが使用できないため今回は対象外。 ↩