きれいなトップページが簡単に作れるのがウリのWordPressテーマ【OnePress】。でも、投稿や固定ページを表示する際にサイドバーありに設定すると、本文・サイドバーともちょっと狭いなぁと感じませんか？？
最近のWordPressテーマ（というかHTMLや他のCMSで作られたサイトも含めて）は本文・サイドバー含めたサイト幅は1200px前後がトレンドだと思います。それに比べ、デフォルトでの【OnePress】のサイト幅は960pxとちょっと狭いんです。
そこで今回は、サイト幅を1260pxにして、ちょうどいい感じにするコードを紹介します（コードは右サイドバーの場合です）。
紹介するコードをテーマのCSS末尾またはテーマカスタマイザーの「追加CSS」へ追記するだけですので、簡単にカスタマイズできます（テーマのCSSへ追記する場合は子テーマの利用をおすすめします）。
※今見ていただいているページはコード適用済です。結構余裕ができているのが確認いただけるかと思います。
それでは早速、追記するコードは以下になります。
/***** ↓サイト幅を広げる＆サイドバーを広げる *****/
/***** パソコン表示時のサイト最大幅 *****/
@media (min-width: 992px){
.container {
width: 1260px;
}
#content-inside {
width: 1260px;
}
}
/***** 本文の割合を指定 *****/
@media screen and (min-width: 940px){
.right-sidebar .content-area {
width: 68%;
padding-left: 20px;
padding-right: 20px;
}
}
/***** サイドバーの割合を指定しつつ最低幅を指定 *****/
@media screen and (min-width: 940px){
.sidebar {
width: 31%;
}
}
/***** サイドバー左のパディング調整 *****/
@media screen and (min-width: 940px){
.right-sidebar .sidebar {
padding-left: 20px;
}
}
/***** サイドバーウィジェットのタイトル *****/
@media screen and (min-width: 940px){
.sidebar .widget .widget-title {
font-size: 1.2em;
letter-spacing: 0;
margin-bottom: 13px;
margin-top: 13px;
}
}
/***** ↑サイト幅を広げる＆サイドバーを広げる *****/コードの簡単な説明をしておくと、
２行目の「パソコン表示時のサイト最大幅」というコメント以下で本文＋右サイドバーの幅を1260pxにしています。
そして、このテーマはその幅に対する割合で本文とサイドバーの幅を指定していますので、本文とサイドバーの横の隙間を調整しつつ、それぞれの割合を決めています。
この変更によってサイドバーウィジェットのタイトル部分の文字の大きさが不自然になってしまうので、「サイドバーウィジェットのタイトル」以下で文字サイズを大きくしています。
また、これらがパソコン表示時にのみ適用されるよう、メディアクエリというのを使って画面幅が940px（サイト幅のみ992px）よりも大きい場合という限定をしています。