コレクションレイアウト設定
Plain Jane および Plain Jane Interactive 向け
あなたが学ぶこと
コレクションページのレイアウトをカスタマイズする方法
列数、間隔、画像サイズ、ホバー効果の調整方法
🧭 概要
この コレクションレイアウト 設定では、デスクトップおよびモバイルでコレクションページ上の製品表示方法を制御できます。これらのオプションは、ブランドの見た目や商品ラインナップに合った理想的なショッピング体験を作成するのに役立ちます。
🖥️ レイアウトオプション
デスクトップの列数
デスクトップで1行に表示する製品数を選択してください：
オプション： 2, 3, 4, 5、または 6 列
モバイルの列数
モバイルで1行に表示する製品数を選択してください：
オプション： 1列 または 2列 列
💡 大きな商品画像や高級品には列数を少なくする
列間および行間のギャップ
製品間の間隔を調整して視覚的な密度をコントロール：
列間ギャップ（デスクトップ）
行間ギャップ（デスクトップ）
列間ギャップ（モバイル）
行間ギャップ（モバイル）
すべての値はピクセル単位で測定されます（px）およびスライダーで調整可能です。
🖼️ 画像設定
商品画像のサイズ
コンテナに対する商品画像の割合サイズを調整します（例：100%）
商品画像のアスペクト比
グリッド内で商品画像の形状を選択してください：
ナチュラル（元の画像サイズ）
正方形
縦長
横長
💡 を選んでください 正方形 より均一なレイアウトのために
ホバー時に2枚目の画像を表示
これをオンにすると、デスクトップで商品一覧にカーソルを合わせたときに2枚目の画像が表示されます
別アングルや代替ビューを見せるために一般的に使用されます
🧪 よくあるユースケース
ミニマルなストア — 2〜3列と大きめの間隔を使用
高ボリュームのストア — 4〜6列を使用してより多くの商品を表示
インタラクティブなディスプレイ — 製品のエンゲージメントのために2枚目の画像のホバーを有効にする
ヘルプが必要ですか？
💬 Discord のコミュニティに参加してください： https://discord.gg/hcc2GvgZc6
📧 メールでお問い合わせ： [email protected]
💻 ライブチャット： 月〜金、現地時間（EST）10:00〜18:00 に当社ウェブサイトで直接利用可能
最終更新