MENU

初心者にもわかりやすい!SSL化の手順を丁寧に解説

BUPで推奨しているエックスサーバーの「クイック・スタート」なら、新規申し込みの際に「SSL化」まで完了できます。

ここでは、クイック・スタートではなく「10日間無料お試し」から登録した方(通常手続き)向けのSSL化方法を説明しますね。

  1. エックスサーバー新規申込み 
  2. ドメインの取得と追加
  3. ワードプレスのインストール
  4. ワードプレスの初期設定 
  5. SSL化の設定 ←いまココ
  6. Googleのツールなど標準装備を整備


まずはエックスサーバーへの登録が必要です!まだの方は通常登録の手順はこちら!


さまんさ

やっぱりクイックスタートにする!
という方はこちらからどうぞ!

CONTENTS

SSL化とは?設定が必要な理由は?

サイトのURLの頭につく「http」とは「HyperText Transfer Protocol」の略で、
ホームページの表示に利用する通信規約(ルール)のことです。

ホームページを表示するときは、サーバーとブラウザの間でデータの通信が行われます。
共通で認識できる「http」というルールで通信することにより、ホームページが正しく表示されるのです。

そのhttpに、安全や厳重といった意味を持つ「Secure(セキュア)」の頭文字が追加されたのが、「https」になります。

つまり、httpによるデータ通信を安全にした仕組みが「https」です。


SSL化が必要な理由は

  • ユーザーがホームページを利用するうえでのセキュリティを担保
  • SSL化されたホームページは「https」と表示され信頼度が高くなる
  • SEOのランキング要素にもhttpsが加えられている

つまり、安全でSEO的にも有利なサイト運営には欠かせない設定となります。

WordPressでのSSL化の手順

エックスサーバーのドメイン追加時に「無料独自SSL化」を選択しているので、
サーバーでのSSL化は完了しているはずです。


ドメイン追加方法はこちら



ここでは、次のステップWordPressのSSL化を進めていきます。


ダッシュボード画面「設定」→「一般」をクリックします。

「WordPressアドレス」と「サイトアドレス」の「http」の後に半角「s」を入れ、「https」にします。

必ず半角小文字で、間違いないように入力してください。
この入力を誤ると、ワードプレスにアクセスできなくなる可能性があります。


一番下までスクロールし、「変更を保存」をクリック。




すると強制ログアウトされログイン画面が表示されますので、再度ログインしていきましょう。

SSL化する3






ログインしたらWordPressアドレスとサイトアドレスに「s」がついていることが確認できます。

さらに左上の「ブログ名」の部分をクリック。





以下の画像のように、ドメインURLの横にこのようなマークがついていれば、ワードプレスでのSSL化が完了です。

エックスサーバーで常時SSL設定をする

最後に、常時SSLの設定を行なっていきます。
(エックスサーバー「クイックスタート」の方は必要ないです)


ここまでの設定だけでは、まだ「http」と「https」のURL両方にアクセスすることができる状態です。

そこで「http」のURLを「https」へ転送する設定を行っていきます(常時SSL)。

設定を行うには、サーバー上にある「.htaccess」という重要なファイルを編集する必要があります。

さまんさ

後でも述べますが、
もともと入っているコードは
いじらない、消さないようにしてくださいね!

サーバーパネルへログインし、「.htaccess編集」メニューをクリックします。

サーバーパネル・.htaccess編集のスクリーンショット



対象のドメインを選択し、「.htaccess編集」タブをクリックします。




すると、.htaccessファイルの内容が表示されます。
記載内容はご利用の環境によって異なる場合があります。

既存の設定は絶対に削除せず以下のコードをコピーして正しく反映されるように一番上の行に貼り付けます。

注:編集作業をする前にもともとのコードをどこかにコピペしておくと確認ができるので安全です!

RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
.htaccessに追加する内容を入力しているスクリーンショット
さまんさ

もともとの記載内容は
1文字も消さない
いじらないようにしてください!

コードを挿入したら、右下の「確認する」をクリック後、「実行する」をクリックします。



最後に「http://自分のドメイン名」でアクセスしてみましょう。

「http://~」のURLでアクセスした際、自動的に「https://~」のURLへ転送されていれば設定完了です。

ここまでできたら、最後はプラグインやツールを整えましょう!

CONTENTS