TwentySeventeenの記事横幅を拡大

私の使っているテーマはTwentySeventeenですが、横幅がちょっと小さめなのが気になっていました。

これに関して、投稿している記事は多く、

「みんな結構気になっているんだなー」

と、一人納得。

 

以下、横幅拡大の方法。

追加CSSに下記挿入

/* TwentySeventtenの最大幅を1200pxに変更 */
@media screen and (min-width: 79em) {
.wrap {
max-width: 1200px;
padding-left: 5em;
padding-right: 5em;
}
.has-sidebar:not(.error404) #primary {
width: 60.0%;
}
.has-sidebar #secondary {
width: 31.3%;
}
.navigation-top .wrap {
max-width: 1120px;
}
.site-footer .wrap {
padding-left: 10em;
padding-right: 8em;
}
}

子テーマのfunction.phpに下記挿入

function twentyseventeen_child_setup() {
$GLOBALS['content_width'] = 624;
}
add_action( 'after_setup_theme', 'twentyseventeen_child_setup', 11 );

 

…できた！

Reference