H2 Transmission

本・漫画・資格・PC・自分用メモなどを書く雑記ブログ

はてなブログのデザインを変更して少しだけカスタマイズをしてみた。その1

blog

はてなブログのカスタマイズについて、いろんなブログを見ていたら変えてみたいテーマがありました。

今までは「Brooklyn」を使っていて、シンプルなデザインで気に入っていました。

 ですが、今回ちょっとした理由があってカスタマイズできるか調べていたら、今使っているテーマ「Naked」に出会いました。

調べてみたらカスタマイズがし易いということを書いている人が多かったのでさっそく採用してみました。

Nakedをカスタマイズするために参考にしたサイトをまとめてみました。

 BrooklynからNakedに変えた理由

今まで使っていたテーマは「Brooklyn」でした。

f:id:yumeoimusi:20161103002403p:plain

これもシンプルでかっこいいのでオススメの1つです。

変えた理由ですが、ヘッダーに配置するナビゲーションに記載できるカテゴリが5つまでだったためです。

実際、表示できるカテゴリを増やしたいなと調べていた時に、今使っている「Naked」のテーマの使いやすさを知りテーマ変更に至りました。

あと1つありまして、フッターにもカスタマイズした情報を載せることができるのも魅力的でした。

デザインのカスタマイズで参考にしたサイト

 この記事を書いている段階では、まだ少ししかカスタマイズしていないです。

カスタマイズした項目は以下の通りです。

ヘッダーにナビゲーションを追加

フッターにツイッタータイムライン、注目記事の追加

フォローボタンの追加

・見出しのデザイン変更

・文字に蛍光マーカー下線

まだこれだけしかしていないですが、それだけでも結構満足です。

実際にカスタマイズにかかった時間も実質30分くらいです。

初心者でもすぐに参考サイトがあるのでできるかと思います。

まず、この「Naked」のテーマを作成している作者さんのブログを参考にしました。

このサイトを見れば、ナビゲーションとフッターの追加は簡単に出来ました。

theme-naked.hatenablog.jp

続いて、フォローボタンの追加です。

www.ituore.com

見出しのデザイン変更

www.yukihy.com

文字に蛍光マーカー下線

darie-daphnia.hatenablog.com

文字に蛍光マーカー下線はCSSに貼り付けるというやり方を紹介しているサイトもあります。なぜか私はその方法ではうまく反映されなかったのでこちらのやり方でカスタマイズしました。

最後のまとめ

カスタマイズをするのは楽しいと改めて実感。

カスタマイズするとブログを書くやる気がでますね。

ただカスタマイズばっかりしていないでしっかりとブログを更新することをメインにしなければいけないですね。