はてなブログのテーマを「Blooklyn」から「Minimalism」に変更しました。
「ひつじの雑記帳」のこどみすさんのテーマです。
前々から変えてみたいと思っていたのですが、やっと実行することができました。
ブログテーマを「Blooklyn」から「Minimalism」へ
はてなブログのテーマは、このブログをはじめて以来、ずっと「Blooklyn」を使っていました。
レスポンシブにも対応していて、とてもいいテーマだったのですが、個人的に次の点が気になっていました。
- パソコンでみると、記事の横幅が広く感じる
- スマホやタブレットでみると、画面の端が窮屈に感じる
いろいろ調べながら修正を試みたのですが、レスポンシブ時の切り替え(ブレイクポイント)に癖があるのか、ボックスの組み方なのか、なんかうまくいかない・・・。
こういうのって、気にしだすとすごく気になりますよね・・・。
ブログテーマを変えたらどうなる?
そんなわけで、テーマの変更を考えはじめたのですが、大きな難関がありました。
はてなブログはテーマを変更すると、今までに追加したCSSが全部消えてしまいます。もちろんカスタマイズしたところも、リセットになります。
コードのバックアップをとっておけばいいのですが、万が一、やらかした時のことを考えるとかなり勇気がいります。
そんなわけで「変えたいけれど、怖くて変えられない」状態がずっと続いていたのですが、このままではずるずるいってしまうと思い決心しました。
ついに「Minimalism」に変更
実際にMinimalismに変えてみたら、簡単すぎてびっくりでした。Minimalismは、初期設定がおそろしく簡単です。
作者のこどみすさんのサイトに書いてある通りにやれば、すぐに形ができてしまいます。
そして、前のテーマで気になっていた点もクリアです。
- 記事の横幅 → ちょうどいい感じに
- レスポンシブ表示 → ほどよい余白があって見やすい
行間の広さなど、細かい調整はこれからですが、コード貼りも含めて30分ほどで移行ができました。
今までに追加したCSSはリセットされます
さて、問題のCSSですが、やはり今までに追加したCSSは全部リセットされていました。
せっせと追加しなおしていくわけですが、やっていて気づいたことがあります。それは、コードに注釈(コメントアウト)をつけておくのは必須ということです。
たとえば、見出しのサイズを変えるコードなら
/* h4 見出しのサイズ変更 */
といった注釈を常につけるようにしておくと、貼りなおす時にかなり楽です。
また、テンプレートのカスタマイズのコードは、なるべくまとめて書くようにしておくと、区別がつきやすくなります。
まとめ
そんなわけで、Minimalismへの移行が完了しました。行間などの調整はこれからなので、レイアウトが安定するまでに、もうしばらくかかるかもしれません。
それまでは、ぎくしゃくしているところがあるかもしれませんが、ご容赦くださいね。
へなちょこな体験談でしたが、もし迷っている方がいたら、ぜひ参考にしてみてくださいね。