ワードプレステーマTwentyTwelveで、サイト全体の表示幅を変更する方法です。テーマTwentyTwelveのサイト内コンテンツの幅を変更する方法はコチラ♫
さて、ワードプレステーマは、全体的に幅の広いテーマが多い様に感じます。大きい方が好まれるんでしょうか?(笑 特に無料ブログをしていた人にとっては、とても大きく広く感じることと思います。
実際に表示させてみると、やっぱり広い…(汗 日本人は、幅が狭めの方が好むのでしょうかね?(笑 ってことで、少し表示枠を狭めてみようと思います。
幅を変更しただけでも見やすくなりますね!!
それでは、管理画面より「外観」⇒「テーマ編集」から’スタイルシート’を開き、次の箇所を見つけて下さい。(小テーマを使用している方は、小テーマ側のスタイルシートを編集して下さい)
/* =Media queries
-------------------------------------------------------------- */
/* Minimum width of 600 pixels. */
@media screen and (min-width: 600px) {
.author-avatar {
float: left;
margin-top: 8px;
margin-top: 0.571428571rem;
}
.author-description {
float: right;
width: 80%;
}
.site {
margin: 0 auto;
max-width: 960px;
max-width: 68.571428571rem;
overflow: hidden;
}
.site-content {
float: left;
width: 65.104166667%;
}
デフォルト表示だと、横幅が’960px’に設定されている事が分かります。そんなに広過ぎることはないと思うのですが、チョッと狭めてみましょう♫では、下記の様に編集してみて下さい。
/* =Media queries
-------------------------------------------------------------- */
/* Minimum width of 600 pixels. */
@media screen and (min-width: 600px) {
.author-avatar {
float: left;
margin-top: 8px;
margin-top: 0.571428571rem;
}
.author-description {
float: right;
width: 80%;
}
.site {
margin: 0 auto;
max-width: 860px;
max-width: 61.42857143rem;
overflow: hidden;
}
.site-content {
float: left;
width: 65.104166667%;
}
恐らくは、日本人好みの幅になったのでははいでしょうか?(笑 ’rem’については、コチラ⇒’TwentyTwelve rembase’
ちなみに、サイト全体の表示幅を変えても、サイトコンテンツへの影響はありませんのでご安心下さい。これで、さらにサイトが見やすくなったことでしょう☆