エックスサーバー 無料SSL 緑の鍵マーク

公開日：2016年7月1日　

昨日（2016/6/30）からエックスサーバーで独自SSLが無料で使えるようになりました。

全サーバープランで独自SSLが無料・無制限に利用可能に！「独自SSL」機能の強化のお知らせ

導入方法はマニュアルでご確認ください。
とっても簡単です。数クリックするだけで導入できます。
で、私もさっそく導入してみたのでその時に設定したことについてメモっときます。

すでに運営しているサイトをSSL化した時にsecureにならない（グリーンの鍵マークが出ない）場合、この方法でsecureになります。

httpからhttpsに転送する（URLの正規化）

これを設定する意味

この設定をしないと非SSL（http://）でもアクセスできてしまいます。
URLのwww有り無し問題みたいなもので、SSLも統一しといた方がいいと思います。
すでに稼働しているサイトで外部サイトからリンクされている場合、当然httpでリンクされていると思いますので、それをhttpsに転送してやるんです。

それと、もうひとつ大事なことは、過去の画像などの転送です。
過去に絶対パスで画像を貼っていた場合、http://で画像にアクセスしてしまいます。
その画像などのアドレスをhttps://に転送するためにこの方法を使います。
これをしないと緑の鍵マークが表示されないはずです。

.htaccessに記述する

.htaccessに下記を追記

いつも思うんですが、htaccessについて調べ物した時に上級者用のサイトばかり見つかって、実際にどう追加していいかわからないことがあります。
例えば、既に<IfModule mod_rewrite.c>と</IfModule>がある場合どうするのか？重複してもいいのか？とか…

なので、今現在実際に設定できているサイトの実例を画像で貼っておきます。

エックスサーバーにwordpressをインストールしてる場合の実例

ちなみに以下のようにしても動作します。

WordPressの設定

WordPressの場合はもう一箇所修正します。
こっちはWPの管理画面から簡単にできます。

これを設定する意味

これを修正しないとwordpress関数の<?php bloginfo(‘url’); ?>などで、非SSLのURLが吐き出されます。つまり、今後記事内で画像を貼る時も「http://〜」というパスになってしまいます。

設定方法

設定　→　一般 の「WordPressアドレス（URL）」と「サイトアドレス（URL）」のhttpをhttpsに変更するだけです。変更というか「s」を追加するだけ。

これらをやっても緑の鍵マークが表示されない場合

上記の設定をしても緑の鍵マークにならない場合、原因をひとつずつ見つけるしかありません。

SSLエラーの探し方

chromeの場合で説明します。

白い書類のようなアイコンをクリックして詳細をクリックします。

このような画面が開くので、エラーマーク（）をクリックします。
そうすると画面下部に詳細が表示されますので、その該当箇所を修正します。

エラーは環境によって様々あると思いますが、私の場合、テーマファイルで扱っているURL関係が該当してました。
具体的に言うと賢威7というWPテーマのトップページの画像です。この場合はWPの管理画面で画像URLを修正したら直りました。

google search console（さちこ）も修正する必要があるかも

あと、グーグルサーチコンソールも設定しなおす必要があるかもしれません。
私以前からSSL対応のサイトをいくつか運営してるのですが、サーチコンソールではこのようになってます。

これらのSSLサイトは最初からでしたので、途中で変更した場合どうするのが最適解なのかしりませんが、さちこの事も忘れないでくださいとだけ言っておきます。あとはぐぐってみてください。（放棄）

以上です。

それにしてもエックスサーバー、独自SSLが無料だなんてやってくれますね。
これからもメインサイトはエックスサーバーを使っていきたいと思います。

We are Xxxxxxxxxxxxx!!!!!!!!!!!!!!