カート画面の「クーポンコード」入力欄を前に、お客さんが「クーポンどこかにあるのかな」と手を止めて悩んでいる様子を見つめ、見せ方を考え直すネットショップ担当者
商品ページ改善約11分編集：（商品ページ改善担当）

クーポン入力欄の位置と見せ方｜「探し回り離脱」を防ぐ

「あと一歩で買ってもらえるはずだったのに、カートまで来た人が急にいなくなる」。アクセス解析を見ながら、そんなもどかしさを感じたことはありませんか。原因はいろいろありますが、意外な落とし穴のひとつがカート画面の「クーポンコード」入力欄です。

買う気だったお客さんが、ぽつんと置かれた空の入力欄を見て「え、クーポンあるの？ 持ってないけど、探せば出てくる？」と気になってしまう。そのまま別タブでクーポンサイトを探しに行き、見つからなかったり、気が散ったりして——戻ってこない。これはカゴ落ち（商品をカートに入れたのに購入完了まで進まないこと）のよくあるパターンです。今日は、クーポンを持っていない人を離脱させず、持っている人は迷わず使える入力欄の置き場所と見せ方を、一緒に整えていきましょう。

結論：クーポン入力欄は「出しっぱなしの空欄」にしないのがコツです。(1) ふだんは折りたたんでおき、「クーポンをお持ちの方はこちら」という小さなリンクにする（空の入力欄をドーンと見せない）、(2) 置く場所は注文内容の確認エリアの近く・支払いの直前にして、買う流れをさえぎらない、(3) 配布したお客さんには最初から入力済み（または自動適用）にして、手入力を減らす。
そして大前提として、「全員がもらえるわけではないクーポン」を全員に探させないこと。入口の見せ方を整えるだけで、「探し回り離脱」はぐっと減らせます。値引き自体の設計や、二重価格の見せ方は景品表示法（うそや大げさな表示を禁じるルール）にも関わるので、そこも最後に触れます。

いま何が起きているか：空の入力欄が「お得の取りこぼし不安」を生む

人は、買い物の途中で「自分だけ損をするかもしれない」と感じると、手が止まります。カート画面にぽつんと空のクーポン入力欄があると、こう考えてしまうのです。「ここに入れる番号があるってことは、知ってる人は安く買えるんだ。自分は持ってない。損かも」。

この「お得の取りこぼし不安」が、2つのよくない行動を生みます。

つまり、良かれと思って用意した入力欄が、クーポンを持っていない大多数の人の背中を、逆に押し戻してしまうことがあるのです。ここで整理しておきたい言葉を、やさしく補足します。

大事なのは、クーポンを「隠す」ことではありません。配った人にはちゃんと使ってもらいつつ、配っていない人には「探さなきゃ」と思わせない——その両立を、置き場所と見せ方で実現します。次の具体例で見ていきましょう。

具体例：折りたたみ・置き場所・自動適用の3点を整える

クーポン入力欄を「出しっぱなしの空欄」から「折りたたみリンク」に変え、支払い直前に置く見せ方の違いを示した概念図
空の入力欄を出しっぱなしにせず、「お持ちの方はこちら」の小さなリンクに折りたたむ。置き場所は支払いの直前。持っている人だけが開く形にするのがコツ。

効果の出やすい順に並べました。全部を一度にやる必要はありません。まずは①から試してみてください。

① 入力欄を「折りたたんで」小さなリンクにする

いちばん手軽で効くのが、空の入力欄を出しっぱなしにしないことです。ふだんは折りたたんでおき、

といった小さなテキストリンクにしておきます。クリックすると入力欄が開く形です。こうすると、持っていない人の目には「空欄」が飛び込んでこないので、「探さなきゃ」という不安が起きにくくなります。持っている人は、リンクを見つけてすぐ開けます。

② 置き場所は「注文内容の確認エリア・支払いの直前」

次に、置く場所を見直します。クーポン入力欄を買い物の流れの最初（商品を見ている段階やカートの一番上）に大きく置くと、まだ買うと決めていない人の気を、値引き探しにそらしてしまいます。

おすすめは、注文内容を確認して金額が固まるあたり〜支払い方法を選ぶ直前に、控えめに置くこと。ここなら「買う」という流れをさえぎらず、持っている人は支払い前にサッと入れられます。入力フォーム全体を軽くする考え方は入力フォーム最適化（EFO）完全ガイドもあわせてどうぞ。

③ 配布した相手には「自動適用・入力済み」で手間を消す

そもそも手入力をさせないのが、いちばん親切です。配り方によっては、次のような形にできる場合があります。

手で正しく打つのは、意外とつまずきの多い作業です（大文字小文字、ゼロとオー、ハイフンの有無など）。自動適用にできると、入力ミスでの「使えなかった」というがっかりも防げます。実現できる範囲は使っているカート（ネットショップの仕組み）やメール配信ツールによって変わるので、できるところから取り入れてください。

④ 「使えなかった」ときのやさしい案内

コードが間違っていたり、期限切れだったりしたとき、「無効なコードです」とだけ出ると、お客さんは不安になって離脱しがちです。マイクロコピー（入力欄まわりの短い案内文）を、やさしく具体的にしておきましょう。

エラー文やボタン付近の言葉を整える考え方は購入ボタン・注記のマイクロコピー改善に詳しくまとめています。

直す順番を表に整理すると、こうなります（設定できる範囲はカートによって変わります）。

優先やることねらいまず最小でやるなら
①入力欄を折りたたみリンクにする持っていない人の「探し回り離脱」を防ぐ「クーポンをお持ちの方はこちら」の一行に変える
②置き場所を支払いの直前に買う流れをさえぎらないカート上部の大きな欄を下げる
③自動適用・入力済みにする手入力のミスと手間をなくすクーポン付きURLで配布してみる
④エラー文をやさしく具体的に「使えなかった」離脱を防ぐ原因と確認点を1文添える

誠実に見せるための注意点（景品表示法）

クーポンは値引きとセットなので、見せ方しだいで景品表示法（うそや大げさな表示を禁じるルール）に関わります。ここは丁寧にいきましょう。

迷ったら「このお客さんが後で全部の条件を知っても、だまされたと感じないか」を基準にしてください。本記事は一般的な解説であり法的助言ではありません。判断に迷う表現は専門家にご相談ください。

あなたへの影響

クーポン入力欄は、「あると親切」と思って置きがちです。でも、見せ方しだいで、買う気だった人の背中を逆に押し戻してしまうこともあります。持っている人には使いやすく、持っていない人には気にならない——その両立を、置き場所と折りたたみで実現しましょう。

明日やること

  1. 自分のカート画面をお客さんの目で開く。クーポン入力欄が「空欄のまま出しっぱなし」になっていないか、スマホでも確認する。
  2. 出しっぱなしなら、「クーポンをお持ちの方はこちら」の折りたたみリンクに変える（設定できる範囲で）。
  3. 入力欄の置き場所を支払いの直前に寄せる。買い物の最初に大きく出ているなら下げる。
  4. よく配るクーポンを、URL自動適用や入力済みにできないか、カート・メール配信ツールの設定を確認する。
  5. 「使えなかった」ときのエラー文を、原因と確認点（期限・大文字小文字・最低金額）を添えたやさしい文面に直す。

クーポンは、使ってほしい人にちゃんと届き、関係ない人を迷わせない——それが理想です。空の入力欄をひとつ折りたたむだけでも、取りこぼしは減らせます。まずは自分のカートを一度、お客さんの気持ちで通り抜けてみるところから始めてみましょう。あと一歩だったお客さんが、迷わず最後まで進めますように。

クーポン入力欄の見せ方を整えたことで、お客さんが迷わずスムーズに購入を完了でき、担当者も手応えを感じている明るい情景

チェックリスト

関連記事・無料ツール

あなたのカートのクーポン入力欄は、持っていない人を迷わせていませんか。気になるカート画面の様子を教えていただければ、無料診断で「探し回り離脱を防ぐ見せ方」を3つお返しします。

参考（公式・一次情報）