<<はじめに>>
2018年7月に本ブログもSSL化しました。
サイトやブログのSSL化について本ページではワードプレスを利用されてる方を対象にしており、そのほとんどの方がレンタルサーバー会社と契約して運営している前提で話を進めさせていただきます。
SSL化のやり法などでインターネットで検索すると個人ブログでサーバー会社ごとに対応した手順を説明している記事をよく見かけますが、内容についてはサポートも責任もほぼないと考えられます。
もしそこで迷ったりトラブルが起きれば結局、本家の契約しているレンタルサーバー会社に頼ることになります。
なので最初からSSL化の具体的な細かい手順につきましては必ずご利用されているレンタルサーバー会社の管理画面やサポートでご確認することを推奨いたします。
個人ブログの設定手順などはほぼ、そのサーバー会社の公開してる内容を見て真似て書いてるだけで間違いや見落としや場合によっては情報が古い可能性もあります。
以上の理由から本ページはSSL化の細かい設定方法などの具体的な操作手順には触れません。
大まかな手順の流れでSSL化はどのような進め方をするかご理解していただくこと、SSL化の事前準備と実行後の対策や注意点をご説明させていただきます。
SSL化とは
SSLは「Secure Sockets Layer」の略で運営するサイトにおいて通信相手の認証や通信内容を暗号化することでセキュリティを強化することを「SSL化」と称し、Googeの推奨としてサイトのSSL化は急速に普及しています。
SSL化にするメリット
・セキュリティが強化されたサイトなので訪問者は安心して閲覧やデータの送受信ができる
・ユーザービリティの一環としてサイト自体の信用のステータスにもなる
・Googleが推奨し検索順位の決定要因に大きく影響することを発表している
＜SSLされた状態：Google Chromeの場合＞
アドレスバーは「https:」から始まり、鍵マークのアイコンと「保護された通信」の表示がある
SSL化にしないデメリット
・セキュリティが緩いので情報の流出など悪用される恐れがある
・訪問者によってはサイトに不安を感じ、即離脱してしまう可能性がある
＜SSLされてない状態：Google Chromeの場合＞
以上のことからやらないよりやる、というよりサイトやブログを運営されているならSSL化は必須事項ということです。
SSL化の主な流れ
SSL化にはある程度の手間と時間が必要になります。
「面倒くさい」「時間がない」と思われるかもしれませんが運営上の最優先事項と思って時間を確保して作業しましょう。
ちなみに私が利用しているレンタルサーバー会社の「さくらインターネット」ではサーバー会社専用のSSL化プラグインも用意されていてある程度自動処理してくれたので多少のトラブルこそありましたがSSL化を進める手順においてはすごく簡単で半日で終了しました。
ここではさくらインターネットの手順を例にSSL化の主な流れとその後の対策をご説明します。
すべて終了すれば「https」のアドレスから始まる「常時SSL化」が成功したことになります。
※SSL化に関する操作は必ず「ご自身の判断、責任の下」で行ってください。
・SSL化の事前準備
↓
・証明書の発行、適用
↓
・SSL化を実行
↓
・SSL化の確認
↓
・問題ページを修正
↓
・過去に「http」で登録していたすべての情報を「https」に変更
↓
完了！
SSL化の事前準備
・ワードプレスのデータのバックアップをする
SSL化はあなたの大事なワードプレスのデータに変更を加えます。
不安な方はまずデータのバックアップをとっておきましょう。
操作は主にレンタルサーバーの管理画面でできます。
（バックアップ方法は各レンタルサーバー会社の操作手順に準じます。）
さらに不安ならデータの復旧の仕方もあわせて確認しておきましょう。
※自分でインストールしたフリーのFTPサーバーなどから直接全フォルダーのダウンロードだけではワードプレスの細かい設定ファイルはバックアップできないらしいので推奨しません
・サイト内の「http」で始まる絶対パスを全て「https」または相対パスに書き換える
SSL化が成功したページはブラウザがGoogle Chromeの場合はアドレスバーに鍵マークがつき、アドレスが「https」から始まります。
「成功」か「失敗」はページ個別にあります。
SSL化を実行したにも関わらずページ内に「http」のページへの内部リンクが残っていると「保護されていないページへのリンク」と認識され、鍵マークが表示されずSSLはできていないことになります。
SSL化実行前にご自身の作成した全ページを見直し、「http」から始まる絶対パスを「https」または相対パスに直しましょう。
—————————————————————–
◆例
http://○○/△△/□□/
↓
・絶対パスの場合
https://○○/△△/□□/
・相対パスの場合
/△△/□□/
—————————————————————–
元々相対パスで書かれている箇所なら全ページの頭の「http~」がSSL化して「https~」になるだけなのでパスの位置は連動するので書き換える必要がない可能性があります。
ただパスの書き方は個人ぞれぞれのやり方や判断なので正しいとか間違いではありません。
※パスの修正はご利用されてるレンタルサーバー会社でSSLプラグインが用意されている場合、自動処理できる可能性があります（ただしサイトの作り方がそれぞれあるので100%全ページで成功する保証はないとのことです）
・各ページのリダイレクトの設定をする
通常はSSL化してもとくに設定をしなければ「http」のアドレスから始まるページはしばらく存在しています。
常時SSL化された状態であればほぼ目につくことはないですが、あなたのサイトやブログをSSL化する以前に「お気に入り」や「ブックマーク」などで「http」のアドレスの状態で登録してる方がいらっしゃった場合は、SSLした後でもはそれらの登録状態はSSL化以前のページにリンクしてしまいます。
それに「http」のページに入られてしまうのはセキュリティ上よろしくありません。（SSLした意味がなくなる。）
リダイレクトの設定をすれば仮に「http」のページに入っても、瞬時に「https」のページに遷移されるようになります。
※リダイレクトの設定もご利用されてるレンタルサーバー会社でSSLプラグインが用意されている場合、自動処理できる可能性があります（ただしサイトの作り方がそれぞれあるので100%全ページで成功する保証はないとのことです）
証明書の発行
SSLサーバー証明書の発行は事前準備が済めばSSL化の最初の作業になります。
この証明書はセキュリティの一環として第三者の「なりすまし」や「改ざん」を防止するため通信先の管理者の存在を示す暗号化された電子証明書になります。
証明書には「有料」と「無料」がありますが、Googleの推奨するSSL化の条件は無料の証明書でも十分満たしています。なので私は個人ブログですし無料にしました。
※証明書の発行、インストールもご利用のレンタルサーバー会社の手順に準じてください。
さくらインターネットの場合は管理画面で申し込み後、20分くらいでメールで発行終了（インストール済）の連絡がきました。それ以外はとくに操作はおこなっていません。
SSL化を実行
証明書の発行（インストール）が済み、いよいよSSL化を実行します。
前述したとおり、SSL化の実行手順はここでは触れず、利用しているレンタルサーバー会社の管理画面を確認したりSSL化プラグインを使ったり不明な点はサーバー会社に問い合わせしてください。
ちょっとした設定はあったものの意外にあっけなく終了しました。
SSL化の確認
プラグインなどでSSL化が終了して、問題なければ作業はここで終了となります。
ただ、念の為、各ページを確認してみてください。
SSL化がされてる、されていないはページ単位です。
・全てのページのアドレスバーに鍵マークがついて「保護された通信」が表示されたか
・全てのページの画像、リンク、レイアウトが問題なく動作してるか
・アドレスバーに以前の「http」の任意のページを入力して開いた後、リダイレクトがかかって「https」のページにきちんと遷移するか
などなど。
私はこの時、トップページと複数のページが残念ながら「保護されていません」と出ました…。
この点も前述しましたが、SSL化プラグインは手軽にSSLの処理を行ってくれますが、サイトの作りによってすべてがうまくいくわけではありません。
さくらインターネットのサポートにも「実際に何が起きるかもわからない」とまで言われました。
何万人という人が何万通りという作り方をしてるので、すべてに問題なく100%対応できるわけではない、ということです。
そこで次のステップは主な修正の方をご説明します。
問題のページの修正
SSLされない問題ページの原因究明にはブラウザーのデベロッパーツールを使うのがベストです。
詳しい操作は下記ページを参考にお願いします。
⇒>Google chromeのデベロッパーツールはCSSの編集に最適
上記を読んである程度わかった前提で話を進めます。
まず問題のあるページをGoogle chromeで開き、「F12」を押下し、デベロッパーツールを起動します。
続いてツール内の「Console」を開くと中に「Mixed Content」のエラーメッセージがあると思います。
このエラーは「https」と「http」が混在していてセキュリティに問題があるということを示しています。
つまりここに表示されている問題のページの「http」のパスの記述を修正すれば、該当箇所のエラーが消えてくれます。
私の場合はほとんどはimg src（画像）のパスでした。
———————————————————————————————————————————-
参考程度に私のブログ内での「MixedContent」の問題点を挙げます。
・ウィジェットの画像は全ページで表示されているのにエラーの出てるページとそうでないページがあった
→大元のワードプレス管理画面のウィジェットのパスを修正
・同じような条件で作成したページでもエラーの出てるページとそうでないページがあった
→エラーの出てる方はなぜかパスの頭が自分のサイトでないものに変わってたのでパスを修正
・他のページが全てSSL化できてもトップページだけはどうしてもエラーが消えず
→「MixedContent」には見覚えのない自分のサイトではないパスのURLがある
→数時間悩む
→関連記事プラグインのランダムで表示される広告の画像だと気づく
→関連記事をトップページだけ非表示にして修正
———————————————————————————————————————————-
最後のトップページだけは本当に悩みました。
自分のサイトのパスの表示じゃなかったからわけがわからなくて、試しにそのURLをクリックしたらある画像だけが表示されるページでした。
なんとなく見覚えある画像だと思ったら、それは関連記事のプラグインでたまにランダムで表示される広告の画像だと気づきました。
試しにそのプラグインの設定画面でトップページだけ関連記事を非表示にしたら…なんとSSL化成功！！！
トップページだけができずにSSL化を断念することになるかと思っただけに安心しました。
そういう苦戦もあってようやく常時SSL化できたのです…。
他のページは広告出てもSSL化できてたのにトップだけだめなのは謎でしたが考えても仕方ありません。
SSLプラグインは処理を自動化してくれて便利ですが、前述したとおり、やはり全てがうまく動くわけではありません。
まるで同じように作ってあるページでも問題が起こるページと起こらないページがあったということです。
これはやはりプラグインが100%確実に動くものでないことであり、かといって提供してたさくらインターネットを責めることはできません。
今回の私のように、SSL化が失敗するページには画像の他にも自分のページに入れてるプラグインとか固有の物が原因の可能性が高いです。
その為にはやはり、自力で原因を考える必要が出てくる場面はあります。
酷なようですがあなたの作ったサイトはあなたでしかわからないのですから…。
過去に「http」で登録していたすべての情報を「https」に変更
全ページSSL化でき、リダイレクトも成功してようやく「常時SSL化」となったのですがもう少しだけ作業が残ってます。
そうです、過去に「http」のアドレスで登録してた各種サービスやアフィリエイトなどを手動で「https」に変更しなければなりません。そうしないと本当にやった意味がなくなってしまいます。
面倒ですがこれもSSLの大事な作業に含まれているのでやるしかありません。
ちなみに本ブログは2017年の9月から運営していて、一部のサービスやアフィリエイトもすでに運営側がSSL化に対応していたので直す必要がなかったのもあります。
＜2017年9月半ばに開始した本ブログの場合＞
・Googleアナリティクス→管理画面で「http」を「https」に切り替えるだけ
・Googleアドセンス→広告のコードが「//」から始まってすでにSSL化に対応されてたので広告の張り直しは不要（2017年11月）
・Search Console→新たに「https」用のデータを作る必要あり、さらにインデックスのリクエストも必要
・各アフィリエイト広告→各運営の管理画面で登録したURLを修正
・既に配置しているアフィエイト広告→コードで確認したところパスがSSL化に対応していたので張り直しは不要
常時SSL、完了！
ここまでやればようやくすべて完了です。
工程は長い感じがしますが、問題なく行けば本当に半日くらいで終わると思います。
今回の記事が少しでも参考になっていただければ嬉しいです。
モバイルページをAMP対応し高速表示させるプラグイン「AMP」
サイトやブログのモバイルページをAMP化することでデザインをシンプルにし高速表示を実現できます。
ワードプレスのプラグイン「AMP」をインストールすることで簡単にモバイルのAMP対応ページを生成することが可能となります。(19/02/02)
（記事を読む）
