エックスサーバーでSSL設定の手順についてご紹介していきます。
SSL設定は最終的に「http://」が「https://」に代わります。
今回の工程は以下の通りです。
エックスサーバーのSSL設定
- エックスサーバーのドメイン設定
- ワードプレス設定
- 内部リンクをプラグインSearch RegexにてURL変更
- htaccessにリダイレクト用のコードを追記する
では順番にご説明していきます。
エックスサーバー設定
まずはエックスサーバーにアクセスしてドメインの設定を行います。
→エックスサーバー公式サイト
step
1サーバーパネルにログイン
エックスサーバーのサーバーパネルにログインします。
step
2SSL設定を選択
対象ドメインを選択して、サーバーパネルから「SSL設定」をクリック。
step
3独自SSL設定の追加をする
そうすると「現在、独自SSL設定はありません。」と表示されます。
「独自SSL設定の追加」のタブをクリックし進みます。
step
4ドメインをチェックして「確認画面へ進む」をクリック
ドメインが間違っていないかの確認をします。
「CSR情報(SSL証明書申請情報)を入力する」は特にチェック不要です。
このまま進んでください。
step
5追加するをクリックします
ドメインを確認して追加しましょう。
step
6サーバー側で設定完了したらアクセス可能になります。
SSL化のドメイン設定は少し時間がかかります。
（約１時間ほど）
サーバーには「反映待ち」と表示されるので待ちましょう。
反映されていないとアクセスしてもエラー表記が出ます。
step
7アクセス可能になればサーバー側の設定はひとまず終了です
最大１時間ほど経過すれば、https://～でアクセスしてもサイトが反映されます。
またエックスサーバーのサーバーパネルでも「反映待ち」の表記が消え、「すでに独自SSLが設定されています。」と出ます。
アクセス可能になれば、次に進みます。
ワードプレスのSSL設定
続いてはワードプレス管理画面から設定を行います。
step
1まずはURLの変更です
最初にワードプレス管理画面にログインを行って、
「設定」→「一般」から、URLを変更しましょう。
- WordPressアドレス（URL）
- サイトアドレス(URL）
この2つのURLを「http:// → https://」に変更します。
httpsに変更したらページ下部の変更を保存をクリックします。
step
2もう一度管理画面にログインしましょう
URLが変更になるために、自然に一度自動ログアウトされます。
再度ログインしましょう。（IDやPWは一緒です）
今度はhttps://～でログイン・アクセスが出来るようになります。
step
3内部リンクやURLの置換を行います
大事な部分としてワードプレスやルートドメイン（トップドメイン）のURLは変更になりました。
手動設定＆アップロードしたものは確認を
しかし個別ページや画像ファイルなど、今まで既に公開アップロードしているURLもhttpsに変えなければいけません。
過去ページやメディアからファイルを再アップするのはかなり面倒です。
プラグインSearch Regexがありますのでインストールして一括設定しましょう。
※新規追加からSearch Regexをインストールしてください。
step
4ではSearch Regex設定を行います
Search Regexの詳細設定をします。
サイドバーの「ツール」→「Search Regex」です。
URL設定の前に、現在のURLを確認しましょう。
httpsに変更に伴う既存アップしているURLや画像ファイルの状態を見てみましょう。
http://のURLを入れてサーチします。
まずは httpの状態でドメインを入力してサーチします。
そうすると「httpのままのURLが赤色で表示されます。」
※赤い部分がhttpsになっていない部分。
主に画像ファイルや自分で行った手動設定の内部リンクなどです。
このままではSSL化が出来ません。
この赤い部分のURLを対処しなければいけません。
という事で先に進みます。
step
5問題がなければ一括変換します
この中で、httpのままにしておかなければいけないURLがあるかを確認します。
※もしシステムやプログラム上残すものや、別作業が必要であれば除外して進めます。
https変更後のアドレスを確認して、問題がなければ「Replace」をクリックします。
step
6確定して保存します
「Replace」をクリックすると自動変換されます。
一括対象となるものがすべて変わります。
httpからhttpsにURLが変わっていると思います。↓
まだ変換は確定していません。
（※この時点で戻ることができます）
問題がなければ「Replace & Save」をクリックして保存しましょう。
これで一括変更されました。
これでワードプレスのhttpsの変換は終了です。
https化はこれで大丈夫
補足にも書いている通り、いくつか変更項目がありますが、今回のSSL化によるhttpsに変更する場合は、「Post content 記事の本文」だけで大丈夫です。
step
7補足
その他に気になる部分があれば、同じ要領で選択して変換します。
- Comment author コメントの名前
- Comment author email コメントのメールアドレス
- Comment author URL コメントのURL
- Comment content コメントの内容
- Post content 記事の本文
- Post excerpt 記事の抜粋
- Post meta value 記事のカスタムフィールド
- Post title 記事のタイトル
- Post URL 記事のURL
念のために、URLだけではなく言葉の一括変換なども行えます。
こんな感じです。
何かのお役に立てればと思います。
リダイレクト設定を行います
ワードプレス管理画面からURL変更を行いました。
しかし現状ではhttpでもhttpsの両方でアクセス出来てしまいます。
SEO対策の関係上、まずいですね。→URLの正規化とSEO対策の関係
当サイトでもhttps://full-spec.co.jp/walker_netでアクセスしても https://full-spec.co.jp/walker_netが表示されます。
クリックしてみてください→https://full-spec.co.jp/walker_net
ではURLの正規化を行いましょう。
step
1サーバーパネルにアクセス
再びエックスサーバーのサーバーパネルにアクセスします。
→エックスサーバー公式サイト
対象となるドメインを設定するのを忘れないでください。
step
2htaccess編集をクリック
htaccessの編集画面に入ります。
そうするとhtaccessの編集画面に切り替わります。
以下の画面になります。
step
3念のためコピーペーストして保存しておきましょう
トラブル防止のためあらかじめバックアップしましょう。
メモ帳にコピペで良いです。
データのバックアップは必ず！
バックアップのため、書いているコードをメモ帳などにコピペして控えておきましょう。
もし設定している最中でぐちゃぐちゃになったり意図しなく書き換えてしまった場合、最初の状態に戻すためです。
最悪の場合、コピーしておいたコードを貼れば元通りになります。
step
4リダイレクトコードをコピーします
そしてリダイレクトするコードです。
以下のコードをすべてコピーペーストしましょう。
RewriteEngine on
RewriteCond %{HTTPS} !=on [NC]
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
step
5一番上に張り付けます
先ほどの画面の一番上にペーストします。
※一番上に貼り付けないと、リダイレクトがうまくいかない場合があるみたいです。
step
6貼り付けたら編集して確認→実行に進みます
step
7.htaccessの編集して終了
以下の画面になれば演習終了です。
これでエックスサーバーの設定はすべて終了です。
URLを確認しましょう
http:// からアクセスしてみましょう。
自動リダイレクトされ、https://～ でアクセスされればOKです。
そしてブラウザの表示が以下にになっていれば、全ての設定はエックスサーバーのSSL化設定は終了です。
Firefox
chrome
もし設定がうまくいっていない場合は
サイト内にhttps変換されていないファイルやリンクURLが残っている場合がほとんどです。
その際には一括置換出来るプラグインSearch Regexから再度検出してみましょう。
以上でエックスサーバーとワードプレスのHTTPS化＝SSL化の設定は終了です。
お疲れ様でした。
