テーマオプション レイアウト

このコンテンツでは、【テーマオプション レイアウト】全9のオプションについて解説をしています。

このオプションでは、サイト全体の幅やパディングの設定をします。
パディングについては、【Fusion Page Options】からページ毎に設定を上書きすることができます。

また、Avadaを実際に使用しているショーケースサイトを開発元が公開しています。
レイアウトの参考にするといいでしょう。
Avada Showcase Sites

このオプションは、サイトの幅をpxや%を使用して設定することができます。

当サイトは1200pxで設定しています。

このオプションは、【1.Layout / レイアウト】でボックスタイプを選択すると設定できるオプションで、上下のオフセットを設定することができます。ここで設定する値は、ページの一番上または一番下からの距離を表す数値です。また、【4.Boxed Mode Offset Scroll Mode / スクロールタイプ】の設定と関係があります。

このオプションは、【1.Layout / レイアウト】でボックスタイプを選択すると設定できるオプションで、スクロールタイプを選択することができます。先に触れた通り【3.Boxed Mode Top・Bottom Offset / 上下のオフセット】と関係があります。

Freamed Scrolling（フレームスクロール）
【3.Boxed Mode Top・Bottom Offset / 上下のオフセット】を設定している場合に、そのオフセットを保ったままスクロールすることができます。具体的にはposition・fixedが適用されるため、上下にオフセット（距離）があると、ボックスの中でコンテンツがスクロールして見えます。

Full Scrolling（フルスクロール）
フルスクリーンタイプは、【3.Boxed Mode Top・Bottom Offset / 上下のオフセット】で設定したオフセット値が取り除かれます。bodyに対して設定した値がマージンとして残りますが、position・fixedは適用されません。

このオプションは、【1.Layout / レイアウト】でボックスタイプを選択すると設定できるオプションで、ボックス周りのシャドーの強さを4種類から選択することができます。

• No Shadow（なし）
• Light Shadow（軽め）
• Medium Shadow（中間）
• Hard Shadow（強め）

このオプションは、メインコンテンツの上下のパディングを設定することができます。

共に設定により変化しますが、パディングの上部分はタイトルバーからページネーションまでとなり、パディングの下部分がコメント欄からフッターまでとなります。

画像では、紫部分がパディングとなり、上が80px・下が60pxで設定しています。

このオプションは、【1.Layout / レイアウト】で100%と入力した場合や固定ページで100%幅のテンプレートを使用する際の左と右のパディングを設定することができます。

画像では、緑部分がパディング50pxを設定した例となります。

このオプションは、サイドバーを1つ使用する際の幅をpxや%で設定します。

当サイトは、250pxで設定しています。

このオプションは、サイドバーを2つ使用する際のそれぞれの幅をpxや%で設定します。

なお、テーマオプションのレイアウトでは幅のみの設定となりますが、【テーマオプション】 → 【Sidebars（サイドバー）】からより詳細な設定をすることができます。

例として、Dual Sidebar Width 1（2つのサイドバーの幅 その1）とDual Sidebar Width 2（2つのサイドバーの幅 その2）の位置は、ページ毎のオプションからそれぞれ変更することができます。例えば固定ページでは、Dual Sidebar Width 1を右、Dual Sidebar Width 2を左にしている設定を、投稿ページでは逆にしたりすることもできます。

サイドバーを使用したサイトを構築する場合は、【テーマオプション サイドバー】も合わせてご覧下さい。