ネット環境

エックスサーバーのSSL化設定の手順

エックスサーバーのSSL化設定の手順


エックスサーバーでSSL設定の手順についてご紹介していきます。
SSL設定は最終的に「http://」が「https://」に代わります。

みや
他社サーバーでは一般的にSSL設定には、通常料金の他に設定費用が必要ですが、エックスサーバーは無料でSSL化できるのもポイントです。

→エックスサーバー

今回の工程は以下の通りです。

エックスサーバーのSSL設定

  1. エックスサーバーのドメイン設定
  2. ワードプレス設定
  3. 内部リンクをプラグインSearch RegexにてURL変更
  4. htaccessにリダイレクト用のコードを追記する

では順番にご説明していきます。

エックスサーバー設定

まずはエックスサーバーにアクセスしてドメインの設定を行います。
→エックスサーバー公式サイト

step
1
サーバーパネルにログイン

エックスサーバーのサーバーパネルにログインします。

サーバーパネル
サーバーパネルログイン

step
2
SSL設定を選択

対象ドメインを選択して、サーバーパネルから「SSL設定」をクリック。

サーバーパネルSSL設定

step
3
独自SSL設定の追加をする

独自SSL設定の追加

そうすると「現在、独自SSL設定はありません。」と表示されます。
「独自SSL設定の追加」のタブをクリックし進みます。

step
4
ドメインをチェックして「確認画面へ進む」をクリック

ドメインが間違っていないかの確認をします。
「CSR情報(SSL証明書申請情報)を入力する」は特にチェック不要です。
このまま進んでください。

追加するをクリック

step
5
追加するをクリックします

サーバー設定完了

ドメインを確認して追加しましょう。

step
6
サーバー側で設定完了したらアクセス可能になります。

SSL化のドメイン設定は少し時間がかかります。
(約1時間ほど)
サーバーには「反映待ち」と表示されるので待ちましょう。

未設定

反映されていないとアクセスしてもエラー表記が出ます。

step
7
アクセス可能になればサーバー側の設定はひとまず終了です

最大1時間ほど経過すれば、https://~でアクセスしてもサイトが反映されます。

またエックスサーバーのサーバーパネルでも「反映待ち」の表記が消え、「すでに独自SSLが設定されています。」と出ます。
アクセス可能になれば、次に進みます。

ワードプレスのSSL設定

続いてはワードプレス管理画面から設定を行います。

step
1
まずはURLの変更です

最初にワードプレス管理画面にログインを行って、
「設定」→「一般」から、URLを変更しましょう。

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

この2つのURLを「http:// → https://」に変更します。

http変更前
https変更後


httpsに変更したらページ下部の変更を保存をクリックします。

step
2
もう一度管理画面にログインしましょう

URLが変更になるために、自然に一度自動ログアウトされます。
再度ログインしましょう。(IDやPWは一緒です)

今度はhttps://~でログイン・アクセスが出来るようになります。

step
3
内部リンクやURLの置換を行います

大事な部分としてワードプレスやルートドメイン(トップドメイン)のURLは変更になりました。

手動設定&アップロードしたものは確認を

しかし個別ページや画像ファイルなど、今まで既に公開アップロードしているURLもhttpsに変えなければいけません。

過去ページやメディアからファイルを再アップするのはかなり面倒です。

プラグインSearch Regexがありますのでインストールして一括設定しましょう。
※新規追加からSearch Regexをインストールしてください。

プラグインSearchRegex

step
4
ではSearch Regex設定を行います

Search Regexの詳細設定をします。
サイドバーの「ツール」→「Search Regex」です。

URL設定の前に、現在のURLを確認しましょう。

httpsに変更に伴う既存アップしているURLや画像ファイルの状態を見てみましょう。

http://のURLを入れてサーチします。
まずは httpの状態でドメインを入力してサーチします。

URLサーチ

そうすると「httpのままのURLが赤色で表示されます。」
※赤い部分がhttpsになっていない部分。
主に画像ファイルや自分で行った手動設定の内部リンクなどです。

URL表示

このままではSSL化が出来ません。
この赤い部分のURLを対処しなければいけません。
という事で先に進みます。

step
5
問題がなければ一括変換します

この中で、httpのままにしておかなければいけないURLがあるかを確認します。
※もしシステムやプログラム上残すものや、別作業が必要であれば除外して進めます。

https変更後のアドレスを確認して、問題がなければ「Replace」をクリックします。

URL一括変換

step
6
確定して保存します

「Replace」をクリックすると自動変換されます。
一括対象となるものがすべて変わります。

httpからhttpsにURLが変わっていると思います。↓

変換後

まだ変換は確定していません。
(※この時点で戻ることができます)
問題がなければ「Replace & Save」をクリックして保存しましょう。

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対策の関係

みや
httpからアクセスされても、「httpsだけが閲覧されるように」リダイレクト設定を行う必要があります。

当サイトでも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
2
htaccess編集をクリック

htaccess編集

htaccessの編集画面に入ります。

htaccess画面1

そうするとhtaccessの編集画面に切り替わります。

htaccess

以下の画面になります。

step
3
念のためコピーペーストして保存しておきましょう

htaccessコピー

トラブル防止のためあらかじめバックアップしましょう。
メモ帳にコピペで良いです。

データのバックアップは必ず!

バックアップのため、書いているコードをメモ帳などにコピペして控えておきましょう。
もし設定している最中でぐちゃぐちゃになったり意図しなく書き換えてしまった場合、最初の状態に戻すためです。
最悪の場合、コピーしておいたコードを貼れば元通りになります。

step
4
リダイレクトコードをコピーします

そしてリダイレクトするコードです。
以下のコードをすべてコピーペーストしましょう。

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

step
5
一番上に張り付けます

先ほどの画面の一番上にペーストします。
※一番上に貼り付けないと、リダイレクトがうまくいかない場合があるみたいです。

htaccessにコード貼り付け

step
6
貼り付けたら編集して確認→実行に進みます

htaccess実行する

step
7
.htaccessの編集して終了

htaccess編集終了

以下の画面になれば演習終了です。
これでエックスサーバーの設定はすべて終了です。

URLを確認しましょう

http:// からアクセスしてみましょう。
自動リダイレクトされ、https://~ でアクセスされればOKです。

そしてブラウザの表示が以下にになっていれば、全ての設定はエックスサーバーのSSL化設定は終了です。

Firefox

Firefox表示

chrome

chrome表示

もし設定がうまくいっていない場合は
サイト内にhttps変換されていないファイルやリンクURLが残っている場合がほとんどです。
その際には一括置換出来るプラグインSearch Regexから再度検出してみましょう。

以上でエックスサーバーとワードプレスのHTTPS化=SSL化の設定は終了です。
お疲れ様でした。

  • この記事を書いた人

宮武大輔

ウォーカーネット運営責任者。株式会社フルスペック代表取締役。2012年WEB集客・広告業で起業。複数メディアサイト運営&ウェブマーケティング&ネット集客の受注・コンサルティングを行う。愛犬家。さらに詳しいプロフィール→宮武の詳細プロフィール

-ネット環境