エックスサーバーの常時SSL(https化)の設定|初心者向け解説

エックスサーバーの常時SSL(https化)の設定|初心者向け解説

エックスサーバーの常時SSL(https化)の設定はすごく簡単です。

この記事ではエックスサーバーのSSL化の設定手順をまとめているので、参考にしてみて下さい。仮に知識がなくてもできるよう、画像を使ってお伝えしています。

というか、今日中にやってしまいましょう!というのも、SSL化(https化)は以下の3つのメリットがあるからです。

  • ページが保護される
  • 検索順位で有利になりやすい
  • 読者に安心感を与えられる

詳しくは後述しますが、SSL化(https化)はグーグルもおすすめしていますし、http://のままだと「このサイトは安全ではありません」という警告が出てしまうので、僕もSSL化は必須だと考えています。

なので、早速やっていきましょう。

先にSSL化のメリットをお伝えしますが、すぐにエックスサーバーの常時SSL化をしたい場合は目次から『2.エックスサーバーのSSL化(https化)を行う』に進んでください。

はじめに:SSL化の3つのメリット

先ほどお伝えしたSSL化による3つのメリットを、もう少し詳しく見ていきます。

メリット1:ページが保護される

SSL とは「Secure Socket Layer」の略で、ものすごくシンプルに言えば「通信データを暗号化する技術」です。

たとえば通販サイトだと個人情報やクレジットカード情報を入力しますよね。それらの情報を外部に漏らさないための技術です。

つまりSSL化することで、ページが安全に保護されるということです。

通販サイトを例に出しましたが、個人のサイトやブログであってもSSL化をグーグルは推奨しています。ユーザー(読者)に安全にサイトを閲覧してもらうためですね。

メリット2:検索順位で有利になりやすい

https://のサイトは検索順位上、有利です。

ただ有利というのは「https://にすればどんな記事でも検索順位で上位になりやすい!」というわけではないです。

グーグルは「同じようなクオリティの記事が複数あったとき、https://のサイトを優先的に上位に表示させる」と言っています。

なので、検索順位を劇的に上げるものではないんですよね。

ただ、当然やらないよりもやったほうがSEOで有利になるのは間違いないです。

メリット3:読者に安心感を与えられる

https://化したサイトは、たとえばFirefoxのブラウザで見ると「安全な接続」と表示されて、Google Chromeだと「保護された通信」と表示されます。

一方、http://のサイトは「この接続は安全ではありません」と表示され、いかにも「このサイトはセキュリティが脆くてヤバいです」といった印象を読者に与えかねない状況です

これだとせっかく良い記事を書いても、読者に悪い印象を与えてしまいます。読者は記事を読むのをやめてしまうかもしれないし、あなたのことを信用してくれないかもしれません。

なので、https://で「安全なサイトだよ」とアピールできることは大きなメリットです。

以上、3つのメリットをお伝えしました。

無料でこれらのメリットを得られるので、さっそく常時SSLの設定をしていきましょう。特に頭を使う必要はないので、画像の通り進めてみて下さい。

エックスサーバーのSSL化(https化)を行う

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

エックスサーバー|サーバーパネルログインページはこちら

エックスサーバーのサーバーパネルログインページ

ログインしたら、サーバーパネルのメニュー「ドメイン」の「SSL設定」をクリックします。

エックスサーバーのサーバーパネルでSSL設定をする

SSL を設定したいドメインの右側にある、「選択する」というテキストリンクをクリックします。

SSL化したいドメインを選択する

SSL 設定ページの上にあるタブの「独自SSL設定の追加」をクリックします。

そしたら設定画面が表示されます。

ドメインの前に「www.」がついていますが、このままで問題ないです。

「www.○○(SSL を設定したいドメイン)」になっていることを確認したら、ページ右下の「独自SSL設定を追加する(確定)」ボタンをクリックします。

「CSR情報(SSL証明書申請情報)を入力する」というチェックボックスは、チェックを入れないままでOKです。CSR情報を入力しなくても、無料独自SSLを設定出来ます。

そしたら以下のような表示がされるので数秒ほど待ちましょう。

エックスサーバーにてSSL新規取得申請中の画面

『「www.〇〇(あなたのドメイン)」に独自SSL設定を追加しました。』という表示がされたら、無料独自SSL設定の追加が完了です。お疲れさまでした。

エックスサーバーの説明には「SSL設定が反映するまで最大1時間程度かかる」と書かれています。ただ僕の経験では、8分後に反映されたこともあります。場合によりますね。

ちなみに反映される前に「https://〇〇(あなたのドメイン)」にアクセスしたら、以下のように「安全な接続ではありません」と表示されます。

※上記はFirefoxで見た場合の画面です。

その場合は反映されるまで待ちましょう。

さて、反映されるまでちょっと休憩して・・・そしたら続きを読んでください。

というのも、エックスサーバーの無料独自SSL設定を追加しただけだと「http://~」にアクセスしても自動で「https://~」に転送されないんですよね。

なので「http://」にアクセスしたら自動的に「https://」に転送されるように、「常時SSL設定」というのを行う必要があります。

ということで次は、常時SSL設定を行っていきましょう。

エックスサーバーの公式マニュアルはちょっと分かりづらいので、以下の僕がうまくいった方法を試してみて下さい。

エックスサーバーを常時SSL化する

次に、サーバーパネルのメニュー「ホームページ」の「.htaccess編集」をクリックします。

エックスサーバーで「.htaccess編集」を選択する

そしたら常時SSL化したいドメインの右側に表示されている、「選択する」というテキストリンクをクリックします。

htaccessを編集したいドメインを選択

「.htaccess編集」というページが表示されたら、タブの「.htaccess編集」をクリックします。

すると、.htaccess の編集画面が表示されます。

さあ、ここからちょっとだけ気合を入れましょう。

というのも、常時SSL化の記述(特定の英数字)を追加していくのですが、おそらくここが初心者がつまづきやすいポイントだと思うからです。

エックスサーバー公式のマニュアルを読んでも分かりづらいですし。

僕もエックスサーバー以外で常時SSL化のために.htaccess を編集したことがありますが、その時は知識がなかったのでめちゃめちゃ苦労したんですよね。

他のサイトの記事を読んでも、知識がなくてさっぱり分かりませんでした。

ただ、以下の通りにやってもらえれば簡単に出来るようにお伝えしますので、安心して進めて下さい。

※万が一に備えて、.htaccess のバックアップを取っておきましょう。仮に.htaccess の記述を間違えて上書きしてしまった時に、元に戻せるようにするためです。

まず、以下の5行をコピーしてください。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

記述の意味や内容は分からなくても全く問題ありません。

が、一応簡単にお伝えしておくと、上記の記述は「http://でアクセスされた場合、https://に自動的に転送させる」という内容です。

上記に「R=301」という英数字があるように、上記の記述では301リダイレクトという転送処理を行っています。301リダイレクトとは、旧URLから新URLにずっと転送させたい場合に行う処理で、グーグルがおすすめしている転送処理です。

参考:ページの URL の変更と 301 リダイレクトの使用

301リダイレクトには「旧URLと新URLは同じものだとグーグル検索が判断する」という特徴があります。

なので、旧URLの評価が高かった場合(検索順位やページの質など)、新URLにもその評価が引き継がれます。

ただ完ぺきに引き継がれるわけではなくて、また引き継がれるまでに1~2週間ほどのタイムラグもあると言われています。

以上が、簡単な301リダイレクトの話でした。話を戻しますね。

さきほどコピーした5行を、.htaccess 編集枠の一番上に貼りつけます。貼りつける際は、他の記述を上書きしてしまわないように注意してください!

以下、貼り付けた時のイメージです。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

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

必ず一番上に貼りつけるようにしてくださいね。一番上じゃないと「http://」でアクセスしたときに「https://」に自動で転送されないことがあるからです。

さてそしたら、右下の「.htaccessを編集する(確認)」をクリックしましょう。

「.htaccess」に常時SSLのコードを貼り付けたら、確認ボタンをクリックする

そしたら確認画面に移ります。よくあるミスとして、< とか > が抜けてしまっていることがあるので、ミスがないかチェックしてください。

OKであれば右下の「.htaccessを編集する(確定)」をクリックします。

「.htaccess」に常時SSLのコードを貼り付けたら、確定ボタンをクリックする

これでエックスサーバーのサーバーパネルからの.htaccess の編集は完了です。

ひとまずお疲れさまでした。

そしたら、実際に「http://〇〇(あなたのドメイン)」にアクセスして、ちゃんと「https://〇〇」に転送されるか確認してみましょう。

SSL化の確認をする

「http://〇〇(あなたのドメイン)」にアクセスしてみましょう。

自動で「https://〇〇」に転送されて(https://で表示されて)いたらOKです。

↓https://に自動で転送されたらOK。

Firefoxでは緑の鍵マークが表示されます。この鍵マークをクリックしたら「安全な接続」と表示されます。

もしhttpsに転送されない場合、.htaccess の追加記述の貼り付けミスがあるかもしれません。一度確認してみて下さい。

さあこれで終わり…ではなくて、最後にWordPress側の設定を変更して完了です。

もう少しですし、めちゃめちゃ簡単なので以下を読んで設定していきましょう!

WordPressのURLを「https://」に書き換える

WordPressの管理画面から、常にhttps://が表示されるように設定していきます。

設定はダッシュボードの「設定」の「一般設定」から行います。

wordpressの「設定」から「一般設定」を選択する

そしたら一般設定ページにある「WordPressアドレス(URL)」と、「サイトアドレス(URL)」を「http://」から「https://」に書き換えます。

この時、https://の「s」が大文字や全角だと、エラーになってログインできなくなってしまうので注意です。ミスがないように半角小文字でhttps://に書き換えましょう。

https://に書き換えたら、ページ下にある「変更を保存」ボタンをクリックしましょう。

そしたらWordPressのログイン画面が表示されます。ユーザー名(またはメールアドレス)とパスワードを入力してログインしましょう。

頻繁にログインするので、「ログイン状態を保存する」にチェックを入れておくと良いですね。パスワード入力の手間が省けるのでラクになります。

ログインしたら「一般設定」画面に戻ってきます。これで本当に完了です。お疲れさまでした。

グーグルアナリティクスとサーチコンソールにhttpsで登録しておく

さて、常時SSL化の設定を終えてhttpsにしたら、忘れずにグーグルアナリティクスサーチコンソールにhttps://で登録しておきましょう。

もし先に「http://」のURLでグーグルアナリティクスとサーチコンソールに登録していたら、「https://」で新しく登録しておきましょう。

「http://」だけの登録では、「https://」のアクセス解析ができないためです。忘れないうちに登録しておいてください。

先に登録していた「http://」は、アクセス解析のデータが残っているなら分析のために残しておいて良いですね。

http://のサーチコンソールはしばらく様子を見るために(すぐに削除せず)残しておいて良い、とGoogle社員の方も語っていたので。

以上、お読みいただきありがとうございました。

タイトルとURLをコピーしました