Bonjour!
プリちゃん(@PriusShota)です!
光と色彩が大好きなアーティストである著者が
「SSL化とは? httpからhttpsにする方法を、わかりやすく簡単に解説します」について書いています。
SSL化とは? httpからhttpsにする方法を、わかりやすく簡単に解説します

「え? どうやら私のサイトURLはhttpで、httpsにしなきゃいけない。。。!?」
「SSL化をしたら解決するみたいだけど、そもそもSSL化って何ですか?」
「ブログを運営していて、途中からSSL化にする必要が出てきたけど、どうしたらいいのだろう。。」
と、頭を抱えて悩んでいませんか?
SSLとはSecure Sockets Layerの略で、WEBブラウザ(= 例えば、Google chromeなど)とサーバー間で送受信しているデータを暗号化する通信手段のこと。
SSL化ができていれば個人情報といった大切なデータは暗号化によってロックされることになるので、他人によるデータの盗聴や改ざん、なりすましを防ぐことができるのです。。!
基本的に企業の運営サイトやSNSは、ほぼSSL化されているので安心です。
只、最近では個人で1からブログといったWebサイトを作る方も増えて、サイトのURLが、SSL化されていないhttpのままになっているケースがあるかもしれません。。!
この記事を書いている私自身も、Wordpressで作成したこのブログURLがhttpのままであることに途中から気づいて、「httpsにしなきゃ、どうしよう???」と焦っていました。
しかし、個人でも手順を追えば最短2時間ほどで、WordpressのブログをSSL化することができたので、今回は「SSL化とは? httpからhttpsにする方法を、わかりやすく簡単に解説します」として書いていきますね。
目次
2.サイトのURLをhttpからhttpsに変える8ステップ(X serverの場合)
①【Wordpress】設定変更の前に、必ずWordpressのバックアップをする
②【X server】サーバーパネルを開いて、ドメインの”SSLの設定”で変更する
③ SSL設定が終えてから、サイトに反映されるまで待つ(10分〜1時間ほど)
④【Wordpress】設定の項目にある”一般”から、URLをhttpsに変更する
⑤【Wordpress】”Search Regex”というプラグインで、内部リンクを全て置き換える
⑥【X server】ファイルマネージャから、”.htaccess編集”でリダイレクト設定する
⑦【Wordpress】SSL化できているか、エラーページがないかチェック
⑧【Google Analytics】の一部編集と【Google Search Console】の再設定をする
1.そもそもSSL化って何ですか?

SSLとはSecure Sockets Layerの略で、WEBブラウザ(= 例えば、Google chromeなど)とサーバー間で送受信しているデータを暗号化する通信手段のこと。
SSL化ができていれば大切なデータは暗号化によってロックされるので、他人によるデータの盗聴や改ざん、なりすましを防ぐことができるということでした。
SSL化ができているかどうかのチェック方法はとってもシンプル!

①インターネットのブラウザ(=Goole Chromeとか)で、URLを入力するときに”https”から始まっていること
②httpsの隣には”鍵マーク”があること。
この2点があれば、SSL化されている証拠になります。
もしSSL化されていなければ、

①URLがhttpsではなくて、”http”から始まっている。
②httpの隣には鍵マークではなく、別のマークになっている。
→Macの場合、iに○がついたマークでした。
この場合、暗号化されていない通信なので、ある意味データが丸見え状態に。。!そうすると、例えばクレジットカード番号といった個人情報や機密情報が不正に入手されてしまう危険性が高まります。。。!
だから、大切な情報を守るためにSSL化は、とても有効な手段の一つとなるのですね。
2.サイトのURLをhttpからhttpsに変える8ステップ(X serverの場合)

SSL化について学んだ後は、いよいよ変更するための設定に入ります。。!
これからお話する設定手順は、“Wordpressでブログサイトを作成し、レンタルサーバーはX serverを利用した個人サイト”のケースとして書いています。
※他のブログシステムやレンタルサーバーを利用している場合は、手順が違う可能性がありますので予めご了承ください。
「SSL化をすることが難しそう。。」と私も最初は思っていたのですが、X serverの場合なら、WordPressのアドミン画面とX serverの「ファイルマネージャ」や「FTP」のページを行ったりきたりするイメージで必要な設定入力をするだけで、案外すんなりと終えることができます。。!
無事にSSL化ができれば、最後にあなたが利用しているサービス、Google Analytics(グーグルアナリティクス)の一部編集や、Google Search Console(グーグルサーチコンソール)の再設定をすればOKです!
<httpからhttpsへ! SSL化するための8ステップ(X serverの場合)>
①【Wordpress】設定変更の前に、必ずWordpressのバックアップをする
②【X server】サーバーパネルを開いて、ドメインの”SSLの設定”で変更する
③ SSL設定が終えてから、サイトに反映されるまで待つ(10分〜1時間ほど)
④【Wordpress】設定の項目にある”一般”から、URLをhttpsに変更する
⑤【Wordpress】”Search Regex”というプラグインで、内部リンクを全て置き換える
⑥【X server】FTPから、”.htaccess編集”でリダイレクト設定する
⑦【Wordpress】SSL化できているか、エラーページがないかチェック
⑧【Google Analytics】の一部編集と【Google Search Console】の再設定をする
それでは、一つずつ手順を見ていきましょう!
①【Wordpress】設定変更の前に、必ずWordpressのバックアップをする

まずはWordPressのアドミン(管理画面)から、バックアップをとりましょう!
バックアップの仕方
1,Wordpressのプラグイン “BackWPup” をインストール・有効化
2.BackWPupのダッシュボードから、”1クリックバックアップ”の青いボタンを押す
3.バックアップのファイルがダウンロードされる
※これを予めしておくと、何か問題があった時に元の状態に復元することができるようになりますよ。。!
②【X server】サーバーパネルを開いて、ドメインの”SSLの設定”で変更する

続いて、X serverのサーバーパネルにログインをします。
そこからドメインの項目にある、”SSLの設定”へ進みます。

1.ドメイン選択画面で、SSL化したいドメインを選択する

2.独自SSL設定追加タブの、「確認画面へ進む」ボタンを押す
※CSR情報(SSL申請証明書情報)を入力する→こちらは何も入力せずにスキップでOKです。
③ SSL設定が終えてから、サイトに反映されるまで待つ(10分〜1時間ほど)

独自SSL設定を追加後、「SSL新規取得申請中です。しばらくお待ちください。」と青い表示が出ます。

この後、SSL設定一覧のタブを開くと、SSL用のアドレスが出てきます。

サイトの反映は少なくとも10分〜1時間ほど時間がかかります。
(私の場合は、10分程度でhttps~のURLで問題なくサイトが反映されました!!)
https~から始まるサイトが無事にWebブラウザ上で反映されたら、ひと段落クリアです!
④【Wordpress】設定の項目にある”一般”から、URLをhttpsに変更する

再び、Wordpressのアドミン(管理)画面へ戻ります。
1.設定の項目にある、”一般”のボタンを押す。

2.WordPress アドレスとサイトアドレスを、それぞれhttpからhttpsに変更する

3.入力後、”変更を保存”のボタンを押す。
⑤【Wordpress】”Search Regex”というプラグインで、内部リンクを全て置き換える

SSL化をしたということは、httpで始まっていたURLがhttpsに変わったわけですね。
そうなると、ブログ記事中にある内部リンクや、挿入している画像のリンクも今の状態では、どれもhttpのままです。。。。
そこで、Wordpressのプラグインである”Search Regex”を使って、
httpからhttpsへ一気に変換していきます!!

1.プラグイン”Search Regex”をインストール・有効化
2.Search Regexの設定画面にて、以下を入力する。
・Search patternに、http://~ で始まるあなたのサイトURL。
・Replace patternに、 https://~ で始まるあなたのサイトURL。
それぞれ入力後、”Replace”のボタンを押す。

3.置き換えていく赤文字のURLが間違っていないかどうか全てチェック。
※この後の”Replace & Save”のボタンを一度押してしまうと、元の状態に戻すことができないため、ここは慎重になってオレンジの箇所を一つずつ確認していきましょう。。。!!
→入念に確認して問題がなければ、”Replace & Save”のボタンを押す。

⑥【X server】ファイルマネージャから、”.htaccess編集”でリダイレクト設定する

今度はまた再びX server の画面に移ります。先ほどとは違い、今回はファイルマネージャからログインをします。
これからWEB FTPの画面にて、.htaccessファイルを編集し、リダイレクトするために必要なコードを追加していきます!
リダイレクトというのは、「転送」という意味。
httpから始まるあなたのサイトURLに飛んだとしても、このリダイレクト設定を行うだけで、SSL化したhttpsから始まるサイトURLに転送してくれるのです。。!!!
おまけに!これまでhttpで積み重ねてきた検索エンジン評価も引き継ぎをしてくれるという。。!(大変有難い設定です。。!)
1.WEB FTPの中にある、自分のサイトドメイン名、隣にある黄色いファイルを選択
2.次に、public_htmlディレクトリのファイルを選択
3.”.htaccess”というファイルを選択してダウンロード、その後は大事なデータなのでバックアップのためにコピーをしておきます。
4.WEB FTPの画面に再び戻って、.htaccessファイル隣にある小さなチェックボックスを選択後、右上にある、ファイルの操作から”編集”ボタンを押す

5.エディター画面先頭に、以下のコードをコピぺする
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} !=on [NC]
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>
コードをコピペ後、”保存する”のボタンを押す

お疲れ様でした!!これで大きな峠はクリアなので、ゴールまであと少しです。。!
⑦【Wordpress】SSL化できているか、エラーページがないかチェック

このエラーページがないかどうかのチェックはとても大事です!
なぜなら、まだセキュリティが弱いエラーページがあるからです。。!
エラーチェックのポイントは以下の通り。
1.ブラウザでURLをみた時に、先頭のマークは鍵マークですか?

2.Wordpressのウィジェット編集にて、挿入されている画像のURLをチェック
→おそらくhttpのままが多いので、httpsに置き換えたり、もう一度画像を挿入し直しましょう。
3.Google Chromeのデベロッパーツールを開いて、右側にある”Console”タブを選択。

→どこがエラー状態なのかというリンクを示してくれます。そのリンク先に進もうとすると、安全でないサイトからの画像によってエラーであることを知ることができます。

(例えば私の場合だと、Feedlyのボタン画像がエラー理由だったので、これを機に外してみると鍵マークが付くようになって嬉しかったですね。。!)
※Google Chromeのデベロッパーツールは、Macbookの場合だとトラックパッド上で二本指でタップ。その中にあるinspectをチェックすると画面が表示されますよ。

ここまでクリアできれば、あとは最後の砦のみです。。!
⑧【Google Analytics】の一部編集と【Google Search Console】の再設定をする

※これらは、SSL化する前からサービスを利用されている方のみで大丈夫です!
私のケースだと、Google Analyticsと Google Search Console をSSL化する前から導入しているので、SSL化をした後にはこれらサービスの編集・再設定する必要があるということですね。
まずはGoogle Analytics にログインして、一部編集から始めましょう。
1.Google Analyticsの歯車マークである、管理画面を開く
2.アカウント設定内の、”プロパティ設定”を選択

3.プロパティ設定内の、デフォルトのURLでhttp://からhttps://に変更・保存

4.同じように、ビューの設定内の、ウェブサイトのURLもhttp://からhttps://に変更・保存

続いて、Google Search Consoleにログインして、再設定をしていきます!
→Google Analyticsとは違って、SSL化したサイトURLは新しく登録し直す必要があります。。。!
少し手間がかかりますが、これを乗り越えればついにクリアとなりますので頑張りましょう。。!
1.Google Search Consoleにログインして、サマリーの上にある下矢印ボタンを選択し、“プロパティを追加”を選択
2.プロパティの選択で、URLプレフィックスの空欄に https://から始まるあなたのサイトURLを入力して、次に進む。

3.所有権が自動確認される (私の場合だと、HTMLタグによる)

4.新しく登録したサイトプロパティを開き、インデックス内のサイトマップを選択

5.新しいサイトマップの追加にて、sitemap.xmlと入力後・送信
※私の場合だと、Wordpressプラグインの”All in One SEO Pack”内にある、XMLサイトマップを利用しています。サイトマップについて詳しく知りたい方は、この記事とは別内容なので、一度google検索されてみてくださいね。。!
6.送信後、サイトマップのステータスが”正常に処理されました”になればOKです!
7.再びGoogle Analyticsにログインして、プロパティ設定内の”Search Consoleを調整”を選択
8.Search Consoleの設定画面にて、http://から始まる以前のURL横の”削除”を選択
削除した後に、”Search Console に追加“のボタンを押して、SSL化したhttpsのURLを選択し保存する
無事にhttps~始まるプロパティを保存することができれば、もう一度Search Consoleの調整に進むと、https~から始まるプロパティが登録されていることがわかります。。!

これにて、Google Analyticsの一部編集とGoogle Search Consoleの再設定まで全て完了することができました。。!!お疲れ様でした!!
まとめ

今回は、「SSL化とは? httpからhttpsにする方法を、わかりやすく簡単に解説します」として書いていきました。いかがでしたでしょうか?
データを暗号化する通信手段であるSSL化。
→大切なデータが暗号化されてロックされることから、他人によるデータの盗聴や改ざん、なりすましを防ぐことができるということでしたね。
SSL化するためにやるべきことは、ご紹介してきたように正直多いです。。。只、これまでにWordpressを1から立ち上げた経験がある方であれば、早ければ2時間ほどでクリアにできる作業量となります。
本来であれば、Webサイトを作成する過程でもできることですが、もしブログ運営の途中でSSL化する必要が生まれたとしても、この手順を踏めば大丈夫ですよ。
特にXserverのSSL設定は無料で簡単に設定できるので、利用されてみてくださいね。
|| こちらの記事も読まれています ||
プリちゃん