Diviでサイドバーの幅を1 / 4で1 / 3に変更する方法

Diviテーマのサイドバーの幅を変更する

エレガント ThemesのDiviテーマでは、サイドバーの幅（幅）はデフォルトで20.875％で、左側のコンテンツ領域は79.125％に設定されています。

ページでは、サイドバーモジュールを追加して1分の3または1分の4などの幅で追加することができますが、基本的なページ/記事のサイドバーは、デフォルトで固定されています。 場合によっては、デフォルトの設定の幅が非常に狭く見えることがあります。

この場合、次のCSSコードを追加して、右のサイドバーの幅を変更することができます。

#left-area{width: 66.67%;}
#sidebar{width: 33.33%;}
.et_right_sidebar #main-content .container::before {
right: 33.33% !important;
}

DiviテーマでCSSコードは Divi>テーマオプション>一般>ユーザーカスタマイズCSSに追加することができます。 またはチャイルドテーマ（子テーマ）を作成し、スタイルシートファイルに追加することも可能です。

このブログでは、サイドバーの幅が狭すぎるようで、まったくなくしてしまってFull widthにするか考えてから、上記のコードを応用して幅を調整しました。

Diviで全体の幅で文を表示する場合は、次のようなコードを使用してみることができます。

.single-post .container:before {
display: none!important;
}
.single-post #left-area {
width: 100% !important;
}

.single-post #sidebar {
display: none;
}

上記のコードは、テストしてみなかったが、特に問題なく動作します。 ユーザーがコンテンツに集中できるように、全体の幅に調整することもまともな方法です。

Diviテーマはシンプルで強力な機能を提供し、速度面でも大丈夫なようです。 （個人的な経験上 Themeforestの WordPress テーマの場合 Enfoldもまともな速度を示しました。 Enfoldは国内でもユーザーが多いです。）

メモ：

• エレガント ThemesのDiviテーマツアー