こんにちは。今日も「まちこの節約日記」にお越し下さり、ありがとうございます。
今月から時間がある時に過去記事のリライトを行っていました。
そのついでに、ずっと気になっていたブログのSSL化も一緒にやってみました。
Contents
重い腰を上げて、ブログをSSL化しました！！
ブログをSSL化しなければいけないことは結構前から知っていたのですが、なんせ機械音痴なので表示が崩れてしまったり、データが飛んでしまったらどうしよう・・・と思って長らく放置していました。
そもそもやり方がよく分からなかったし。こんな雑記ブログ、SSL化してなくても大丈夫でしょ？なんて思ってたんですよね。
でも、過去記事を修正しているとアドレスバーに赤字で警告マークが付くではないか！？この赤字がすごく気になるんですよ。
過去記事を修正した後にSSL化するぐらいなら、SSL化してから修正した方が二度手間にならなくていいんじゃないかなと思いやってみることにしました。
ブログをSSL化するために行ったこと
いざブログのSSL化へ！といっても、やり方が良く分からないので、そこはもちろん先人の知恵をお借りします。
実際に行った手順はこちら。
記事のバックアップをとる
このブログは、はてなブログなので記事のバックアップは、
管理画面の設定＞詳細設定＞エクスポート＞記事のバックアップと製本サービス
を選んで、ダウンロードします。
非公開でテストブログを作る
一応、何かあったときのために、ダウンロードしたデータを使ってテストブログも作っておきました。
画像や自分でカスタマイズした箇所も同じになるように。
HTTPS化のボタンを押す
事前にブログや記事の内容を修正している方もいましたが、このブログは2017年5月～はじめているので、大幅な修正はいらないだろうと考え（先にいろいろ直すより、やってみた方が早いじゃん！）、思い切ってHTTPS化のボタンをポチッと押しました。
場所は、管理画面の設定＞詳細設定＞HTTPS配信＞HTTPS配信の状況を確認する
に進み、「変更」をクリックします。
これを押したら、もう元に戻すことはできません。
SSL化するのは簡単。でもそこからが大変です。
混在コンテンツの修正。エラーになっていたのはトップ画面の画像だった。
ボタン一押しでSSL化しましたが、そこからが大変です。
見た感じブログの表示が崩れたり、リンクが飛ばなかったりということはなかったのですが、このブログの場合は、最初から『保護された通信』と出ませんでした。
混在コンテンツの修正
混在コンテンツがあると『保護された通信』にならないので、まず思い当たるところを修正しました。
管理画面のデザイン＞スパナマークで、
自分でカスタマイズしている、
・ヘッダ
・記事
・サイドバー
・フッタ
・デザインCSS
を見て、http→httpsに変更する作業をしました。
ただ、作業を夜中にやったので、sを付けたつもりが抜けている所が結構あったようで、「全然🔓マークがつかない！」と泣きそうでした。
トップ画面の画像が混在コンテンツの原因だった
混在コンテンツを調べるために、Google chromeで調べたいページの所で右クリック→検証→Consoleでエラーがないか確認しました。
結局、昨日の夜には混在コンテンツが見つけられなくて、今朝子供たちを見送ってから発見しました。
このブログの場合、トップ画面の画像がエラーになっていたようで・・・もう一度画像を読み込んでやっとSSL化ができました！！
ついでに、画像の横幅も揃ってうれしいです。なぜ今までできなかったんだろう！？
あとは、
・Google Analytics
・Google Search Console
・登録しているASP
の設定を変更して終了です。
まとめ
もう『保護された通信』の文字は見れないんじゃないかなと途中で諦めそうになりましたが、なんとか終わって良かったです。
私の場合、内部リンクをたくさん貼っていたり、ブログ村のリンクもありましたが、その辺は結局何もしなくても大丈夫でした。ブログカードも変更不要でした。
過去記事もいくつか見ましたが、ちゃんと🔒マークがついていたので大丈夫だと思います。（もし出てきたら都度修正します）
時間はかかったけれど、年内に終わらせることができてすっきりです。
これからも「まちこの節約日記」をよろしくお願いいたします。