ブログのデザインを大型カスタマイズしました!

f:id:quietplace_1:20200208030837p:plain

 今回は変更した点などを紹介します。

カスタマイズ

テーマの変更

今回はHaruniというテーマを使用させて頂きました。

今回変えた目的はカテゴリーページが気に入ったのとヘッダー画像とグローバルメニューの位置がいい感じだったからです。

テーマを変更する場合は必ずCSSのバックアップと取っておきましょう。

ヘッダー画像を横幅いっぱいに表示

デフォルトの状態でははてなブログのヘッダーは小さく表示されてしまいます。

f:id:quietplace_1:20200208040137p:plain

この記事を参考にして隙間を消しました。

かなり見た目がよくなりましたね。

f:id:quietplace_1:20200208041313p:plain

 グローバルメニューの設置

ヘッダー画像の下の部分ですね。
テーマを使わせていただいたHaruniのデモブログにグローバルメニューの設置方法の記事があったので全く同じものを使わせて頂きました。

PC
スマホ

f:id:quietplace_1:20200208044934g:plain

カラーを単色に

背景色のカスタマイズは「デザイン→カスタマイズ→背景色」でカスタマイズできます。

それ以外の色をカスタマイズするにはこちらを見てください。

フォントと文字の大きさを変更

フォントは游ゴシックにして大きさはは16pxに設定しました。

やりたい方はこちらを参考に↓

まとめ

基本的にはてなブログは普通のHTMLやCSSと同じなんですが少し特殊な所がありますね...

もう少し勉強してできるだけ自力でカスタマイズしたいですね!