雑記

はてなブログをHTTPS化したので準備や方法「やること」をまとめておく。

スポンサーリンク

どうも。しまふくろーです。


この度、当ブログをHTTPS化しましたー!!


まあ簡単にいうとセキュリティ対策をしましたってことで、より安全に当ブログをみなさまに見ていただけるという。。


作業に当たった準備とか、付帯作業的なところがあったので色々晒していきます!

f:id:daimaru-side:20181224213142p:plain

Contents

HTTPS化のためのやること

はてなブログをHTTPS化するに当たって、実は色々と準備とかが必要なのでリストアップしてみます。


[はてなブログの作業]

  1. ブログのバックアップをとる。

  2. ブログ設定のバックアップをとる。

  3. はてなブログをhttps化する

  4. リンクを手動でHTTPS化

[Google 分析ツールの作業]

  1. Google Search Consoleの設定を変更

  2. Goolge Analyticsの設定を変更する

実ははてなブログのHTTPS化自体はボタン一つで完了できます笑


ただ、リンク切れになったり、デザインレイアウトが崩れてしまったりと色々とトラップがあるらしいです。


そのあたりの対策をしたりとかの付帯作業がめんどいのです。。


しかも結構時間がかかることがあるので、まとまった時間が取れるタイミングでの作業をおすすめします。

はてなブログの作業

では手順を一つずつみていきます。

1. ブログのバックアップをとる。

HTTPS化をする前に必ずバックアップを取りましょう


「はてなブログをHTTPS化する」というか、ブログ全体に変化が生じる(影響が大きい)設定なんかを行う場合はバックアップです!

方法はこんな感じです。


①管理画面の左にあるメニューから[設定]を選択


②[設定]画面の上側のメニューから[詳細設定]を選択


③画面下側にスクロールしていき、[エクスポート]の[記事のバックアップと製本サービス]を選択し、エスクポートを実行


④[ダウンロードする]ボタンでバックアップデータを取得する。

f:id:daimaru-side:20181223083736p:plain
はてなブログのバックアップ(エクスポート)の方法①

f:id:daimaru-side:20181223084808p:plain
はてなブログのバックアップ(エクスポート)の方法②




とりあえずブログ本体のバックアップはこれでOKです。

2. ブログ設定のバックアップをとる。

ブログ設定というのはCSSデザインとか、記事上や記事下の設定のことを指します。


(私が勝手に指しています。)


はてなブログのデザイン周りは先のバックアップデータをダウンロードする手順ではバックアップできないので、別途バックアップをしておく必要があります。


今回はテキストデータとしてコピーしておくだけです。


方法はこんな感じです。


①管理画面の左にあるメニューから[デザイン]を選択し、「レンチ」マークを選択


②管理画面の左にあるメニューから[デザインCSS]などを選択し記載内容をコピー、テキストファイルにペーストして保存


(同じように記事上、記事下などの設定も必要に応じて保存)

f:id:daimaru-side:20181223091657p:plain
CSS設定のバックアップ

3. はてなブログをhttps化する

バックアップもしっかり取れたところで、いよいよHTTPS化しましょう!


手順は簡単です。


管理画面の左にあるメニューから[設定]→[詳細設定]を選択します。


①HTTPS設定の部分のリンクをクリック


②HTTPS配信の状況に右にある[変更する]ボタンをクリック


③HTTPS配信が有効になっているか確認


変更したら元に戻せませんよー的な注意が出てきますが、そのためのバックアップです。


断固たる決意で進めてください。


処理に数分かかりますが、コーヒーでも飲んでのんびり待ちましょう。

f:id:daimaru-side:20181223093926p:plain
はてなブログをHTTPS化する

処理が終わったらHTTPS設定が有効になっているか確認しましょう。

f:id:daimaru-side:20181223114525p:plain
HTTPS配信の設定確認

4. リンクを手動でHTTPS化

最後にリンク周りの設定です。


この作業がアホみたいに面倒で時間がかかります。


リンク先がHTTPなっているとかJavaScriptのライブラリ読み込み元がHTTPになっているところを探して「http」を「https」に変えていきます。

片っ端から下のように書き換えます。

/* before */
/*@import url("http://hatenablog.com/theme/000000000000000000.css");*/
/* after */
@import url("https://hatenablog.com/theme/000000000000000000.css");

http → httpsで大丈夫です。

(きちんとバックアップとってかから作業してね!)

Google 分析ツールの作業

はてなブログの方は上記でOKですが、ブログを書いている方は大半Googleの分析ツールを利用していることでしょう。


これも設定変更が必要です。

Google Search Consoleの設定を変更

Google Search Consoleの設定はhttpのサイトとhttpsのサイトを完全に別物として再登録する必要があるみたいです。


こちらの記事で詳しく書かれているのでご参照ください。

サイトのHTTPS化で必要となるGoogleサーチコンソールの再登録方法

Goolge Analyticsの設定を変更する

Goolge Analyticsの方も設定を変更する必要があります。


(もう少しで終わりですよ!)

①Goolge Analyticsの[管理]メニューを開く


②Goolge Analyticsの管理メニューの[プロパティ設定]を選択する



③デフォルトのURLから[https]を選択する

f:id:daimaru-side:20181223165231p:plain
Google Analyrics管理 >> プロパティを選択

f:id:daimaru-side:20181223165340p:plain
デフォルトのURLを設定

これでひとまず完了です!


お疲れ様でした。。。。

終わりに

https設定については実際「まだいらんやろ」とかすごく甘ーーーーい!!!ことを考えていたのですが、セキュリティ対策はこれからの時代必須ということで実行に移しました。


セキュリティ周りのリテラシーはなんやらかんやら。。。


嘘です。

f:id:daimaru-side:20181223165905p:plain
Google Adsenseの最適化案

大雑把にいうと、「Https対応したらちょっと優遇してやるよ」との神からのお告げがあったのでやりました。


幸い(?)にも当ブログにはリンク周りの設定が必要な部分が少なかったのでそんなに作業時間はかかりませんでした。


ですが、この部分の作業量によってかなり作業時間が変わってきます。


「自分はそんなにリンクとかないし大丈夫」と、確信を持って言える人以外
は、休日などでまとまった時間を確保して作業するのがおすすめです。



Google神からのお告げなので早めに対応しておきましょうね。。。



それではまた。


しまふくろー

スポンサーリンク
スポンサーリンク

COMMENT

メールアドレスが公開されることはありません。 が付いている欄は必須項目です