カスタム

Most Viewed Posts

【WordPress】Twenty Twelveで記事枠を付ける方法!

【WordPress】Twenty Twelveで記事枠を付ける方法!

WordPressを知識ゼロから使い始めて半年の+yamaguroです!私はWordpressのデフォルトテーマ「Twenty Twelve」を利用しているのですが、そのまま使うとちょっと質素に見えてしまいます。なので、今回は記事欄(左側)とウィジェットエリア(右側)を枠で囲いました。

Page structureで変更できる

他のテーマは知りませんが、Twenty TwelveではCSSの”Page structure”という項で色々いじれるようになっています。記事枠を付けたりするにはここを変更してあげればOKです。
[css]/* Page structure */
.site {
padding: 0 24px;
padding: 0 1.714285714rem;
background-color: #fff;
}
.site-content {
margin: 24px 0 0;
margin: 1.714285714rem 0 0;
}
.widget-area {
margin: 24px 0 0;
margin: 1.714285714rem 0 0;
}
[/css]

と記述された場所を
[css]
/* Page structure */
.site {
padding: 0 24px;
padding: 0 1.714285714rem;
/* background-color: #fff; */
background-color:#ffffff
}
.site-content {
margin: 12px 0 0;
margin: 0.857142857rem 0 0;
padding: 12px;
padding: 0.857142857rem;
border: 1px solid #ddd;

}
.widget-area {
margin: 12px 0 0;
margin: 0.857142857rem 0 0;
padding: 12px;
padding: 0.857142857rem;
border: 1px solid #ddd;
[/css]
と書き換えると、記事とウィジェットエリアに枠が付きます。paddingは適当に設定したのでお好みでどうぞ。

Return Top