ミセスGのブログ

海外ドラマ&映画の感想をパンピー視点で書いている国際結婚&アメリカ在住キョドラーのブログです。

はてなブログがついにHTTPS配信!HTTPS化を有効にして生じたトラブルも紹介

f:id:oclife:20180615092008j:plain

はてなブログも、ついに独自ドメインでHTTPS配信ができるようになりました。

結局、1年かかりましたね。あと数か月するとChromeなどでは「このサイトは保護されていません」表示がされてしまうようなので、ギリギリセーフでした。

これではてなブログ独自ドメインの方たちも、HTTPS化できます。

善は急げ、さっそくHTTPS化してみました。

 

はてなブログHTTPS化

HTTP化するまでにした準備

HTTPS化に備えて、去年のうちに大体のことは済ませておきました。

お世話になったのは、こちらのサイト様です。

www.notitle-weblog.com

 

HTTP化

私はすぐに飛びついてしまったのですが、こちらのサイト様が参考になります。

特に、はてなブログのシェア数をカウントさせている方は必見です。

blog.minimal-green.com

 

サーチコンソールとGoogleアナリティクスへ反映させる方法

HTTPS化した後、サーチコンソールとアナリティクスにも反映させます。なお、アドセンスの設定はよほど前に設置したのでなければ不要だと思います。

アフィリエイトリンクなども、一応確認して下さい。(2016年の春以降のものは張り替えなくても大丈夫でした。)

nelog.jp

junichi-manga.com

 

実際に実装してみた

実装してみたところ…

サイトのレイアウトが大幅に崩れました。

スクリーンショットを取っておらず、崩れ具合が披露できないのが残念です。

崩れ具合は相当なもので、トップページのカード表示が一覧式になっていたり、ブログのタイトルが左端の方にいってたり、サイドバーが下の方にいってたり、とにかく原形を留めていません。

しっちゃかめっちゃかでした。

もちろん、いちどHTTPS化すると戻りません。

なかばパニック。

うーむ…これは…いちからサイトデザイン作り直しか…

という思いから、改めて同じテンプレートをインストールし直しました。(ダッシュボードから)

すると…

戻った!

ホ~ッ

あとはグローバルメニューのリンクなど、まだhttpになっているところをhttpに全部変えて終わりです。

 

Noto Sans JPフォントが効かない時

私の現在使っている美しいフォントはNoto Sans JPなのですが、https化した後、これが効かなくなりました。

ダッシュボードでデザインを変更している画面には反映されるのですが、実際にサイトを開いてみるとどうしても反映されません。

Noto Sans JPのインポート元のhttpをhttpsにしたり、httpを消してみたり、いろいろ試しましたがどうしても反映できず、試行錯誤すること1日…

どこかのサイトで、コードの上にコメントアウトがあると効かないことがあるというのを知りました。私の場合、Noto Sans JPの上にテンプレートのコードがあって、そこにコメントアウトがありました。

試しにNoto Sans JPのcssコードを一番上にしてみたら、Noto Sans JPが戻りました。

参考までに。