商品カード
商品一覧・コレクション・検索結果などに並ぶ 商品カード の設定です。ここでの変更は、ストア全体の商品カードに効きます。
カラーチップ全体のしくみ(色の決まり方・形の2か所設定・色名の2つの設定)は カラーチップのしくみ にまとめてあります。
テーマエディタで テーマ設定 → 商品カード を開きます。
スタイル(スタンダード / カード) — 「カード」にすると、画像と文字を1枚の枠の中にまとめます。
画像の余白(0〜20・単位 px) — カードの画像のまわりの余白です。商品カードの画像に余白をとる がオンのときは、テーマ設定「画像・動画の枠 → 余白」の 写真まわりの余白の量 も加わります。
商品カードの画像に余白をとる(既定 OFF) — 画像のまわりに余白をとり、商品名と価格の大きさも整えます。
テキストアラインメント(左 / 中央 / 右) — カードの文字の揃えです。
配色 — カードに使う配色です。
枠線の 太さ・不透過率・角の半径 — カードの枠線です。エディタの「枠線」の見出しの下にあります。
影の 不透過率・水平オフセット・垂直オフセット・ぼかし — カードの影です。エディタの「影」の見出しの下にあります。影の 不透過率 は枠線の不透過率とは別の設定で、既定は 10% です。
商品カードに、短いラベル(バッジ)を出します。バッジは、売り切れていない商品にだけ出ます。
在庫バッジを表示(既定 ON) — 「残りわずか」「即納」「予約」「NEW」のバッジを出します。オフにすると、この見出しのバッジはすべて出ません。
「残りわずか」と表示する在庫数(1〜50・既定 5) — 在庫の合計がこの数以下のとき「残りわずか」を表示します。数えるのは、Shopify で在庫を追跡している(「数量を追跡する」がオンの)バリエーションだけです。在庫を追跡していない商品には表示しません。
残り点数を実数で表示(既定 OFF) — 「残りわずか」の代わりに「残り3点」のように、実際の数を出します。
「即納」と表示する在庫数(1〜100・既定 20) — 在庫の合計がこの数以上のとき「即納」を表示します。「残りわずか」の数より大きい値にしてください。在庫を追跡していない商品には表示しません。
「NEW」を表示する日数(1〜90・既定 14) — 商品を公開した日から、この日数の間だけ「NEW」を出します。ほかのバッジと並べて出ることがあります。
予約表示は、新規テーマは任意の真偽値 custom.preorder を使います。明示的な false は互換用タグ __preorder より優先します。在庫ゼロで販売を継続しているだけでは予約とは判定しません。これは表示の印であり、予約決済や出荷管理を作る機能ではありません。
カラーチップ
Section titled “カラーチップ”カラーチップを表示(既定 ON) — 商品カードに、色の選択肢を丸い印(カラーチップ)で並べます。色の選択肢が無い商品には出ません。
表示するカラーチップの最大数(2〜8・既定 4) — カードに並べる色の数の上限です。残りの色は「+2」のようにまとめて出します。
商品カードのカラーチップの形 — 商品カードに出すカラーチップの形です。商品ページの形は、「商品情報」セクションの「バリエーションピッカー」ブロックで設定します。
- 円形(初期値)
- 正方形
- 角丸四角 — ボタンの角丸設定を使います
- なし — 色の印を出さず、色名を文字で表示します(「商品カードに色名を表示」がオフでも表示します)
商品カードに色名を表示(既定 ON) — カラーチップの横に色名を表示します。オフにすると色の印だけを表示します。カード内でカートに追加できる商品では、「カード内の色選択に色名を表示」もオンのときだけ表示します。
サイズの一覧
Section titled “サイズの一覧”サイズの一覧を表示(既定 ON) — 商品カードに、選べるサイズを文字で並べます。サイズの選択肢が無い商品には出ません。「カード内でカートに追加」がオンの間は、対象の商品では効きません。
AIがすすめたサイズを在庫表で強調(既定 OFF) — お客様がチャットで確かめ、保存に同意したサイズの行を、商品ページのサイズガイドの表で強調します。サイズの選択は自動では変わりません。サイズガイドのセクションの「チャットのサイズ候補を強調」もオンにしたときだけ働き、表のサイズ欄が「M」のようにサイズ名だけのときに使えます。
カード内でカートに追加
Section titled “カード内でカートに追加”カード内でカートに追加(既定 ON) — お客様がカードの上で色・サイズを選び、そのままカートに入れられます。対象は、バリエーションが100件までの商品です。100件を超える商品は、クイックビューで選んでもらいます。
カード内の色選択に色名を表示(既定 ON) — カードから直接カートに追加するときの色の選択で、色の印と一緒に色名を表示します。商品カードに色名を表示 もオンのときだけ表示されます。
追加ボタンの見た目(既定: 塗り) — カード内の「カートに追加」ボタンを、塗り(背景色あり)か枠線(背景なしで枠と文字だけ)から選びます。テーマ設定「ボタン」の見た目とは別に、この設定を使います。
お気に入りボタンを表示(既定 ON) — 商品カードにお気に入りボタン(ハートのアイコン)を表示します。お客様が押した商品は、お客様のブラウザに保存されます(ログイン不要)。
お気に入りページ — ページを選ばなくても、ヘッダーのハートのアイコンからお気に入りを開けます(画面の横から一覧が開きます)。「お気に入り一覧」セクションを置いたページを選ぶと、一覧にそのページへのリンクが表示されます。
クイックビュー
Section titled “クイックビュー”クイックビューを表示(既定 ON) — 商品カードにボタンを表示し、ページを移動せずに商品の詳しい情報と購入の選択を開けるようにします。商品ページのテンプレートに「クイックビュー」セクションが置かれている必要があります(同梱のテンプレートには最初から置かれています)。
在庫バッジが出ない
商品の在庫を追跡しているか確認してください(管理画面の商品のページで「数量を追跡する」がオン)。「NEW」は公開日からの日数で決まるため、公開日が古い商品には出ません。
カラーチップの数やサイズの一覧の設定を変えても、見た目が変わらない
「カード内でカートに追加」がオンになっていないか確認してください。オンの間、多くの商品ではカート追加用の選択が表示され、これらの設定は使われません。