SSL化していますか?
今回はSSL何て聞いたことないよ!
という人に向けて、
- SSLの概要
- Cocoon×Xserverを利用した常時SSL化方法
- 常時SSLの確認方法
を解説します。
SSLとは
SSL(Secure Sockets Layer)とは、
インターネット上の通信を暗号化する技術です。
SSL化することで、
- 個人情報
- クレジットカード情報
などのデータを暗号化することで
サイトのセキュリティを高めます。
常時SSL
常時SSLとは、サイト全体をhttps化することです。
常時SSL化することで、
- セキュリティリスクに対抗
- 検索順位への良い影響
- ウェブサイト分析への有効活用
- SSL化で高速表示
できるようになるため、
サイト運営者なら常時SSL化に設定しましょう。
SSL対応する方法
XserverでSSL設定を行う

Xserverのサーバーパネルにログイン、
ドメインのSSL設定を選択


今回、常時SSL化したいドメイン名を選択します。
当サイトはすでに常時SSL化していたので、
違うサイトで解説します。

独自SSL設定追加をクリックします。

ドメイン名を確認して、
正しければ追加するをクリックします。

ここまでがXserverでのSSL設定手順です。

サーバーに反映されるまで、
最大で1時間程度ようする場合もあります。
WordPress設定のURLを変更する
管理画面、設定、一般から
- WordPressアドレス(URL)
- サイトアドレス(URL)
がhttp://~となっている場合、
https://~も変更します。

内部リンクの置換
- 管理画面から内部リンクをSSL化
- Search Regax(置換プラグイン)でSSL化
していきます。
両方やる必要はないかもしれないですが、
やれそうならやっておきましょう。
まずは、管理画面から内部リンクをSSL化から。

Search Regax(置換プラグイン)でSSL化
.htaccessの変更
今までhttp://~にアクセスしていた人に、
SSL化したページを見てもらう設定をします。
301リダイレクト用のコードを
.htaccessに追記します。

.htaccessを編集するには、
- ファイルサーバーから直接編集する
- FTPソフトを利用してアップロードする
方法がありますが今回は、
ファイルサーバーから直接編集する方法を紹介します。
.htaccessは重要なファイルで、
編集に失敗するとサイトが表示されなくなります。
編集前にバックアップを取ることをおすすめします。


Xserverのファイルサーバーにログインします。


ログインできたら設定するドメインを選択。




public_htmlをクリック。


.htaccessにチャックを入れ、
ファイルの操作、編集をクリック。
.htaccessが表示されたら、
下記コードをファイルの先頭にコピペします。
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} !=on [NC]
RewriteR


保存して終了です。
Ccoon設定の確認
管理画面で設定している、
- サイト背景画像
- ヘッダーロゴ
- ヘッダー背景画像
- OGPのホームイメージ
- アピールエリア画像
- トップへ戻るボタン画像
- 404ページ画像
- AMP用のロゴ画像
などに関してはリンク置換ができていないので、
一つずつ設定してください。
自分のサイトが常時SSLしているかチェック
設定できたら自分のサイトが
常時SSLになっているか確認しょう。
Chromeの場合


この状態になっているとちゃんと設定できています。
この状態になっていない人は、
httpとhttpsが同サイト内で混在している
mixed-contentsになっている可能性が高いです。
Chromeデベロッパーツール
- 画面上で右クリック[検証]をクリック
- キーボードの[F12]を押す
を開きコンソールから、
httpと表示されている該当箇所を見つけて、
修正していきましょう。
Firefoxの場合


この状態になっているとちゃんと設定できています。
Chrome同様にFirefox開発ツール
- 画面上で右クリック[要素を調査]クリック
- キーボードの[F12]を押す
を開きコンソールから、
httpと表示されている該当箇所を見つけて、
修正していきましょう。
まとめ
今回は常時SSL化について解説しました。
難しい設定はないのですが、
mixed-contentを見つけるのに
時間がかかるかもしれませんね。
サイト公開段階で常時SSL化させる
必要はないですが、
後々対応しなくてはいけないので、
なるべく早くやっておきましょう。
コメント