アプリの使い方
商品ページのバッジ
バッジは商品ページに「代金引換をご利用いただけます」と表示し、 チェックアウト前にお客様に伝えます。代引き制限のルールに従い、無料プランを含むすべてのプランで使えます。
バッジを追加する
- アプリのダッシュボードを開きます。
- 商品ページに代金引換の利用可否を表示カードで商品ページにバッジを追加をクリックします。
- バッジが追加された状態で、テーマエディタが商品ページを開きます。カートに追加のすぐ上など、好きな位置にドラッグします。
- 保存をクリックします。
ダッシュボードに戻ると、公開中のテーマにバッジがあればカードに商品ページに追加済みと表示されます。まだ追加されていませんのままなら、更新アイコンをクリックしてください。
手動で追加する場合:オンラインストア → テーマ → カスタマイズで商品ページを開き、 商品情報セクションのブロックを追加からアプリの代金引換バッジを選びます。
注意: バッジはアプリブロックのため、Dawn や Shopify テーマストアの多くのテーマなど、Online Store 2.0 テーマが必要です。
バッジの設定
テーマエディタでバッジをクリックすると変更できます。
| 設定 | 内容 |
|---|---|
| バッジを表示 | テーマから削除せずにバッジをオン/オフします。 |
| タイトル | メインの文言。初期値:「代金引換をご利用いただけます」。 |
| サブタイトル | 2 行目。初期値:「商品到着時にお支払いください」。空欄ならタイトルのみ表示します。 |
| アイコン | 11 種類の内蔵アイコン、独自の画像、またはアイコンなし。 |
| カスタムアイコン | アイコンがカスタム画像のときに表示。48 × 48 px 以上の正方形の PNG または SVG が最適です。 |
| 幅 | 全幅、またはテキストに合わせる。 |
| 配置 | 左、中央、右。幅がテキストに合わせる場合のみ。 |
| 上の余白 / 下の余白 | バッジの上下の余白、0〜40 px。 |
| 色 | テキスト、アイコン、背景、枠線。 |
| 文字サイズ | 12〜20 px。 |
| 角の丸み | 0〜30 px。 |
内蔵アイコン:現金、紙幣、硬貨、財布、お金の袋、現金を持つ手、配送トラック、荷物、自宅配送、盾、チェックマーク。
ヒント: 初期値のタイトルとサブタイトルは、日本語・英語・フランス語・スペイン語・ドイツ語など 15 言語で、 ストアの言語に合わせて表示されます。自分で入力した文言はそのまま表示されます。翻訳するには Shopify の Translate & Adapt アプリを使ってください。
バッジが非表示になる場合
バッジは代引き制限と同じルールを確認するため、代金引換が提供されない場所では表示されません。
| ルール | バッジは従う? |
|---|---|
| 商品、バリエーション、コレクション、販売元、ギフトカード | はい |
| 国 | はい(お客様の位置情報に基づく) |
| 顧客タグ、メール、電話番号 | はい(ログイン中のお客様) |
| プランの注文上限に達した(代引きオフ) | はい |
| 注文合計、割引、配送方法、都道府県・州、郵便番号 | いいえ — チェックアウトでのみ確認 |
チェックアウトのみのルールはカート全体や配送先住所に依存し、商品ページの時点ではまだ存在しません。 チェックアウトでは通常どおり適用されます。
知っておきたいこと
- 国のルールはお客様の位置情報を使います。国のルールがあり、国を判別できない場合は、 安全のためバッジを非表示にします。
- ゲスト。メールと電話番号のルールはログイン中のお客様にしか確認できません。 ゲストにはバッジが表示され、ルールはチェックアウトで適用されます。
- 混在したカート。代金引換が非表示の商品がカートにあると、チェックアウトでは注文全体で非表示になります。 各商品ページは自分の商品しか分からないため、他の商品ではバッジが表示されることがあります。
- レイアウトがずれません。国を確認している間もバッジの場所を確保し、その後フェードインします。 表示しない場合はスペースが閉じます。
- ルールの変更は自動で反映されます。代引き制限を保存すると反映されます。
ここでバッジが表示されないのはなぜ?
テーマエディタでは、非表示のバッジに理由が短く表示されます。制限によりこの商品で代金引換が提供されない、 またはプランの注文上限に達してストアの代金引換がオフになっている、のいずれかです。お客様にこの表示が見えることはありません。