ブログ運営

【簡単!】WordPressをSSL化(https化)する手順 7ステップ エックスサーバー編

ブログのSSL化って聞いたことはあるけど、やり方よくわからないからやってない・・・
面倒くさいしやらなくて良いでしょ??

そんなブロガーさんのために、SSL化の簡単な手順とトラブル解決法をまとめました。
これを読めば誰でも簡単にSSL化をすることができますよ!!

SSL化(https化)が必要な理由

SSL化とは、Webサイトのセキュリティを向上させるために、サイトを暗号化(httpがhttpsになることで暗号化されるらしい・・・)することです。

これにより、
・サイトを訪れるユーザーの安心感が得られる。
・SEOに強くなる・・・かもしれない

というメリットがあります。

SSL化については、Geogleも下記のとおり推奨していることから、SEOへの影響があると考えられています。

こうした理由から、Google では過去数か月にわたり、Google のランキング アルゴリズムでのシグナルとして、暗号化された安全な接続をサイトで使用しているかを考慮に入れたテストを実施してきました。この実験ではよい結果が得られているため、ユーザーがもっと安全にサイトを閲覧できるよう、すべてのサイト所有者の皆様に HTTP から HTTPS への切り替えをおすすめしたいと考えています。
(ウェブマスター向け公式ブログより引用)

SSL化していないページにアクセスし、iマーク(下図で〇で囲ったところ)をクリックすると、こんなメッセージが出ます。

こんなメッセージが出ると、訪問してくれた方は不安になってしまいますよね。

SEOの観点も大事ですが、何より訪問してくれる人のことを考えると、SSL化は必須と言えます!!

SSL化の手順 7ステップ

①バックアップを取る

最初に必ずバックアップを取りましょう。
SSL化は難しい作業ではありませんが、何があるかわかりませんので、念のためにバックアップ。

バックアップの取り方はいくつかありますが、プラグインを利用するのが楽ちん。

僕は、「BackWPup」というプラグインを使っています。やり方は簡単!

・BackWPupをインストール
・WordPressの「設定」からBackWPupのダッシュボードを開く
・「データベースのバックアップをダウンロード」ボタンをクリック

これだけでバックアップが取れます。ファイルのダウンロードは少し時間がかかりますが、手順は簡単!

②エックスサーバーでSSL化の設定をする

・エックスサーバーのサーバーパネルにログインする。
(インフォパネルじゃないから注意してね)

・ドメイン欄にある「SSL設定」をクリック

・SSL化したいドメイン名の右側にある「選択する」をクリック

・タブ「独自SSL設定追加」を選択し、右下の「追加する」をクリック

ここで1つ注意!!
画像の下に「サーバーに設定が反映されるまで最大1時間程度かかります。」書いてあるとおり、少し待つ必要があります。

この反映が完了する前に、次のステップに進んでしまうと少し困ったこと(記事後半の「無効なURLです」という表示が出る」を参照)になるので、しばらく時間を置いてから、次のステップに進みましょう。

反映ができているかどうかの確認は、タブ「SSL設定一覧」を選択し、SSL用アドレスに記載されているアドレスをクリックします。

これで、自身のWebページにアクセスすることができれば、OKです。アクセスできない場合はもう少し待ちましょう。

③WordPressでSSL化の設定をする

次はWordPressの設定です。

・WordPress左側のバーから、「設定」⇒「一般」の順に進みます。

・「WordPressアドレス(URL)」「サイトアドレス(URL)」の2つの項目について、「http」を「https」に書き換える。

書き換え前

書き換え後

・書き換えが終わったら、「変更を保存」ボタンをクリックして終了

④内部リンクをhttpからhttpsに書き換える

次は、既に投稿済の各記事の修正です。

既に投稿した記事の中に、他の記事へのリンクが貼られていたり、画像が貼られていたりすると、記事の中に「http://〇〇〇」のような記述が残ってしまうので、これを「https://〇〇〇」のように書き換える必要があります。

何か面倒くさそう・・・

と思いますが、プラグインを使えば一瞬です。

「Search Regex」というプラグインを使うと、一瞬で書き換えが完了します。使い方は簡単。

・Search Regexをインストール

・「ツール」⇒「Search Regex」を選択

 

・「Search Pattern」のところに検索する文字列(http://〇〇〇)を入力
・「Replace Pattern」のところに置換後の文字列(https://〇〇〇)を入力
・「Replace」をクリック
※〇〇〇部分は、あなたのサイトのアドレス名が入ります。

・「Replace」を押すと、文字列の置換結果のイメージが表示されるので、問題なければ「Replace&Save」をクリック
これで文字列の置換が完了します。

⑤セキュリティチェック(=SSL化がうまくできているかのチェック)

ここまでくればもう一息ですよ。頑張りましょう!!
次のステップは、SSL化がうまくできているかのチェック。

自分のサイトにアクセスをして、ちゃんとSSL化されているかをチェックします。
チェックの方法は、図のとおり、アドレスバー左側に鍵マークが表示されます。鍵マークをクリックすると、「この接続は保護されています」とでます。

⑥301リダイレクトの設定をする

あともう一息・・・

Webサイトが無事にSSL化されると、Webサイトのアドレスが「https://〇〇〇」となります。

これまで、「http://〇〇〇」だったものが、変わってしまうので、「http://〇〇〇」にアクセスしてくれた方を、「https://〇〇〇」の方に誘導する必要があります。

そのために、サーバー側で301リダイレクトの設定が必要です。
301リダイレクトって何?という感じですが、手順どおりやれば簡単です。

・エックスサーバーのサーバーパネルにログイン
・項目「ホームページ」の中にある「.htaccess編集」をクリック

・SSL化したアドレスの横にある「選択する」をクリック

・タブ「.htaccess編集」を選ぶ。
「.htaccess」部分のコードをメモ帳か何かにコピーしておく
(間違ってもすぐに戻せるように)。
・以下のコードをコピペ。コピペの場所は図を参照してください。

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

⑦サーチコンソールの再設定

最後のステップです!!

サーチコンソールは、「http」と「https」を区別して管理していますので、再登録が必要です。
「https」の方のアドレスを追加しておきましょう!!

お疲れさまでした。これでSSL化は完了です!!!

うまくいかない場合の対処法

実際に僕が遭遇した2つのトラブルについて対処法を記載します。

「無効なURLです」という表示が出る

手順③まで実行すると、一旦、WordPressからログアウトされます。
そこで、再度ログインしようとした際に「無効なURLです」という文言が表示されて
WordPressにログインできなくなる場合があります。

冷や汗ものですが、対処は簡単です。

ひたすら待ちましょう。

エックスサーバーでSSL化の設定をすると、「SSL設定が反映するまで、最大1時間かかります」
と表示されます。

「無効なURLです」はまだ、この反映が完了していない合図です。

なので、ひたすら待ちましょう。

ちなみに僕は40分程度かかりました。

WordPressにログインできなくなった!!

手順を全て完了し、無事SSL化が完了!
一安心して、ログアウト。

再度、ブックマークしてあるログインページにアクセスしようとしたら「404エラー」が出てログインページにアクセスできない…

こんな症状が出た場合の対処法です。

まず、ブックマークしているログインページのアドレスを確認

http://〇〇〇/wp-login.php

のように末尾が「/wp-login.php」になっていませんか?

これを、

「http://〇〇〇/wp-admin」

と末尾を変えてみると、ログインページに飛ぶことができます。

ログインができたら、再度ログインページを設定するのを忘れずに。
僕は、プラグイン「SiteGuard」を使ってログインページを設定しているので、画像のように新しいログインページを設定して、再度ブックマークしました。

その他

SSL化について、調べていくと様々なトラブル報告が出てきます。

僕が遭遇したトラブルした以外のトラブルもたくさん報告されています。

以下に、トラブル対処法がわかりやすいサイトを紹介しているので、参照してみてください。

セキュリティチェックがうまくいかない場合のエラー特定方法がわかりやすいです。

WordPressをhttpからhttpsにSSL化した全手順まとめ(エックスサーバー環境)

WordPressにログインできなくなった場合の対処方法がわかりやすいです。
https://webcodezero.com/wordpress/wordpresslogincheck/