「夜空」テンプレートのカスタマイズ（12）…カウンターが読みにくいんだが

このブログのデザインカスタマイズねた。お気づきだろうか……。先週、ちょっとだけ色を変えてみました。

このブログで使っている「夜空」テンプレートはデフォルトではこんな感じなんだけど、右上にあるカウンターがひじょーに読みにくいのですよ。なんでこんな配色になっているんだろう。カウンターの数字を白フォントにしてくれればいいのに……。

しかし、カウンターは画像で表示しているため、ユーザ側で色を変更することはできないようだ。ならば背景色を明るい色に変えられないか。やってみると簡単でした。

ソースを見ると、カウンター周りはこんなタグで規定されているらしい。

<p id="counter">

オリジナルのＣＳＳで相当する箇所を探してみるとありました。

#counter{
text-align:right;
padding:2px 5px;
background:#425170;
border-bottom:1px solid #061333;
}

background の色指定を変更すればよし。

/* カウンターを見やすくする薄群青 */
#counter{
text-align:right;
padding:2px 5px;
background:#5383c3;
border-bottom:1px solid #061333;
}

ＣＳＳカスタマイズの設定で、コードの一番最後にこちらを追加しておけば、デフォルトの指定を置き換えて読んでくれます。

私はカラーコーディネートってのが苦手でして、いつも色使いをなかなか決められません。原色大辞典の色見本で「Web216」→「洋色」→「和色」と徘徊して、試行錯誤した末、とりあえず「薄群青 #5383c3」に設定しました。

あんまり明るすぎると「帯」が主張しすぎるし、暗すぎては結局カウンターが読みにくい。このあたりが落とし処かと。

ようやく長年（十年以上である）の懸案が解消しました。

（6/11追記）
うまくいったと思ったら、6月下旬のウェブリブログリニューアルでアクセスカウンター表示機能終了だってよ！

→ ランキングを見る（にほんブログ村 オペラ 人気ランキング）
→ ランキングを見る（クラシック情報サイトボーダレスミュージック）