WordPress・Lightningのコンテンツの幅を変更

記事の方法でカスタムを100%保障するものではございません。

バージョンにより異なりますのでご了承下さいませ。

※カスタマイズは必ずバックアップの上、自己責任にて行って下さい。

コンテンツの幅を変更

Lightningのテーマは、コンテンツとサイドバーの間の幅（隙間）が広すぎるので、隙間を無くします。

Bootstrap（ブートストラップ）ベースなので幅の調整は楽です。

mainSection（メインコンテンツ）はcol-md-8

subSection（サイドバー）はcol-md-3

がベースとなっております。

Bootstrapでは（全幅）12カラムですので1カラム分がスペースとして使用されています。

col-md-offset-1　を削除して　mainSectionをcol-md-9　にすれば隙間は無くなります。

修正するファイルは以下の４ファイルとなります。

・front-page.php
・page.php
・index.php
・single.php　

front-page.php

$main_col = ‘col-md-8’;　を $main_col = ‘col-md-9’;　に

$main_col = 'col-md-9';

div class=”col-md-3 col-md-offset-1 subSection sideSection　のcol-md-offset-1を削除

<div class="col-md-3 subSection sideSection">

page.php　（固定ページ）

div class=”col-md-8　を　col-md-9 に変更

<div class="col-md-9 mainSection" id="main" role="main">

div class=”col-md-3 col-m subSection sideSection　の　col-md-offset-1を削除

<div class="col-md-3 col-m subSection sideSection">

div class=”col-md-8 mainSection” id=”main” role=”main” を col-md-9に変更

<div class="col-md-9 mainSection" id="main" role="main">

div class=”col-md-3 col-md-offset-1 subSection sideSection　のcol-md-offset-1を削除

<div class="col-md-3 subSection sideSection">

div class=”col-md-8 mainSection” id=”main” role=”main” の　col-md-8　を　col-md-9へ

<div class="col-md-9 mainSection" id="main" role="main">

div class=”col-md-3 col-md-offset-1 subSection sideSection　の　col-md-offset-1を削除

<div class="col-md-3 subSection sideSection">

Bootstrapベースなので幅の調整は楽に行えます。

cssで調整も可能ですが、カラムで修正したほうが楽だと思います。