昨年末にCandy Rackのスライドカートをリリースして以来、最も多く寄せられたリクエストが「チェックアウト画面に移動せずに割引コードを使えるようにしてほしい」というものでした。多くのカートドロワーでは標準的な機能ですが、これまで当社のカートには搭載されていませんでした。
割引コード機能がスライドカートのフッターに組み込まれました。お客様がコードを入力して「適用」ボタンを押すと、ページを再読み込みしたりチェックアウト画面へ移動したりすることなく、カートの合計金額と明細が即座に更新されます。
仕組み
入力されたコードはShopifyの割引APIとリアルタイムで照合されます。有効なコードであれば即座にカートに適用され、合計金額と明細が更新されます。無効または期限切れのコードの場合はエラーメッセージが表示され、合計金額は変更されません。
コードが適用されると、入力欄の横に削除可能な小さなタグが表示されます。お客様が気が変わった場合でも、すぐにコードを解除して別のコードを試すことができます。
割引の併用ルールはCandy RackではなくShopifyの設定に従います。複数のコードを入力した場合、既存の割引組み合わせ設定で許可されている場合にのみ併用されます。併用できない場合は、最後に入力したコードが以前のコードを上書きします。また、割引リンク（メールキャンペーンなどで送る ?discount=XYZ パラメータ付きのURL）経由でアクセスした場合は、カートを開いた時点でコードが自動的に適用されるため、お客様が入力する手間はありません。
カートのデザインに合わせる
フィールドの各要素は、スライドカートの「フッター」設定からカスタマイズ可能です。「合計」「カスタムテキスト」「利用規約」「チェックアウトボタン」「カスタムブロック」の横に設定項目があります。
- プレースホルダーテキスト（デフォルト：「割引コード」）
- エラーメッセージ（適用できないコードを入力した際に表示、フォントサイズも調整可能）
- 適用ボタン（ラベル、フォントサイズ、通常時およびホバー時の背景色と文字色、枠線の有無）
- 適用済みコードタグ（フォントサイズ）
- 注文レベルの割引プレビュー（オンにすると、実際にコードを使わなくても設定画面上で割引適用時の表示を確認可能）
また、割引フィールドの折りたたみオプションも用意しています。これをオンにすると、デフォルトでは入力欄を隠してリンクのみを表示できます。カートに空の割引ボックスが常に表示されていると、お客様がコードを探すために離脱してしまう可能性があるため、このオプションで目立たせないようにするのも一つの手です。
設定方法
- Candy Rack内のスライドカート設定を開きます。
- 「フッター」セクションで「割引」をオンにします（必要に応じて「割引フィールドの折りたたみ」もオンにします）。
- プレースホルダーテキスト、エラーメッセージ、ボタンのスタイルをカートのデザインに合わせて設定します。
- 保存します。
開発の背景
割引コードを持っている、あるいは持っているかもしれないと考えているお客様は、チェックアウトの最終段階ではなく、カートを開いた瞬間にコード入力欄を探す傾向があります。その時点で入力欄が見当たらないと、Shopifyのチェックアウト画面にたどり着く前にコードを探しに離脱したり、注文自体を諦めてしまったりすることがあります。それでは手遅れなのです。
これはスライドカートの本来の目的である「お客様をページから離脱させない」という点に直結します。チェックアウト画面でしか割引コードを入力できない仕様は、この目的に反しています。ネイティブで対応しているカートドロワーを使えば、この欠如は一目瞭然です。今回の機能追加は、新しい何かを加えるというよりは、本来あるべき当然の機能を補完するものです。
この機能は、リリース以来スライドカートに追加してきた機能群に加わります。これまでにリワードバー、カスタムブロック、コレクションアップセル、AI生成商品説明、そして最新のレコメンデーションエンジンなどを実装してきました。カートの設計思想については、当社のアップセル戦略ガイドをご覧ください。カートではなくチェックアウト画面の最適化については、Shopifyチェックアウト最適化ガイドで詳しく解説しています。
割引コード機能は、本日よりCandy Rackでご利用いただけます。すでにスライドカートをご利用の場合は、設定の「フッター」から「割引」をご確認ください。まだお試しでない方は、Shopify App StoreからCandy Rackをインストールしてください。スライドカート、リワードバー、アップセル、そして割引コードのすべてがこのアプリ一つで利用可能です。
