ワードプレステーマTwentyElevenのサイト全体の横幅(サイズ)を変更する方法です。

無料ブログを経験している方ですとなおさらですが、ワードプレスのデフォルトテーマって結構横幅が広く大きく感じますよね?そうでもないですか?

まぁ、その人が見慣れているサイトやブログにもよるのでしょうけど、もチョッとだけ幅を狭くしたいかなぁ?って思ったので、その方法を書き残しておきます。

このサイト表示幅なんですが、チョッと気をつけたい点もありますので、その辺も書き残しておきます。

TwentyElevenのサイトの横幅調整はココ!!

それでは、管理画面より「外観」⇒「テーマ編集」から、’スタイルシート’を開き、次の部分を見つけて下さい。(小テーマを使用している方は、小テーマ側のスタイルシートを編集して下さい)

/* =Structure
----------------------------------------------- */

body {
	padding: 0 2em;
}
#page {　/* ココです!! */
	margin: 2em auto;
	max-width: 1000px;
}
#branding hgroup {
	margin: 0 7.6%;
}

はい、ストラクチャーの’#page’の部分ですね。ココを変更すればページの幅を調整出来ます。例えばこんな風にです。

/* =Structure
----------------------------------------------- */

body {
	padding: 0 2em;
}
#page {　/* ココです!! */
	margin: 2em auto;
	max-width: 900px;
}
#branding hgroup {
	margin: 0 7.6%;
}

こんな感じにしてみて下さい。これで、サイト表示幅が少し狭まったハズです。

ただし、ココでチョッと気をつけたい事があります。それは、グローバルナビゲーションのメニュー表示のことです。あまりにキツキツにメニュー表示をしていると、サイト幅を狭くすると2段表示になってしまいます。

また、私の様にサイトタイトルなどを非表示にして検索BOXを表示させている場合は、特に注意が必要です。まぁ、実際に幅変更をしてみて、その都度調整すれば良いことなんですがね。

一応念の為、注意する部分を書き残しておきました。TwentyElevenのグローバルナビゲーションのメニュー表示文字間の調整方法はこちら、検索BOXを非表示にする方法はコチラを参考にしてみて下さい。