はてなブログのテーマを「Minimalism」に変更しました

ブログ

はてなブログのテーマを「Blooklyn」から「Minimalism」に変更しました。

「ひつじの雑記帳」のこどみすさんのテーマです。

シンプルで美しいはてなブログの新テーマ「Minimalism」を公開しました。 - ひつじの雑記帳
※当テーマの紹介する際は、テーマ配布ページではなくこの記事のURLを使用してください。 ※追記あり:デザインのアップデートについて+ 元のデザインに戻す方法 当ブログ「ひつじの雑記帳」を開設して間もなく、フラットデザイン風のおしゃれな自作テーマ「Codomisu Flat」を公開しました。 レイアウト的に少し扱いにくい...

前々から変えてみたいと思っていたのですが、やっと実行することができました。

ブログテーマを「Blooklyn」から「Minimalism」へ

はてなブログのテーマは、このブログをはじめて以来、ずっと「Blooklyn」を使っていました。

レスポンシブにも対応していて、とてもいいテーマだったのですが、個人的に次の点が気になっていました。

  • パソコンでみると、記事の横幅が広く感じる
  • スマホやタブレットでみると、画面の端が窮屈に感じる

いろいろ調べながら修正を試みたのですが、レスポンシブ時の切り替え(ブレイクポイント)に癖があるのか、ボックスの組み方なのか、なんかうまくいかない・・・。

こういうのって、気にしだすとすごく気になりますよね・・・。

ブログテーマを変えたらどうなる?

そんなわけで、テーマの変更を考えはじめたのですが、大きな難関がありました。

はてなブログはテーマを変更すると、今までに追加したCSSが全部消えてしまいます。もちろんカスタマイズしたところも、リセットになります。

コードのバックアップをとっておけばいいのですが、万が一、やらかした時のことを考えるとかなり勇気がいります。

そんなわけで「変えたいけれど、怖くて変えられない」状態がずっと続いていたのですが、このままではずるずるいってしまうと思い決心しました。

ついに「Minimalism」に変更

実際にMinimalismに変えてみたら、簡単すぎてびっくりでした。Minimalismは、初期設定がおそろしく簡単です。

作者のこどみすさんのサイトに書いてある通りにやれば、すぐに形ができてしまいます。

そして、前のテーマで気になっていた点もクリアです。

  • 記事の横幅 → ちょうどいい感じに
  • レスポンシブ表示 → ほどよい余白があって見やすい

行間の広さなど、細かい調整はこれからですが、コード貼りも含めて30分ほどで移行ができました。

今までに追加したCSSはリセットされます

さて、問題のCSSですが、やはり今までに追加したCSSは全部リセットされていました。

せっせと追加しなおしていくわけですが、やっていて気づいたことがあります。それは、コードに注釈(コメントアウト)をつけておくのは必須ということです。

たとえば、見出しのサイズを変えるコードなら

/* h4 見出しのサイズ変更  */

といった注釈を常につけるようにしておくと、貼りなおす時にかなり楽です。

また、テンプレートのカスタマイズのコードは、なるべくまとめて書くようにしておくと、区別がつきやすくなります。

まとめ

そんなわけで、Minimalismへの移行が完了しました。行間などの調整はこれからなので、レイアウトが安定するまでに、もうしばらくかかるかもしれません。

それまでは、ぎくしゃくしているところがあるかもしれませんが、ご容赦くださいね。

へなちょこな体験談でしたが、もし迷っている方がいたら、ぜひ参考にしてみてくださいね。

ブログ
スポンサーリンク
yuzumochiをフォローする
この記事を書いた人
yuzumochi
ゆずもちろぐ。の管理人。へんてこなものやかわいいものが大好き。
yuzumochiをフォローする
ゆずもちろぐ。