Wix Studio エディタ:サイトの最大幅を設定する
読了時間:3分
Wix Studio エディタでは、訪問者の画面サイズに応じて、デフォルトで要素が比例してスケーリングするよう設定されます。ただし、大きな画面では、要素が必要以上に大きく表示されて、サイトの見栄えが悪くなってしまう恐れがあります。
クライアントのサイトのセクションに最大幅を設定すると、要素が必要以上に拡大されるのを防ぐことができます。
![Wix Studio エディタの最大幅の設定により、画面サイズを拡大しても要素が一定以上拡大されない様子を示したスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2024/06/16/56609199-4b48-4446-aff3-2e8ef4a2acdd/1f3db1c4-25c4-4391-92d0-478f2e0d1ed5.gif)
この記事では、以下の項目について説明します:
クライアントのサイトに最大幅を設定する
「サイトスタイル」パネルに移動して最大幅を設定します。訪問者の画面サイズが設定した最大幅より大きい場合は、要素のサイズが固定され、サイトに左右の余白が表示されます。
設定した最大幅はサイトのすべてのセクションに適用されますが、必要に応じて特定のセクションを除外することができます。
注意:
最大幅は 1001px 以上に設定する必要があります。
クライアントのサイトに最大幅を設定する方法:
- エディタ左側の「サイトスタイル」
をクリックします。
- 「Max Width」をクリックします。
- 希望の幅をピクセル単位で入力します。
![Wix Studio エディタの「サイトスタイル」パネルの「Max Width」タブで、ピクセル単位で幅を設定した様子を示したスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/43afd84c-813c-43a2-baab-131b6878accd/2024/08/28/5aa79268-e2f1-421d-89af-bbdf4a336dc9/a1bebd2c-80ad-4b14-abb4-6ff23da2b722.jpg)
特定のページまたはセクションの最大幅を無効にする
特定のページまたはセクションの最大幅は、いつでも無効にすることができます。無効にすると、比例してスケーリングする要素は、訪問者の画面サイズに応じて拡大されるようになります。
特定のページまたはセクションの最大幅を無効にする方法:
- 該当するセクションを選択します。
- エディタ右上の「要素設定パネルを開く」アイコン
をクリックします。
- 「レスポンシブ動作」下の「Max Width を適用」トグルを無効にします。
![要素設定パネルで、特定のセクションの最大幅を無効にした様子を示したスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/43afd84c-813c-43a2-baab-131b6878accd/2024/08/28/71454d28-15e3-4575-852a-1b9dcae23882/be4b8e88-f15b-4e88-a658-e3169e70e02a.jpg)
ページにあるすべてのセクションの最大幅を一括で無効にしたい場合:
![ページにあるすべてのセクションの最大幅を無効にするオプションがハイライトされている様子を示したスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/43afd84c-813c-43a2-baab-131b6878accd/2024/08/28/ba219325-7bd7-4dee-9f0e-8da9043a085d/37d3ae77-8d29-4da2-8a8c-a5cb58afec31.jpg)
要素設定パネルのパンくずリストでページを選択し、「レイアウト」下の「既存のセクションを除外する」をクリックすると、そのページにあるすべてのセクションの最大幅を一括で無効にすることができます。
![ページにあるすべてのセクションの最大幅を無効にするオプションがハイライトされている様子を示したスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/43afd84c-813c-43a2-baab-131b6878accd/2024/08/28/ba219325-7bd7-4dee-9f0e-8da9043a085d/37d3ae77-8d29-4da2-8a8c-a5cb58afec31.jpg)
よくある質問
詳細については、以下の質問をクリックしてください。
最大幅を設定しない場合はどうなりますか?
ページにあるすべてのセクションの最大幅を無効にした後に、新しいセクションを追加するとどうなりますか?
最大幅の境界線の外側に要素を追加することはできますか?