常時SSL化(HTTPS化)はお済みですか?
2018年7月にリリースされるChrome68から、すべてのHTTPサイトに「保護されていません」という警告が表示されるということがGoogleより公式に発表されました。
また、HTTPSサイトをSEO面で優遇することも数年前からGoogleは公言しています。
現在では、常時SSL化はほぼ必須の対応と言えます。
以前は特段必須ではなく証明書も高額だったため、ショッピングサイトや比較的大きな企業サイト以外だとSSL化されていないサイトがほとんどでした。
現在は、エックスサーバーやさくらサーバなど多くのサーバーで無料SSL証明書が利用可能です。
この記事では、サーバーの無料SSL証明書を利用して、SSL化(HTTPS化)する全手順をご紹介させていただきます。
特に、HTTPからHTTPSへの301リダイレクト設定や緑色の鍵アイコンが表示されない件など、不慣れな方だと対応が漏れやすい点も掲載しています。
WordPressサイト常時SSL化(HTTPS化)の全手順
WordPressサイトのSSL化は以下の工程を押さえておけば基本的には間違いありません。
事前に必ずデータベースのバックアップを保存してから作業を行いましょう。
バックアップ保存には、WordPressプラグイン「BackWPup」を利用しています。
- サーバーの管理パネルでSSL設定を有効化
- WordPressの設定URL修正
- サイト内部のリンクURLを全ページ修正(Search Regex)
- HTTPからHTTPSに301リダイレクト設定
- 各ページを確認して、緑色の鍵アイコンが表示されていない場合は該当箇所を修正
- Googleアナリティクスの登録URL修正
- サーチコンソールでの再登録(新規登録)
- Googleアナリティクスとサーチコンソールを再連携
サーバーの管理パネルでSSL設定を有効化
サーバーの管理パネルにログインします。
管理画面左下の「設定対象ドメイン」を選択し「設定する」をクリックの上、右上の「ドメイン」→「SSL設定」へ進みましょう。
「独自SSL設定追加」タブ→「確認画面へ進む」をクリックし、独自SSL設定を有効化します。
独自SSL設定を追加してから、https://~でサイトが表示されるようになるまでしばらく時間がかかるため、他のことをして待ちましょう。
利用可能になる前に、次の手順に進んでURLをhttps://~に変更したり、301リダイレクト設定をしてしまうと、サイトが表示できない時間帯ができてしまいます。
WordPressの設定URL修正
1時間ほど経過してから、https://~のURLにアクセスしてサイトが表示されることを確認の上、こちらの設定に進みます。
WordPress管理画面メニュー「設定」→「一般」→「WordPressアドレス(URL)」「サイトアドレス(URL)」をそれぞれ「https://~」に変更し、設定を保存します。
サイト内部のリンクURLを全ページ修正(Search Regex)
それから、各投稿・固定ページ内のリンクURLや画像のURLをすべてhttps://~に変更します。
一括で置換するための便利なプラグイン「Search Regex」を利用します。
WordPress管理画面メニュー「プラグイン」→「新規追加」から、「Search Regex」をインストール・有効化します。
WordPress管理画面「ツール」→「Search Regex」から置換設定画面へ進みます。
「Search pattern」に「http://(ドメイン)」のURL、「Replace pattern」に「https://(ドメイン)」のURLを入力し、「Search」を一度クリックします。
「Results」の下に、http://(ドメイン)の検索結果一覧が表示されます。
一度誤って置換してしまうと元に戻すことは困難で、バックアップデータをもとにサイト復旧するしかなくなってしまいます。
置換前のURL、置換後のURLを間違えないようにご留意頂けましたら幸いです。
「Results」の下に、置き換えて問題ない検索結果が表示されていることを目視して、「Replace & Save」をクリックします。
すると、投稿・固定ページ内のリンクURLが一括でHTTPSに置き換えられます。
HTTPからHTTPSに301リダイレクト設定
ここまでで一通りSSL化が完了していますが、まだ不十分です。
自力でSSL化された方のサイトなどの場合、ここまでの対応で終わってしまっていることが多いのでご注意ください。
この段階では、「http://(ドメイン)」と「https://(ドメイン)」という2つのURLでサイトが表示されるため、サイト全体が重複コンテンツのようになってしまいかねません。
URLを統一・正規化しておく必要があります。
そのため、http://~にアクセスした際には、自動でhttps://~に飛ぶ設定を行います。
301リダイレクト設定です。
サーバーに設置されている.htaccessファイルを編集して設定します。
サーバーからダウンロードして編集することもできますし、サーバー管理パネルから設定を変更することも可能です。
https://www.xserver.ne.jp/manual/man_server_htaccess.php
エックスサーバーの場合は以下をコピペ
<IfModule mod_rewrite.c> RewriteEngine on RewriteCond %{HTTPS} off RewriteRule ^(.*)$ https://examplexxxxx.com/$1 [R=301,L] </IfModule>
さくらサーバの場合は以下をコピペ
<IfModule mod_rewrite.c> RewriteEngine on RewriteCond %{HTTPS} !=on [NC] RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L] </IfModule>
- .htaccessファイルの上の方に記述しないとうまく作動しないことがある
- .htaccessファイルをサーバーにアップロードする際の文字コード/改行コードに注意(念のためサーバーごとに確認)
外部のフリーランスの方に委託する場合、ここまで対応されていないことがよくあるので、ご対応いただけるように念のためお伝えください。
リダイレクト設定が完了したら、http://~のURLへアクセスして、https://~へリダイレクトされるか確認してみましょう。
http://~へアクセスしてリダイレクトされる場合でも、実際は正しく設定されていない場合もあるため、301リダイレクトチェックツールでも念のため確認しましょう。
また、トップページだけがリダイレクトする設定になっていないかご注意ください。
記事ページや固定ページのURLもhttp://~でアクセスした際に自動でhttps://~に切り替わるか確認しましょう。
http://ohotuku.jp/redirect_checker/
各ページを確認して、緑色の鍵アイコンが表示されていない場合は該当箇所を修正
ここまででSSL化はほぼ完了です。
一通り各ページを確認してみましょう。
ブラウザのURLの左隣に、緑色の鍵アイコンが表示されていれば、保護された通信となります。
ページによっては、https://~のURLになっているのに、緑色の鍵アイコンが表示されていないページが見つかる場合があります。
SSL化(HTTPS化)したにもかかわらず、http://~の外部サイトの画像やスクリプトを読み込んでいたり、WordPressテーマファイル内やウィジェット内でhttp://~の記述があったりすることが原因です。
また、テーマカスタマイザーで設定しているロゴ画像やヘッダー画像のURLがhttp://~のままになっていることも原因となります。
カスタマイザーから画像を再設定すると、画像のURLがhttps://~となります。
緑色の鍵アイコンが表示されないページがある場合は、該当箇所のソースを修正しましょう。
それによって、全ページに緑色の鍵アイコンが表示され、常時SSL化完了となります。
Chromeなどの開発者ツールを利用すると、原因となっている箇所がすぐにわかります。
Chromeでページを開いた状態で「F12」キー→「Console」タブをクリックします。
背景黄色や赤色で表示されているメッセージの中に、だいたいhttp://~のURLが記載されています。
その該当箇所のソースや記述を修正すればメッセージが消えて、緑色の鍵アイコンが表示されるようになります。
Googleアナリティクスの登録URL修正
以上でサイトのSSL化は完了ですが、アクセスデータ解析のために、アナリティクスやサーチコンソールの設定変更が必要です。
Googleアナリティクスの「プロパティ」と「ビュー」のURLをhttpからhttpsに変更し設定を保存しましょう。
Googleアナリティクスにログインし、左下の「歯車アイコン(管理)」→「プロパティ設定」をクリックします。
デフォルトのURLをhttpsに変更し、画面下の「保存」をクリックします。
管理メニューに戻り、「ビューの設定」をクリックします。
ウェブサイトのURLをhttpsに変更し、画面下の「保存」をクリックします。
サーチコンソールでの再登録(新規登録)
Googleアナリティクスの場合は、既存のプロパティとビューのURL設定を変更することができたのですが、サーチコンソールの場合は新規登録となります。
XMLサイトマップの送信(あわせてRSSフィードの登録)、URL検査(インデックス登録をリクエスト)を改めて行い、クロールを促しておきましょう。
SSL化してしばらく経過し、http://~のプロパティで検索表示回数やクリック数がほとんどなくなっていたら、http://~プロパティに登録していたサイトマップは念のため削除しておきます。
Googleアナリティクスとサーチコンソールを再連携
サーチコンソールをhttpsで新規登録したため、Googleアナリティクスとサーチコンソールの連携も再設定を行います。
「歯車アイコン」→「プロパティ設定」→「Search Consoleを調整」をクリックします。
「Search Consoleの設定」と表示されるので、http://~を一度「削除」して、https://~のURLを紐付けるように再度選択・設定し、「保存」をクリックします。
また、あまりいらっしゃらないかもしれませんが、Googleデータポータル(旧Googleデータスタジオ)でサーチコンソールのデータを連携してオンラインレポートを作成している場合は、そちらもサーチコンソールのデータ再連携が必要です。
常時SSL化(HTTPS化)チェックリスト
SSL化(HTTPS化)作業の際の備忘録・チェックリストです。
- サーバーの管理パネルでSSL設定を有効化
- WordPressの設定URL修正
- サイト内部のリンクURLを全ページ修正(Search Regex)
- HTTPからHTTPSに301リダイレクト設定
- http://(トップページ)にアクセスした際に、https://に自動で飛ぶ
- http://(下層ページ)にアクセスした際にも、https://に自動で飛ぶ
- それぞれ301リダイレクトチェックツールで確認しても、301リダイレクトが有効であると判定される
- 各ページで緑色の鍵アイコンが表示されている
- Googleアナリティクスの登録URL修正
- プロパティ設定のURLをhttpsに変更
- ビューの設定のURLをhttpsに変更
- サーチコンソールでの再登録(新規登録)
- XMLサイトマップの送信
- サイトマップにRSSフィードも登録
- URL検査(インデックス登録をリクエスト)
- Googleアナリティクスとサーチコンソールを再連携
まとめ
SEO・検索順位、セキュリティー、ユーザーからの信頼性の面でメリットがあるSSL化対応。
ムダなコストや労力をかけず、スムーズに対応したいですよね。
この記事が少しでもご参考になりましたら幸いです。
SSL化のメリット・注意点については以下の記事もご覧ください。