スポンサーリンク

wordpressでカレンダー2

http://www.geekzshu.com/wordpress/210

http://wp-simplicity.com/custum-calendar-css/

http://morgenrot.jp/senseofwonder/post-1338/

の通りに、外観 → Theme Options → Other の、Custom CSS にはりつけたところ、ほぼうまくいったが、まだ、登校日の日付がうまく反転してくれない。デフォルトで下線をひいてくれるだけでもよいのだが、、、

—-

探しているうちに、こんなサイトが見つかった。面白い。

http://manabic.net/idea/juku

—-

おっと、わき道にそれた。カレンダーに戻る。

魅せるブログデザイン

【「スィート」スキンのカレンダーの装飾を変更する方法】

http://ameblo.jp/amecustom/entry-10393113795.html

やっとみつかったか!?

(引用ここから)
—-

#calendar table td a { /*記事投稿のある日*/
color:#FFFFFF; /*記事投稿のある日の文字色*/
background-color:#0099FF; /*記事投稿のある日の背景色*/
text-decoration:none; /*記事投稿のある日の下線を消す*/
display:block;
}
#calendar table td a:hover {/*マウスオーバー*/
background-color:#0066CC; /*背景色*/
}

—-
(引用ここまで)

これを真似して、少し変更

—-

#wp-calendar table td a { /*記事投稿のある日*/
background-color: #333;    /*記事投稿のある日の背景色*/
color: #fff; /*記事投稿のある日の文字色*/
display: block;
}
#wp-calendar table td a:hover { /*マウスオーバー*/
background-color: #707070; /*背景色*/
color: #fff;
}

—-

これを、上記の子テーマに追加。

(外観 → Theme Options → Other の、Custom CSS にはりつけ)

→ ダメだった。。。

悔しかったので、ダメもとで少し変更

—-

#wp-calendar tbody tr a {
background-color: #333;
color: #fff;
display: block;
}

—-

できた!

image

もう、これ以上、外観にはこだわらないつもり。

最近は、ブログを見る端末の半分以上がスマートフォン、タブレットらしいので、レスポンシブデザインは必須と思う。むしろ、スマホあたはタブレットから見たデザイン優先でもよいかもしれない。

ブログは内容がすべて。内容を追加しなければ。。。

スポンサーリンク