debate.co.jpをWordPress2013年新テーマ、Twenty Thirteenに変更(ちょっとカスタマイズ)しました。

debate.co.jpをWordPress2013新テーマ、Twenty Thirteenに変更しました。

毎年リリースされるWordPressのデフォルトテーマですが、今年の2013年はTwenty Thirteenです。

レスポンシブデザインを採用し、フラットデザインになっていますね。シンプルで使いやすそうです。

Twenty Thirteenは基本的にはシングルカラムで利用することを想定しているようですが、副ウィジェットエリアにウィジェットを入れると2カラム(右にウィジェット)になります。

フォーマットを変更することで記事一覧の背景色、文字色を変えることができますが、debate.co.jpではCSSをいじって順番に表示するようにしました。

参考までに。

[css]#content article:nth-child(6n+1){
background-color: #FFF;
}

#content article:nth-child(6n+1) a{
}

#content article:nth-child(6n+2){
background-color: #FBCA3C;
}

#content article:nth-child(6n+2) a{
color: #722D19;
}

#content article:nth-child(6n+3){
background-color: #722D19;
color: #fff;
}

#content article:nth-child(6n+3) a{
color: #fff;
}

#content article:nth-child(6n+4){
background-color: #DB572F;
}

#content article:nth-child(6n+4) a{
color: #fff;
}

#content article:nth-child(6n+5){
background-color: #210D10;
color: #fff;
}

#content article:nth-child(6n+5) a{
color: #fff;
}

#content article:nth-child(6n+6){
background-color: #EADAA6;
}

#content article:nth-child(6n+6) a{
color: #fff;
}[/css]

あとは、フォントが日本語には合わないので、適当にフォント指定したほうが良いと思います。

[css]

html, button, input, select, textarea,
.site-description,
h1, h2, h3, h4, h5, h6,
.widget .widget-title
{
font-family: Helvetica,Arial,"Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3","Meiryo","メイリオ",sans-serif;
}

[/css]

シンプルで良いですね。