30代からの5万円貯金とブログ運営

毎月5万円貯金とブログ運営を始めた33歳

ヘッダーの高さを調整!タイトル画像無しの場合【はてなブログ】

☑️はてなブログのブログテーマHaruni(はるに)をインストール中

☑️ヘッダータイトル画像は、使わずブログタイトル(文章)のみのカスタマイズをしていきます!

ヘッダーの高さを変更

f:id:macromake:20180717230916j:plain
▲今回は、ヘッダーの高さを変えていきます!画像は、トップページではなく記事ページなので、パンくずリストが表示されています。


ヘッダーの高さ150px

f:id:macromake:20180717231232j:plain
▲ヘッダーの高さを150pxに変更してみました。ブログタイトルと説明文の間が広く感じます。
タイトルと説明文の文字数やフォントサイズによってお好みのヘッダーの高さにして下さい。


ヘッダーの高さ90px

f:id:macromake:20180717231522j:plain
▲ブログタイトルも説明文も短いので、90pxにすると見やすくなりました!

ヘッダーの幅の変え方

akiueo.hatenablog.com
▲こちらのブログを参考にさせていただきました。


【やり方】
🔽ダッシュボード
🔽デザイン
🔽カスタマイズ(🔧←こんなマーク)
🔽デザインcssにコードをコピペ
※上記ブログの「cssでヘッダー下の空白を消す」のコード
🔽pxの前の数字を変更して好みの高さにする
🔽保存を変更して完了!


参考にさせていただいたブログでは、タイトル画像を使用していましたが、ブログタイトルのみでも余白や空白の部分を無くしたり、高さを変更するのは、同じ方法で良さそうです。


最後までお読みいただきありがとうございました!