商品カルーセルセクション
学べること
製品を横にスクロール可能なレイアウトで表示する方法
製品ラベル、価格、バッジをカスタマイズする方法
製品の間隔、タイポグラフィ、色を調整する方法
デスクトップとモバイルのレイアウト設定を指定する方法
🧩 セクション概要
製品カルーセルセクションは、注目の製品を横にスクロールできる行で表示します。特定のコレクションをプロモートしたり、ベストセラーを強調するのに最適です。製品には価格、ラベル（「セール」や「売り切れ」など）、カスタムレイアウト設定を含めることができます。
セクションの追加方法
「 Shopify テーマエディター、クリック セクションを追加
選択してください 製品カルーセル
ページ上でセクションを表示したい場所にドラッグ＆ドロップしてください
コンテンツとデータの設定
セクションタイトル：カルーセルの見出しを追加します（例：「注目の製品」）
ショップリンクのテキスト：コールトゥアクションボタンを追加します（例：「全て見る」）
ショップリンクのURL：コレクションまたはページのリンクを貼り付けます
レイアウトと表示オプション
製品テキストの配置：タイトルを左揃え、中央揃え、または右揃えにします
次のオプションを切り替えます：
製品タイトルを表示
製品価格を表示
比較価格を表示
売り切れバッジを表示
セールバッジを表示
プレオーダーバッジを表示
💡 ヒント：バッジを有効にして割引や在庫状況を強調表示しましょう。
1行あたりの製品数 – デスクトップ：表示する製品数を選択してください（1〜6）
1行あたりの製品数 – モバイル：1〜3製品の間で選択してください
タイポグラフィコントロール
デスクトップとモバイルでフォントサイズを個別に調整します：
セクションヘッダー
商品タイトル
製品価格
オプション：切り替え 太字 スタイル対象：
セクションタイトル
ビューリンク
商品タイトル
カラーのカスタマイズ
背景色：透明、塗りつぶし、またはブランドカラー
セクションタイトルとリンクの色
矢印の色 （ナビゲーション矢印）
製品タイトルの色
製品価格の色
各バッジのラベル色：
プレオーダー
売り切れ
セール中
比較価格
各バッジには両方が含まれます：
テキスト色
背景色
⚠️ 読みやすさのために、テキストと背景の色がはっきりとコントラストしていることを確認してください。
間隔設定
画面サイズ間で視覚的バランスを良くするために間隔を調整できます。
デスクトップ
上の余白：20px
下の余白：20px
モバイル
上の余白：16px
下の余白：16px
追加コントロール：
セクションヘッダーと製品の間のスペース
製品画像と情報の間のスペース
製品タイトルと価格の間のスペース
製品間の間隔（デスクトップとモバイル）
ナビゲーションのコンテキスト
を使用して、 ナビゲーションのコンテキスト 設定により、顧客が製品をクリックしたときにどのコレクション内にとどまるかを定義します。
例えば：
「サマーコレクション」に設定されている場合、任意の製品をクリックすると顧客は同じコレクション内を閲覧し続けます。
これが設定されていない場合、製品をクリックするとコレクションのコンテキストなしで製品の標準ページに移動します。
ヘルプが必要ですか？
💬 Discordでコミュニティに参加： https://discord.gg/hcc2GvgZc6
📧 メールでお問い合わせ： [email protected]
💻 ライブチャット： 月曜〜金曜、午前10時〜午後6時（EST）に当社ウェブサイトで直接利用可能
最終更新