エックスサーバーで独自SSLを導入し、ワードプレスを完全にSSL化した方法

ワードプレスに独自SSLを設定する方法

毎度、進化しつづけるGoogle。そんなGoogleが2015年12月18日に以下の発表を行った。

Google公式ブログ:『HTTPS ページが優先的にインデックスに登録されるようになります

まぁ、こんな発表をするのもムリはない。だって、インターネットの中は情報だらけだし、それらが確かな情報かわからないし、しかも情報改ざんやハッカー、情報漏洩などの危険性も多々ある。だから、サイトのセキュリティーを高める為に、「HTTPS」に移行させるようにするために、このような措置を施すのは時代なのだろうと感じる。

とはいえ、やはり無視できない発表だ。なぜなら、『優先的にインデックスに登録』となれば、SEOにも関係してくるし、読者の安全も確保できるし、ブログ運営する側にとっては良い知らせだと思うからだ。また、「HTTPS」のサイトってまだ少ないから早めに対処しておくことで後に有利に働くと考えている。

というわけで今回は、本サイトをHTTPからHTTPSに移行する手順を解説していく。

[cc id=3506]

1,エックスサーバーで独自SSLを導入する

独自SSLにはいろんな種類があり、しかも年間費用もかかる。だから独自SSL選びには慎重にすべきと思うが、僕がいろいろと探した中で、格安でしかも使い勝手が良さそうなのが『エックスサーバー』だった

幸い、僕のレンタルサーバーもエックスサーバーなので早速導入を決めた次第だ。以下、エックスサーバーの独自SSL導入について解説していく。

1−1 エックスサーバーのCoreSSLを契約する

エックスサーバーの独自SSLには2つの設定がある。中でも「CoreSSL」は格安だ。今なら(2016年2月時)、1年契約で0円、2年契約で1,000円、3年契約で1,500円となっている。マジで安い。今回は「CoreSSL」と契約する。

ワードプレスに独自SSLを設定する方法

契約するにはまずエックスサーバーを使っていることが前提だ。エックスサーバーとの契約はこちらからどうぞ。
↓↓
エックスサーバーと契約する

で、エックスサーバーが無事契約できれば「インフォパネル」にログインする。ログインしたら左のサイドバーにある追加のお申込み』をクリックする

エックスサーバーの独自SSLのお申込み

追加お申込み」をクリックすると、利用規約の同意を求められるので『同意』をクリックする

エックスサーバーの独自SSLのお申込みに同意する

同意をクリックしたらSSLの新規取得の項目の追加のお申し込み』をクリックする

エックスサーバーの独自SSLの追加お申込み

クリックしたら、「SSL証明書 新規お申込み」の選択項目にいくので、SSLブランドは「CoreSSL (料金:1,080円/年) 」を選択し、SSLプランは「SNI SSL(ネームベース) (初期設定費用:無料、利用料:無料)」を選択する。

エックスサーバーの独自SSLのプラン選択

SSLブランド CoreSSL(料金:1,080円/年)
SSLプラン SNI SSL(ネームベース)(初期設定費用:無料、利用料:無料)
ご契約期間 3年(任意で1年、2年、3年と選べる)

※契約期間は任意で選べるので、今回は3年契約をしてみた

次に、以下の様に「対象サーバーID」コモンネーム」を選択する

コモンネームは「www」が付いたドメインを選択する理由は「www.XXXX.com」と「XXXX.com」のどちらでもアクセスが可能になるからだ。もしもここで、「www」がついていないコモンネームを選んだら、「XXXX.com」のみのアクセスだけになってしまう。なので選ぶ際には「www」付きを選ぶようにしよう。

コモンネーム選択

無事、選択したらお申し込み内容の確認・料金のお支払い』をクリックする

クリックしたら支払い方法を選択する。支払い方法には以下の通り複数あるので、自分に合った方法を選択する。

  • 銀行振込
  • クレジットカード
  • コンビニ
  • ペイジー

僕は今回、クレジットカードで支払うことにした。

クレジット決済完了

これにてエックスサーバーの「CoreSSL」の契約は終了だ。つづいて独自SSLの設定に移ろうと思う。

1−2 CoreSSLの取得申請をする

CoreSSL」の契約が無事完了すると、件名『SSL新規取得手続きのご案内』でメールが届く。このメールが届いたらCoreSSLの取得申請を行う。

まず、エックスサーバーのインフォパネルのトップに移動し、SSL証明書』タブをクリックする。次に、該当するドメインの取得申請』をクリックする

独自SSLの取得申請

クリックしたらCSR情報(SSL証明書申請情報)』を求められるのですべて入力する。なお、入力はすべて英字で行うこと。入力が終わればページ最下部のSSL登録者情報入力へ進む』をクリックする

エックスサーバーのSSL新規お申込みの入力をする

次に、「SSLご登録担当者情報」を入力し、ページ最下部のSSL新規取得申請を行う(確認)』をクリックする

独自SSLのお申込みで担当者欄を英字で全て入力する

入力した内容を確認しSSL新規取得申請を行う(確定)』をクリックする。その後、以下の様な「SSL証明書 新規お申し込み」完了ページが表示されたら、CoreSSLの取得申請は完了だ。

独自SSLのお申込み完了

あとは、エックスサーバーから「SSL証明書設定完了のお知らせ」メールが届くのを待つのみだ。到着までには少々時間がかかるが辛抱強くまとう。僕の場合は約1時間くらいでメールきた。

なお、エックスサーバーから設定完了のメールが届いたら、ワードプレスを「HTTPS」に表示する設定が必要だ。同時に、やるべき事がいくつかある。その方法を以下からすべて解説していく。

2,独自SSLにしたら、やるべき『7つ』の事

エックスサーバーのCoreSSLを取得申請し、独自SSLを導入してもすぐには「HTTPS」にならないと思う。まぁ、中にはすぐに表示されるサイトもあるけれど、ワードプレスの運営の仕方によってはいくつかの設定が必要だ。

例えば、僕のサイトでも独自SSLを導入直後は以下のようになっていた。

独自SSLで「https」が緑色になっていない

通常なら「HTTPS」の部分は緑色になってるはずだが、導入したてのときはそうはならない。「HTTPS」が緑色にならない理由はいくつかあるので、ここでは「HTTPS」がちゃんと機能するための設定方法を解説していこうと思う。また、やるべきことも同時に解説していく。

1,アフィリエイトのリンクをはずす

まず、やってほしいことは全てのページのアフィリエイトリンクをはずすことだ。これは投稿ページだけじゃなく、個別ページやLP、サイドバーなど全てのことである。

もしも、表示されているページの中に、1個でもアフィリエイトリンクがあれば「https」緑色にならず、不完全なサイトとなる。なので、今すぐはずそう。

追記:最近のASP経由(A8.netなど)のURLは「https」化になっている。なのでアフィリエイトを貼っていても大丈夫な場合もある。なので、URLを確認してリンクをはずすかどうかを検討しよう。

因みに、ここで言うアフィリエイトリンクとはASPなどを経由しているリンクのこと。であるから、アドセンス広告は対象外なので、その辺は間違のないないように。つまり、アドセンス広告は大丈夫ってことだ。

2,サイトURLを変更

独自SSLを導入したら、ワードプレスのURLを「HTTPS」に変更しなければいけない。変更する箇所はワードプレス管理画面から、

設定 > 一般

に移行し、「WordPress アドレス (URL)」と「サイトアドレス (URL)」の「http」の部分に「s」を追加し、「https」に変更する(以下、画像参照)。変更したら更新をクリックし、サイトを更新する。

サイトをhttpsにする方法

これでワードプレスのトップページの設定は完了だ。ここを設定すれば他のページにも反映される。が、以下「3」以降からの設定も行わないとページによっては「https」が緑色にならず不完全になってしまう。なので、以下からの設定も必ず行っていこう。

3,画像URLを変更

アフィリエイトリンクをはずし、ワードプレスのURLも「https」に変更したが、なぜかちゃんと緑色になってくれない・・・ということがある。そんな場合は、画像のURLを確認してみよう。

ワードプレスの画像は一旦、サーバーにアップされていて、それぞれURLが施されている。独自SSLを導入する前の画像URLは、すべて「http」のままのはずだ。だから、ここを「https」に設定し直さないと独自SSLはちゃんと働かない。面倒臭い部分ではあるが、必ず設定し直すことをオススメする。

画像URLの変更する方法は、記事投稿ページの中で行う。まず、記事投稿ページから「テキストモード」にして画像のURLを探し、「https」に変更し、更新すれば変更が可能だ。以下、画像を参照してほしい。

4,内部リンクのURL変更

内部リンクのURL変更も、「2」の画像URL変更と同じ理由だ。独自SSL導入前の内部リンクURLは、すべて「http」のままのはずだ。この部分が「https」になっていなければ不完全なSSLとなる。なので、ワードプレス内にある内部リンクを全て探しだし、URLを「https」に変更していこう。

内部リンクのURL変更は、記事投稿ページをテキストモードにして行うか、ビュジュアルモードの「リンクの挿入/編集」の部分から行うことができる。

5,「.htaccess」に追加

5つめの設定は、FTP機能を使って「.htaccess」のファイルに追加に以下を書き加えることだ(※コピペ可能)。

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

書き加える箇所は「.htaccess」ファイルの一番はじめの部分でいい。

この設定をする主な理由は、『閲覧者がhttpにアクセスしたときに、httpsにリダイレクトする』ためだ。これにより、ブックマークなどしていた読者がURLを「http」でアクセスしてきても自動的に「https」のサイトに誘導してくれるということ。とても便利なので設定しておこう。

6,Googleアナリティクスの設定

独自SSLを導入したら基本的にURLが変わるので、紐付けられているツールなども変更が必要だ。そのひとつがGoogleアナリティクス。以下、アナリティクスの変更を解説していく。

まず、Googleアナリティクスにログインする。

次に、「アナリティクス設定」から「プロパティ設定」に移行する。次に、「デフォルトの URL」の中から「http」と「https」が選択できるので「https」を選択する

Googleアナリティクスでhttpsの設定

選択後、保存をクリックする。これでGoogleアナリティクスの変更は完了だ。

7,Google『Search Console(ウェブマスターツール)』の設定

Googleアナリティクス同様、Search Consoleも再設定しなければいけない。ただ、アナリティクスとは違い、こちらの場合、はじめからやり直さなければいけないのだ。というのは、やはりURLが違うからだ。

で、登録するURLだが基本的に4つとなる。つまり・・・、

  • http://○○○.com/
  • http://www.○○○.com/
  • https://○○○.com/
  • https://www.○○○.com/

この4つとなるわけだ(○○○は同じURL)。

このように同じURLでも、「www」が付くのと付かないのとではGoogleは別サイトとして認識するらしい。もしも、Googleが上記全てを別サイトとして認識した場合、コピーサイトとして判断するのでペナルティーもしくは、SEOの下落に大きな影響があると思う。なので、ここでは上記4つのサイトは同じ所有者が管理しているものだということをGoogleに認識してもらうために登録をしておく。

なお、登録の方法は基本的に同じなのでこちら『GoogleのSearch Consoleに登録する方法』を参考にするといいだろう。

独自SSLにするデメリット

独自SSLするメリットはとても大きいが、1つだけデメリットがある。それは、今まで獲得したソーシャルメディアからのカウントが「0」になるということだ。つまり、フェイスブックの「いいね」やはてブの「ブックマーク」のカウントはゼロになるということになる。まぁ、URLそのものが変わるので仕方ないと思うのだが、しかし残念でならない。

とはいえ、いろいろ調べている中であるプラグインがソーシャルボタンのカウントを引き継ぐことが解ってきた。そのプラグインの名は「SNS Count Cache」というものだ。

これは以前、ソーシャルメディアで獲得したカウントをキャッシュで取得し、再表示するというものらしい。ん〜、それって意味あることなのかなぁって思ってしまう。本当に良い記事なら、これからもソーシャルメディア等でシェアされるだろうから、そんなプラグインを使わずとも良いように思うのだが、さてどうなのだろうか。

SPONSORED LINK

SNSでもご購読できます。