アップセル・クロスセル設定を利用する

アップセル・クロスセル商品を設定する

カートに入れた商品に合わせて最適なアップセル商品やクロスセル商品を提案できるようにします。
カート画面内にバナーなどを表示し、クリックするとカート画面から遷移することなく、
アップセル商品と入れ替えたりクロスセル商品をカートに追加したりできます。

通常商品を購入しようとしている定期購入をおすすめしてリピート購入につなげたり、パソコン本体を購入しようとしているお客さんにウィルス対策ソフトをおすすめするなど、「合わせ買い」や「ついで買い」を促すことで、客単価アップの施策に活用できます。




お客さんがアップセル・クロスセル対象商品をカートに入れると、提案商品がカート画面に自動で表示されるように設定します。

■対象商品を登録します

  1. 「 新規作成 」ボタンをクリックします。
     対象商品を選択する画面が開きます。




  2. 対象商品を選択します。
    商品検索を利用して、検索結果から選択することもできます。




  3. 「 対象商品を登録 」ボタンをクリックします。
    アップセル・クロスセルの対象商品一覧で登録を確認します。
  4. 次に、対象商品に提案商品を追加します。
    対象商品番号をクリックします。

  

■提案商品を登録します

  1. 「 提案商品を追加 」ボタンをクリックします。
  2. カート画面で提案する商品を選択します。
    複数の提案商品を一度に選択して追加することもできます。


    以下の商品は提案商品として選択できません。
    ・オプションを設定した商品
    ・バリエーションを設定した商品
    ・シークレットセール商品
    ・アソート商品

  3. 提案商品の数量を必要に応じて設定します。
    例えば、カート画面に表示している提案商品のバナーをクリックした際に、数量10個の提案商品を一度にカートに入れることができます。
  4. 画面下の「 アップセル商品として登録 」ボタン、または「 クロスセル商品として登録 」ボタンをクリックします。
  5. 提案商品を登録すると、提案商品ごとに「キー」が発行されます。


    こちらの「キー」は、後ほど提案商品をカートに表示するためのhtmタグ内に記述します。コピーして利用してください。



■カート表示内容を編集します

  1. カート表示内容の「 編集 」ボタンをクリックします。
    提案商品をカートに表示するための編集画面が開きます。
  2. 提案商品をカートに表示する位置を3か所から決めます。
    どの位置に表示するかを決めたら、その位置を「利用する」に設定します。カートでの表示イメージは、以下リンクより確認できます。

    カート内(購入商品の下) >> 表示イメージ
    カート画面中央(注文内容の下) >> 表示イメージ
    カート画面下部(ログイン欄、クーポン欄の下) >> 表示イメージ
    右イメージは、「カート内(購入商品の下)」に提案商品を表示する設定です。複数箇所に表示にする場合は、同様の手順を繰り返してください。


    基本的には購入商品と最も近い位置である「 カート内 」の利用をおすすめします。特に「 カートに複数商品入っている場合 」のアップセルでは、「 カート画面中央 」「 カート画面下部 」だと、どの商品と入れ替えたかわかりづらくなります。

  3. 「 カートに1商品のみ入っている場合 」または「 カートに複数商品入っている場合 」に表示するか、両方とも表示するか決めます。
    「 表示する 」を選択すると、htmlタグの入力欄が開きます。
     両方の場合は、2箇所にhtmlタグで記述する必要があります。


    提案商品の表示位置、カートに1商品のみ、または複数商品の場合の表示可否、それぞれの場合に表示する提案商品の個数などは、ある程度ルール化しておくことをおすすめします。個別に設定していくと管理が煩雑になります。

  4. 提案商品を表示するためのhtmlタグを入力します。
    htmlタグの入力サンプルは、下記のリンク先をご確認ください。

    >> アップセル・クロスセル設定の入力サンプル


    また、スマートフォンサイト用に異なる内容を表示する場合は「スマートフォン用に別途入力する」をチェックすると専用の入力欄が表示されるので、そちらへ入力します。


    スマートフォン用のデザインにするだけでなく、異なる商品を提案することもできます。

  5. カートに複数商品が入っている場合に表示する際は、こちらも入力します。入力欄が別途用意されているため1つの商品の場合と異なる内容を入力でき、そのため異なる商品を提案することもできます。


    同一商品をバリエーションやオプション、備考違いで複数カートに入れた場合、複数商品が入っていると判定されます。これらは商品番号が同じでもカートが2行以上になってしまうためです。



  1. 「有効」であることを確認します。即座に設定を反映したくない場合のみ「無効」にします。
  2. 設定内容を簡単に記録しておくなど、把握しやすいように利用します。後で検索する時に検索対象とすることもできます。必要なければ空欄で構いません。
  3. 「保存する」ボタンをクリックします。

    設定は以上です。
    以上の手順を商品ごとに繰り返します。

■設定していても非表示になる条件

提案商品を設定していても、キーが振られているバナーやテキストなどが非表示になる場合があります。
  • 提案商品がすでにカートに入っている場合
    商品Aがカートに入っている場合、商品Aへのアップセル提案は表示されません。
  • アップセルで数量設定しており、カートにその数以上すでに入っている場合
    商品Aが3個カートに入っている場合、 商品A(3個セット)へのアップセル提案は表示されません。
    カートに入っている商品Aが2個以下なら、アップセル提案は表示されます。
  • クロスセルで個数設定しており、カートにその商品がすでに入っている場合
    商品Bが1個でもカートに入っている場合、 商品B(3個セット)へのクロスセル提案は表示されません。
  • 在庫切れ
  • 販売期間外
  • シークレット商品
  • 削除された商品
  • 予約期間外は購入できない設定の商品
  • アソート商品

■アップセル・クロスセルで更新されたカートの行を目立たせる

CSSに記述を追加すれば、アップセルやクロスセルで商品の入れ替え・追加されたカートの行に対して、
色を付けたり枠を囲ったりすることができます。
更新されたカートの行には、class="sps-offer-modified"が追加されるため、これを利用できます。
このclassは商品が入れ替え、追加された時だけに適用され、画面遷移やリロードした時には保持されません。
右の場合、以下の記述をCSSに追加しています。

.sps-offer-modified { background-color: pink; }

LPカートのアップセルを設定する

LPカートでお客さんが商品を選択した時、選択されなかった商品を提案するアップセルを設定します。
LPカートの設定は事前に終えておいてください。


LPカートではアップセル機能のみ利用可能です。クロスセル機能は利用できません。

■販売ページの設定を開きます

販売ページの一覧から、管理コードをクリックし、販売ページ設定の編集画面を開きます。


LPカートのアップセル設定では「キー」を利用しないため、「アップセル・クロスセル設定」で「キー」を発行する必要はありません。

■HTMLソースを入力します

フリーエリアに入力します。
HTMLソースのサンプルは管理画面のフリーエリア入力欄の右上「>>入力タグサンプル」をクリックしてご覧ください。
スマートフォン用に別途ページレイアウトを変える場合は、「スマートフォン用に入力する」にチェックを入れ、その下の入力欄へスマートフォン用のHTMLソースを入力します。両者のコンテンツ得られる情報は同一にし、違いはレイアウトなどだけに留めてください。
  1. 注文内容の下へ表示されます。クリックすると、商品が入れ替わります。
  2. 注文確認ボタンの上へ表示されます。クリックすると、商品が入れ替わるだけでなく、同時に注文確認ボタンをクリックしたことになります。


    フリーエリアの入力欄に入力するHTMLソースは全く同一ですが、欄により挙動が異なります。


・注文フォーム内で選択できる商品のみアップセル設定できます。
・販売ページのみアップセルできます。確認画面や完了画面はできません。

■設定を保存します

画面最下部へスクロールし、「設定を保存する」ボタンをクリックします。


LPで定期購入商品をアップセルさせる際のコツ
お届けサイクルをお客さんが指定する必要があると、定期購入商品にアップセルしても確認画面に進めず、お届けスケジュールの欄まで戻ります。
お届けサイクルを1種類のみにすると、お客さんのお届けスケジュール選択の手間を省け、アップセルバナーのクリックだけで確認画面に進めるようにできます。