このブログの
『記事の見出し(題)』と『記事』の境目が、
分かりづらく、フォントサイズも似ていて、
区別がつきにくかった為、
カスタマイズした。
ネットで検索をかけて、
いろんな方のブログや記事を参考に、
無事カスタマイズできたが、1~2時間くらいかかった。
方法は、『デザインCSS』にコードを打ち込んで、
『背景色』とか『フォントサイズ』を変更させるが、
全く経験のない初心者だったのでとても苦労した。
このようなプログラムは、
大昔に(20年くらい前に)『VB6.0』を少しかじった程度だった。
(今は分かる人は少ないと思うが。)
『デザインCSS』の場所は、
はてなブログ
↓
ダッシュボード
↓
左サイドバーの『デザイン』
↓
真ん中のスパナのマーク『カスタマイズ』
↓
一番下、高度な設定『{}デザインCSS』
記事の見出し(題)の部分は『h1』を指定すればいいらしい。
実際のコードはこうなる。
h1 {
background: #87cefa; /*背景色*/
padding: 0.5em;/*文字周りの余白*/
border-radius: 0.5em;/*角の丸み*/
font-size: 25px !important;
}
しかし、
これを記入すると『記事の見出し(題)』のほかに、
『ブログのタイトル』までも同じようにカスタマイズされてしまう。
つまり、『h1』は『記事の見出し(題)』と『ブログのタイトル』両方含まれている。
そこで、『h1』の後に次のコードを追加する。
h1.entry-title {
background: #87cefa; /*背景色*/
padding: 0.5em;/*文字周りの余白*/
border-radius: 0.5em;/*角の丸み*/
font-size: 25px !important;
}
このentry-titleを追加すれば『h1』の中の、
記事の見出しの部分だと指定できる。
上記変更で、このブログのような記事の見出し(題)の背景を『水色』に変更できた。
ネットを調べても、
このような『記事の見出し(題)』だけ変更するやり方が見つからなかったのでブログにしてみた。
※ブログページを右クリックして出るメニューの一番下
『開発者ツールで調査する』を開いて、手探りで調べた。
あくまで、無料版はてなブログの仕様に起因する問題だとは思うが。
無料版はてなブログで記事の見出し(題)のみカスタマイズしたい場合の方法でした。