Brooklyn-カスタマイズ

はてなブログのテーマ【Brooklyn】のカスタマイズ集

Brooklyn-カスタマイズ

【はてなブログ】文字のサイズを変更してみる

【スポンサーリンク】

f:id:yakuzari:20200430001023j:plain
 

今回はブログ記事のあらゆる文字の大きさの変更についてまとめてみます!

本文や見出しなどなど、、

ご自分のブログでサイズを変更したい箇所があれば自分好みにカスタマイズしてしまいましょう!!

はてなブログ各テーマでのデフォルトの文字サイズ

はてなブログには多数のテーマが用意されていますが、まずは主なテーマのデフォルトの文字サイズを調べてみました。

Minimalism→15px
Brooklyn→16px
Haruni→16px
UnderShirt→16px
Innocent→16px
SOHO→16px

※記事執筆時点で、テーマストアにて「人気テーマ」として紹介されているテーマを対象に調査しました。

だいたいのテーマは16pxですが、「Minimalism」だけが15pxという結果でした。

はてなブログに適した文字サイズは?

あくまで一つの参考程度ですが、Googleさんはこのようにおっしゃっています。

Googleの提唱するフォントサイズは16px
引用元:モバイルフレンドリー対応_GoogleとAppleの推奨フォントは?

どうやら16px以上を推奨とのこと。

これを踏まえると

16px以上であり、かつ人間の目からして読みやすいサイズ

が最適サイズと言えます。

人間は一人一人感性が違うので、少なくても自分が見て読みやすいサイズを設定してあげればよいと思います。

はてなブログでの文字サイズの変更の仕方

これはもう簡単です!

下のコードをコピーして

ダッシュボード→デザイン→カスタマイズ(スパナマーク)→デザインCSS

に貼り付けてください。

/*フォントサイズ*/
.entry-content p {font-size: 16px;}

16と書いてあるところで文字サイズを指定することが出来ますので、自分が考えた適切な数字に入れ替えてあげましょう!
(ちなみに、当ブログは16pxで書かれております)。

はてなブログで記事本文以外の文字サイズの変更の仕方

余談ではありますが、上記と同じようなやり方で見出しタグ(h2やh3)の文字サイズの大きさを変更できます。

貼り付ける場所は

ダッシュボード→デザイン→カスタマイズ(スパナマーク)→ヘッダ→タイトル下になります。

コードはコチラ↓

<style type="text/css">
.entry-content h2 {font-size: 20px;}
</style>

上記で示したコードのh2の部分をh3やh4に変更すると、それぞれh3とh4の見出しタグの文字サイズを変更することが出来ますよ!

意外と知られていないカスタマイズかと思いますので要チェックです。