雑記ブログをやってみる-ひげしげノート

雑記ブログです。日記的なもの、興味のあるもの、買ったもののレビューとか書いたり書かなかったり。

【はてなブログをカスタマイズ】Brooklynの投稿年月日をシンプルにする

f:id:higeshige:20181020005002j:plain

はてなブログ「ひげしげノート」はBrooklynというテーマを使わせてもらっています。

 

どのテーマでもブログを投稿した日付がどこかに表示されるようになっていると思いますが今回はこの投稿年月日の表示をすこしだけカスタマイズしようと思います。

 

現状

Brooklynでは「黒塗りの背景に白文字」ととても強調されたものになっています。

 

f:id:higeshige:20181024002113j:plain

トップページの記事一覧や記事の中でも一番目立つ存在になってるような気がして、気にし出したらもう目立ってしょうがない笑。

 

ここは特に強調させる必要はないけど知りたい項目ではあるので、もう少し目立たなくしたい!

 

カスタマイズ方法

 

背景は周りと同化させて白、文字色は黒に変更してみます。

次のコードを

「デザイン」→「カスタマイズ」→「デザインCSS」

にコピペすれば完了です!

 

/* (記事タイトルの左上の)投稿年月日 */
.date a {
    color: #111111; /*文字色*/
    background: #ffffff; /*背景色*/
    border-radius: 3px; /*角を少し丸める*/
    font-weight: normal; /*文字の太さ*/
}

 

黄色のマーカー部の数値や色を変更して好みの枠にすることができます。

今回は背景色を白にしているので角を丸める表示などは出ません。

 

カスタマイズの結果

文字だけで表現する形になってすっきりしました。

f:id:higeshige:20181024005404j:plain

 

<注意事項> 

ひげしげはHTMLやCSSなどあまり知識のない素人です。そんなやつが、カスタマイズについて書かれているサイトから持ってきて、くっ付けて、ちょっと変えて、を繰り返して作ったものです。ご自分のサイトでもし使う場合はご注意ください。形が崩れたり、機能しないなんてこともあるかもしれません。

 

それと、ひげしげの別のブログを作る時に使ったものなのでどこから頂いたものかもうわからない状態です。悪しからずご了承ください。(判明したものはもちろん紹介させてもらいます!)

 

では!