はてなブログがhttps対応しました。
当ブログもさっそくhttps化しましたが、一部正しく表示されていない箇所があることに気づきました。
テーマストアで配布されているテーマ「Simple Gray」を使っている人で同じ症状の人は後述の方法で直せるはずです。
症状：アイコンが文字化けする
上の画像のように、アイコンが文字化けしています。白くて四角いので豆腐と呼ばれたりします。他の場所でもアイコンが同じように化けていました。
httpのときはこのように表示されていた。
対処方法：FontAwesomeのCSSを読み込む設定を追加する
文字化けはFontAwesomeというアイコンフォントの読み込みがうまく行っていないのが原因なので、読み込む設定を追加すればOKです。手順は以下のとおり。
※ Simple Grayは「CC BY-ND 2.1 JP」というライセンスが適用されており、改変は禁止されています。テーマを書き換えるような対処はやめましょう。本記事の方法はSimple Grayそのものは一切改変しません。
変更手順
１. 「設定」→「詳細設定」と進んで
２. ページ真ん中より下の「headに要素を追加」というところに下記を追加。
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
３. 最後にページ最下部の「変更する」ボタンをクリック。
ブログ削除リンクを押さないように気をつけようね☆
おわりに
「Simple Gray」利用時にhttps化して文字化けが発生した場合の対処方法でした。「Simple Gray」で「http」が指定されているのはここだけなので、https化しても他の不具合はなさそうですが、もし見つけたらまた追記します。できればテーマの作者様が直してくれるとうれしいのですけどね。とてもキレイなテーマなのでこのまま使いたいと思います。
