【3-2】WordPress 常時 SSL 化設定

常時SSL化

WordPress インストールが完了したら、最初に「常時 SSL 化設定」を行っておきましょう。

少し難しそうに感じるかもしれませんが、手順どおり進めていただければ大丈夫です。

常時 SSL 化とは

WordPress インストール直後は、以下のどちらの URL でもアクセスできます。

※ 自分が取得したドメインにアクセスしてください

  • http://example.com
  • https://example.com
2つのURLでアクセスできる状態

この状態だと、読者はどちらの URL が正しいのかわかりません。検索エンジンも 2 つの URL をそれぞれ別のサイトと認識する可能性があります。

そこで、以下の作業を行っておきます。

  • https:// を正しい URL として設定する
  • http:// にアクセスされたら https:// に自動転送(リダイレクト)する

この作業を「常時 SSL 化」と言います。

常時 SSL 化手順

手順に沿って常時 SSL 化設定を進めていきましょう。

表示確認

作業を始める前に、「http://example.com」でも「https://example.com」でも同じ画面が表示されるか必ずチェックしておいてください。

もし「https://」の表示がおかしい(ブログが表示されない)場合は、エックスサーバーの設定が反映されていません。公式ヘルプを参照して SSL 設定追加をしてみてください。

WordPress 設定

まず、WordPress 側で簡単な作業を行います。管理画面にログインしてください。

ログイン URL を忘れてしまったら…

以下のどちらかでログイン画面が表示されます(ドメインはご自分のものに変更してください)。

  • http://example.com/wp-admin/
  • http://example.com/wp-login.php

管理画面左メニューの「設定」にカーソルを乗せ、「一般」をクリック。

WordPress一般設定

一般設定画面に、「WordPress アドレス(URL)」と「サイトアドレス(URL)」が表示されていると思います。

WordPress一般設定画面

「http://」になっている部分を、両方とも「https://」に変更します。

変更箇所以外はさわらない

http → https にするだけです。右側のドメイン部分はさわらないよう注意してください。間違って変更すると、管理画面に入れなくなってしまいます。

変更後、画面下部の「変更を保存」をクリック。

WordPress URL変更

「変更を保存」をクリックすると、強制的にログアウトさせられます。再度ログインしましょう。

WordPress ログイン画面

ログインすると、一般設定画面が表示されます。URL が「https://」になっていれば OK です。

WordPress 変更後のURL

以上の作業で「https:// を正しい URL として設定する」が完了しました。次は、リダイレクト設定に移ります。

エックスサーバー設定

リダイレクト設定は、エックスサーバーのサーバーパネルで行います。

サーバーパネルにログイン後、「.htaccess 編集」をクリック。

エックスサーバー .htaccess編集

WordPress ブログのドメインを選択します。

.htaccess 編集ドメイン選択

「.htaccess 編集」タブをクリック。

以下の画面が表示されると思います。赤枠部分を編集しますので、編集前の状態をコピーして保管しておいてください。

エックスサーバー .htaccess初期画面

赤枠部分編集欄の一番上に、以下のコードを貼り付けます。

RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
編集前
SetEnvIf Request_URI ".*" Ngx_Cache_NoCacheMode=off
SetEnvIf Request_URI ".*" Ngx_Cache_AllCacheMode

# BEGIN WordPress
# "BEGIN WordPress" から "END WordPress" までのディレクティブ (行) は
# 動的に生成され、WordPress フィルターによってのみ修正が可能です。
# これらのマーカー間にあるディレクティブへのいかなる変更も上書きされてしまいます。
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

編集後
RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

SetEnvIf Request_URI ".*" Ngx_Cache_NoCacheMode=off
SetEnvIf Request_URI ".*" Ngx_Cache_AllCacheMode

# BEGIN WordPress
# "BEGIN WordPress" から "END WordPress" までのディレクティブ (行) は
# 動的に生成され、WordPress フィルターによってのみ修正が可能です。
# これらのマーカー間にあるディレクティブへのいかなる変更も上書きされてしまいます。
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

コードを貼り付けたら、確認画面に進みましょう。

.htaccess 編集後

貼り付けたコードが間違いないか確認し、「実行する」をクリックして完了です。

.htaccess編集を実行する

最終確認

http://example.com にアクセスして、https://example.com に自動転送されているか確認しましょう。

もし自動転送されない場合、.htaccess 編集部分が間違っています。以下の点を確認して再度編集してください。

  • .htaccess を編集するドメイン選択は合っているか
  • コードをコピペするときに余分な文字列が含まれていないか
  • どこかに全角スペースが入っていないか

まとめ

「.htaccess 編集」の部分で難しく感じるかもしれませんが、コードを貼り付けるだけなので落ち着いて作業すれば大丈夫です。

次は、WordPress 管理画面の各項目を解説します。

NEXT 【3-3】WordPress 管理画面解説