Wix プロギャラリー：モバイルサイト用の Wix プロギャラリーレイアウトを選択する（カスタム vs. プリセット）

モバイルサイトのプロギャラリーレイアウトはレスポンシブです。つまり、さまざまな画面サイズやデバイスに合わせて自動的に調整されます。モバイルに最適なプロギャラリーのレイアウトを選択できます。

組み込み機能を備えたプリセットレイアウト、または自分でレイアウトをカスタマイズしたい場合はカスタムレイアウトを選択します。どのレイアウトオプションを選択しても、ギャラリーのデザインはいつでもカスタマイズできます。

この記事では、次の項目について説明します：

カスタムレイアウト

これらのギャラリーレイアウトを使用すると、プロギャラリーを最初からデザインおよびカスタマイズできます。幅広いカスタム可能なレイアウトから選択して、モバイル端末でメディアを最適に表示できます。

モバイルサイトのレイアウトをカスタマイズする方法：

モバイルエディタにアクセスします：
- Wix エディタ：エディタトップバーで「モバイルエディタに切り替え」アイコンをクリックします。
- Editor X：Editor X 上部の該当するブレークポイントをクリックします。
モバイルエディタで「Wix プロギャラリー」をクリックします。
「設定」をクリックします。
ギャラリーのレイアウトを選択します。
「レイアウトを編集」をクリックして、希望通りのレイアウトにします。（下記よりカスタマイズ可能なレイアウト機能をご覧ください。

注意：

拡大表示に矢印ボタンは含まれません。代わりに、訪問者は画面をスワイプして次のギャラリーアイテムを表示します。

プリセットレイアウト

プリセットテンプレートには、幅広いレイアウト機能が含まれています。これらの既製のギャラリーレイアウトを使用すると、サイトに画像を表示するプロセスをスピードアップできます。レイアウト自体はカスタマイズできませんが、「デザイン」タブからギャラリーのデザインをカスタマイズできます。

プリセットレイアウトを選択する方法：

モバイルエディタで「Wix プロギャラリー」をクリックします。
「設定」をクリックします。
「プリセット」タブをクリックします。
ギャラリーのレイアウトを選択します。

カスタマイズ可能なレイアウト機能

各カスタマイズ可能なレイアウトには、スクロールの方向、ギャラリーの方向、画像の向きなど、カスタム可能なさまざまな設定があります。

レイアウトの詳細は以下のオプションをクリックしてください：

コラージュ

メーソンリー

グリッド

グリッド内に画像を表示する場合は、このレイアウトを使用します。

スクロールの方向：ギャラリーが縦方向または横方向にスクロールするかどうかを選択します。
サムネイルのサイズ変更：
- クロップ：画像の比率を選択できます。
- フィット：画像のサイズをギャラリーのサイズに合わせます。
  注意：「枠線の太さ・色」、「角の丸み」オプションは、レイアウトの設定でサムネイルのクロップを選択した場合にのみ使用できます。
画像の比率：利用可能な画像の比率オプションから選択します。（例：4:3、1:1）
自動スライド：アイテムを連続スライドショーで表示するよう選択します：
- インターバル：指定した時間が経過すると、ギャラリーは次のアイテムにスライドします。「スライド間の時間」スライダーをドラッグして、アイテム間の秒数を変更します。
- 連続：ギャラリーは自動的にスライドします。「スライドショーの速度」スライダーをドラッグして、ギャラリーがスライドする速度を調整します。
- ホバーで一時停止：トグルをクリックして、訪問者がギャラリーアイテムをホバーすることでスライドショーを一時停止させるかどうかを選択します。
自動で調節：ギャラリー内に収まる画像を、固定サイズで表示します。
表示枚数を設定：スライダーをドラッグして、行ごとに表示する画像の数を調整します。
サムネイルのサイズ：ギャラリー内の画像の大きさを選択します。
列ごとの画像数：列ごとに表示する画像の数を選択します。（横方向が選択されている場合のみ）
間隔：画像間の間隔を設定します。
「もっと見る」ボタン：「もっと見る」ボタンの表示と非表示を切り替えます。（縦方向が選択されている場合のみ表示されます。）
画像のロード数：（このオプションは「もっと見る」ボタンを有効にした場合にのみ利用できます。）
- 全ての画像
- 最後のセクション（元のギャラリーと同じサイズの別のセクションを追加します）

サムネイル

選択した画像の横に複数のサムネイルを表示する場合は、サムネイルレイアウトを使用します。

画像をループ表示：最後の画像で「次へ」ボタンを無効にするかどうかを選択します。
注意：後方にスクロールしながら最初の画像に到達すると、「左」ボタンは常に無効になります。
自動スライド：アイテムを連続スライドショーで表示するよう選択します：
- インターバル：指定した時間が経過すると、ギャラリーは次のアイテムにスライドします。「スライド間の時間」スライダーをドラッグして、アイテム間の秒数を変更します。
- 連続：ギャラリーは自動的にスライドします。「スライドショーの速度」スライダーをドラッグして、ギャラリーがスライドする速度を調整します。
- ホバーで一時停止：トグルをクリックして、訪問者がギャラリーアイテムをホバーすることでスライドショーを一時停止させるかどうかを選択します。
スライド間の時間：スライドが変更されるまでの時間を選択します。（「自動でスライド」がオンになっている場合にのみ表示されます。）
注意：トランジション効果を変更する場合は、「デザイン」設定の「スライドアニメーション」タブに移動してください。
サムネイルのサイズ変更：
- クロップ：画像のサイズをギャラリーのサイズに合わせます。
- フィット：画像を元の比率で表示し、ギャラリーのサイズに合わせます。画像の周りに空白が多すぎる場合は、ギャラリーの高さを増やす必要があります。
  注意：「枠線の太さ・色」、「角の丸み」オプションは、レイアウトの設定でサムネイルのクロップを選択した場合にのみ使用できます。
サムネイルの位置：画面上でサムネイルを表示する位置を選択します。（現在の画像の下、左、上、右）
サムネイルのサイズ：スライダーをドラッグして、ギャラリー内の画像の大きさを選択します。
注意：画像の数が少なく、メイン画像の下に空きスペースがある場合は、サムネイルのサイズを大きくする必要があります。
サムネイルの間隔：スライダーをドラッグして、画像間の間隔を選択します。
表示アイテム数：スライダーをドラッグして、画像の表示方法を調整します。

注意：現在、サムネイルの配置を調整することはできません。この機能をご希望の場合は、機能リクエストに投票することができます。

スライダー

横スクロールで複数の画像を表示する場合は、スライダーレイアウトを使用します。

注意：このレイアウトで一度に表示される画像の数は、ギャラリーのサイズによって異なります。画像が切れて表示される場合は、ギャラリーのサイズを変更する必要があります。別の解決策としては、レイアウト設定で「クロップ」と「レスポンシブ」を選択することです。

画像をループ表示：訪問者が画像を連続的にスクロールできるようにします。
自動でスライド：アイテムを連続するスライドショーとして表示するよう選択します：
- インターバル：指定した時間が経過すると、ギャラリーは次のアイテムにスライドします。「スライド間の時間」スライダーをドラッグして、アイテム間の秒数を変更します。
- 連続：ギャラリーは自動的にスライドします。「スライドショーの速度」スライダーをドラッグして、ギャラリーがスライドする速度を調整します。
- ホバーで一時停止：トグルをクリックして、訪問者がギャラリーアイテムをホバーすることでスライドショーを一時停止させるかどうかを選択します。
スライド間の時間：スライドが変更されるまでの時間を選択します。（「自動でスライド」がオンになっている場合にのみ表示されます。）
サムネイルのサイズ変更：
- クロップ：画像の比率を固定するかレスポンシブにするかを選択します。
- フィット：画像を元の比率で表示し、ギャラリーのサイズに合わせます。画像の周りに空白が多すぎる場合は、ギャラリーの高さを増やす必要があります。
  注意：「枠線の太さ・色」、「角の丸み」オプションは、レイアウトの設定でサムネイルのクロップを選択した場合にのみ使用できます。
画像の比率：
- レスポンシブ：画像のサイズは、閲覧者のデバイスに応じて自動的に調整されます。
- 固定：利用可能な画像の比率オプションから選択します。（例：4:3、1:1）画像はすべてのデバイスでこの比率で表示されます。
表示アイテム数：スライダーをドラッグして、画像の表示方法を調整します。（このオプションはレスポンシブ画像の比率を選択した場合にのみ使用できます。）
間隔：画像間の間隔を設定します。

スライドショー

横スクロールで一度に1つの画像を表示する場合は、スライドショーレイアウトを使用します。

画像をループ表示：訪問者が画像を連続的にスクロールできるようにします。
自動スライド：アイテムを連続スライドショーで表示するよう選択します：
- インターバル：指定した時間が経過すると、ギャラリーは次のアイテムにスライドします。「スライド間の時間」スライダーをドラッグして、アイテム間の秒数を変更します。
- 連続：ギャラリーは自動的にスライドします。「スライドショーの速度」スライダーをドラッグして、ギャラリーがスライドする速度を調整します。
- ホバーで一時停止：トグルをクリックして、訪問者がギャラリーアイテムをホバーすることでスライドショーを一時停止させるかどうかを選択します。
スライド間の時間：スライドが変更されるまでの時間を選択します。（「自動でスライド」がオンになっている場合にのみ表示されます。）注意：トランジション効果を変更する場合は、「デザイン」設定の「スライドアニメーション」タブに移動してください。
情報バーのサイズ：ギャラリーの下にアイコン、タイトル、詳細用のスペースを追加します。
再生ボタン：訪問者がスライドショーを一時停止または再生できるようにするボタンを追加します。（このオプションは、「自動でスライド」を有効にした場合にのみ使用できます。）
サムネイルのサイズ変更：
- クロップ：画像のサイズをギャラリーのサイズに合わせます。
- フィット：画像を元の比率で表示し、ギャラリーのサイズに合わせます。画像の周りに空白が多すぎる場合は、ギャラリーの高さを増やす必要があります。
  注意：「枠線の太さ・色」、「角の丸み」オプションは、レイアウトの設定でサムネイルのクロップを選択した場合にのみ使用できます。

ストリップ

カラム

レンガ、ミックス、オルタナ

シャッフル

よくある質問

プロギャラリーのレイアウトに関する詳細は、以下の質問をクリックしてください：

Wix プロギャラリーはレスポンシブですか？

Wix プロギャラリーに追加した画像の一部がトリミングされます。なぜですか？

モバイルのプロギャラリーで問題が発生している場合

モバイルでのプロギャラリーのトラブルシューティングガイドで、よくある一般的な問題の解決策を確認しましょう。