WordPressを常時SSLにする

一部ページだけhttpsで大丈夫か

いつのころからかブラウザでWebページを見ると物騒な表示が出るようになりました。

・この接続は安全ではありません
・ここに入力したログイン情報は漏洩する可能性があります

大袈裟とは思いますが、時代の流れは常時SSL。パソコンに詳しくないお客さんが、「なんか安全じゃないって表示された」と直帰してしまう恐れもあります。安い証明書なら2,000円/年ほどの出費。そろそろhttps完全移行してしまいましょう。
ワードプレスサイトのhttp://futurebase.co.jp/をhttps://futurebase.co.jp/にすると仮定して行っていきます。

手順の流れ

常時SSLは以下のような手順で行っていきます。
WordPressと各種ファイルはバックアップを行ったうえで作業を行ってください。

・SSL証明書の取得と導入
・WordPress設定の変更
・.htaccessのリダイレクト設定
・テーマフォルダ内のファイルの書き換え
・MySQLの文字置換
・ブラウザによるエラーチェック

SSL証明書を取得する

サーバー環境によってどれがベストとは言えないのでお好きなものを。
さくらサーバーならラピッドSSLが良い感じでした。
CSR作成して支払いを完了すればSSLが使用できます。
サーバ証明書・中間CA証明書の設置やらコピペ作業の必要は無し!流石ラピッド。

コントロールパネルからログインすると
『ドメイン設定』はこのような状態。
CSRで指定したドメインで証明書はあるが、まだ利用はしていない状況。
(未入金・未申請の場合は、証明書が「登録」状態になりません。)

変更>ドメイン詳細設定に。
『SNI SSLを利用する』に変更します。

URLをhttpsにしてブラウザで開いてみてページが表示されれば証明書は有効になっています。
スタイルシートが上手く反映されなくてデザインは崩れているかもしれませんが…。
「安全な接続ではありません」「この接続ではプライバシーが保護されてません」といったエラーページが表示される場合、証明書の設定がどこか間違っています。

WordPressの変更

現行のURL:http://futurebase.co.jp
移行後のURL:https://futurebase.co.jp
とします。
ダッシュボード画面の設定>一般から、サイトURLの変更を行います。
WordPressアドレス(URL)とサイトアドレス(RUL)をhttpsに修正するだけ。

作業後にhttpsのURLで閲覧してみて、アドレス横に鍵マークが出た人はそれで終わりです。お疲れ様でした。

.htaccessへの追記を忘れずに行いましょう。
httpのリンクでアクセスして来た場合、自動でhttpsに移動させるためです。
参考:「http://」から「https://」に自動転送させる方法

WordPress内ファイルの修正

WordPressを弄っている場合、こんなマークが出ます。

常時SSLの場合、ページ読み込み時の通信を全て「https」にする必要があります。

phpやcssに書き込まれている「http://futurebase.co.jp」を全て「https://futurebase.co.jp」に置換します。また外部API・Javascriptなども可能な限りhttpsの形に書き換えましょう。
自分は
①ftpソフトで使用しているテーマフォルダをローカルにダウンロード
②サクラエディタで「http://futurebase.co.jp」をgrap検索
③そこまで大量ではなかった(style.cssとheader.php程度だった)ので、人力で置換。
④変更ファイルを上書きアップロード
という手順を取りました。
独自ドメインを使用している場合、ソースにサーバードメインが混ざっている場合もあります。さくらサーバーならhttp://○○○.sakura.ne.jpですね。ここも忘れずに置換しましょう。

WordPress(MySQL)内データの修正

MySQLに格納されたデータ(固定ページ・投稿記事・ウィジェットなど)を修正します。
Search Regexというプラグインがあるのですが…これは投稿記事しか置換ができないようです。
データ全体で行いたいので、今回はDatabase Search and Replace Script in PHPを使用します。これはサーバー上のPHPファイルで文字データの置換を行います。URLを知っていれば、管理者以外の人も実行可能です。短時間の作業なら攻撃の心配は無いと思いますが…不安であればIPやパスワードなどで接続規制することをお勧めします。
安定板のv2.1.0をダウンロード。
WordPressと同じ階層にアップロードします。.htaccessとかwp-config.phpがある場所ですね。
http://futurebase.co.jp/searchreplacedb2.php にアクセス。
「wp-config.phpの設定を読み込みますが大丈夫ですか?」的なことを聞かれるので『submit』で次へ。

mysqlへの接続情報が表示されます。間違っていなければ『Submit DB details』。

テーブル一覧が表示されます。初期は全て選択されている状態。
もし置換したくないテーブルがあれば選択から外せます。(ふつうはなにもしなくて大丈夫だと思います。)

「正しいテーブルを選択してますか?(マルチサイトの場合は特に)」と注意表示が出るので『OK』で次へ。

上のフォームに置換前のURL(http://~)、下のフォームに置換後のURL(https://~)を入力して「Submit Search string」。

「本当に実行しても大丈夫ですか?」と聞かれるので『OK』で実行します。

置換処理の結果が表示されます。(今回は既にhttps移行した後のデータだったので1件しかありませんでした。)

絶対忘れないで欲しいのは
作業後にsearchreplacedb2.phpを削除すること。
作業工程から分かるように、URLを打ち込めば外部からデータベースを弄れます。放置しておくとHP改ざん・削除の恐れがあります。

ブラウザで確認する

ブラウザ(Google Chrome)でサイトを開きチェックします。
「この接続は安全ではありません」とまだ表示されるようであれば、右クリックから「検証」を開きます。

黄色で表示されるwarningと赤色のerrorが出現した場合、そこが原因と思われます。個別に対処を行いましょう。

下部のConsoleにエラーメッセージが表示されないようになれば、アドレスバーに鍵マークが表示されるはずです。