賢威7

【画像付きで解説】賢威7のサイドバーの余白幅カスタマイズ方法

 

はしこ
はしこ
賢威7のスタンダードのカスタマイズをした覚書きだよ!

すごーく細かな部分の編集なので、

気にならない人はスルーする箇所かもしれませんが、

気になっちゃった方のお役にたてればと、記しておきます^^

 

賢威7のスタンダードの記事部分、サイドバーの部分の背景色を白に設定した後。。

 

よくよく見ると、サイドバーの余白がなんだかキツキツじゃないですか?

背景色ギリギリから文字や検索窓があるのが、どーにも気になる!!(私だけ?笑)

 

 

まずは、サイドバーの余白の調整をしていきます。

賢威7スタンダードのサイドバーの余白の幅をカスタマイズする方法

まずは、管理画面の「外観」「テーマの編集」をクリック。

 

 

続いて「base.css」を編集して行きます。

 

 

サブコンテンツの最初の部分を変更します。

 

 

以下のように書き換えます。

 

.sub-conts .section-wrap{
margin: 0 auto;
padding: 0;
border: none;
}

.sub-conts .section-wrap .section-in{
padding: 20px 40px 30px;
}

 

 

※ちなみに、20px 40px~の部分は値を変えれば余白の幅が変わるので、

お好みの幅で調節してください^^

 

これでサイドバーに余白が出来て、私のココロもすっきり♪

 

 

と思いきや、もう一つ気になる点が。

賢威7スタンダードの記事部分の枠線を消す方法

この記事部分の周りにある謎のグレーの線!

 

 

 

よーく見なきゃ分からないけど…これも消しちゃいましょう!

 

メインコンテンツの「コンテンツの基本単位」の部分を書き換えます。

 

 

.section-wrap{
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin-bottom: 30px;
}

 

padding以降を削除すればOK!

 

 

これで謎の枠線は消えてスッキリ☆

 

以上、細かい所が微妙に気になってスッキリしない…

そんな私と同じような方のお役にたてれば幸いです!

 

 

ランキング応援して頂けたら泣いて喜びます人;ω;)

 

にほんブログ村 小遣いブログ アフィリエイトへ
にほんブログ村

はしこメルマガ☆今すぐ登録↓