Mix & Match バンドルの新しい List レイアウト

Mix & Match バンドルの Layout Display に、Grid と並ぶ新しいオプションが加わりました。List レイアウトでは各アイテムが1行ずつ表示されるので、写真を見るよりも価格や在庫を比べたいショッパーにとって読みやすくなります。

Single Product バンドル

1つの商品のバリエーションで作るバンドルでは、バリエーションごとに1行が表示されます。画像、名前、在庫、そして比較価格に取り消し線を付けた価格です。各行に Add to Cart ボタンがあり、1つ追加すると数量ステッパーに変わります。上限は在庫数とパックの残り枠です。

リストの下には合計が表示され、パック内のアイテム数と金額がわかります。割引が適用されると、割引前の小計に取り消し線が付きます。在庫切れのバリエーションはグレー表示になりボタンが無効になり、パックがいっぱいになると次のサイズが提案されます。

Multi Product バンドル

複数の商品で作るバンドルでは、バリエーションごとではなく商品ごとに1行が表示されます。

• オプションのある商品には、画像、名前、オプション数、そして割引後の最安オプションから算出した FROM 価格が表示されます。
• See options を押すと、Grid と同じオプションのポップアップが開きます。追加すると、その商品がパックにいくつ入っているかを示すバッジが行に付きます。
• オプションが1つ、またはオプションのない商品は Single Product のリストと同じく、Add to Cart ボタンとステッパーで動作します。
• すべてのオプションが売り切れの行はグレー表示になります。
• パネル下部では、ショッパーが追加・入れ替え・削除するたびにパックの数量と合計が更新されます。

スタイル設定できる項目

カスタマイザーでは、Add to Cart ボタンのテキスト、色、枠線、角丸、デスクトップとモバイル別の画像サイズを設定でき、パックの見出し、在庫、価格、画像を非表示にするスイッチもあります。Multi Product バンドルでは、See options ボタンのテキストと背景、数量バッジの色、From ラベルに加えて、エディタを離れずにスタイル設定できるよう、オプションのポップアップをプレビュー上に表示するセクションも追加されます。

切り替え方法

1. Mix & Match バンドルを開くか新しく作成します。
2. Layout Display で、Grid の代わりに List を選びます。
3. カスタマイザーで行のスタイルを整え、デスクトップとモバイルの表示を確認します。
4. 保存して公開します。

利用できるプラン

Mix & Match バンドルは Growth plan（2026年10月時点で月額$14）で利用でき、Single Product と Multi Product の両方のバンドルで使えます。

設定ガイド：Mix & Match Single Product バンドルの作り方