> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# 商品レコメンドウィジェット

> Aftersellのサンキューページ 商品レコメンドウィジェットを設定：商品の選択、オファーのデザイン、割引の適用、注文処理の設定を行います。

商品レコメンドウィジェットは、チェックアウト後のサンキューページにアップセル商品を表示します。特定の商品を宣伝したり、カート内容に基づく自動レコメンドを表示したり、コレクションをフィーチャーしたりするのに使えます。このページでは、ウィジェットのすべての設定を解説します。ファネルの完全なセットアップとShopifyエディターの手順については、[サンキューページウィジェットの設定方法](/ja/aftersell/how_can_i_set_up_and_customize_thank_you_page_upsells_in_aftersell)をご覧ください。

ファネルの **Thank You Page** セクションで **Add Widget** をクリックし、**Product Recommendation** を選択してウィジェットを追加します。

購入後アップセルとは異なり、サンキューページの商品レコメンドは**すべての決済ゲートウェイ**および**マルチ通貨ストア**に対応しています。顧客はアップセル購入を完了するために支払い情報を再入力する必要がありますが、Aftersellは保存された配送情報を自動的に適用するため、チェックアウト体験はスムーズに保たれます。

<img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/typ-extensions-editor-product-recommendation.gif?s=cd8c084de2e615bf735f29eb5c01374f" alt="商品レコメンドウィジェットが有効で商品が選択されているAftersellサンキューページエディター" width="2600" height="1080" data-path="images/aftersell/typ-extensions-editor-product-recommendation.gif" />

## 商品の選択

1. 商品選択方法を選びます。
   * **Specific Products** - 表示する商品を手動で選択
   * **Automatic Upsells** - Aftersellにカート内容に基づいて商品をレコメンドさせる
   * **Collections** - 特定のコレクションから商品を表示
   * **Strategy** - Aftersellの[Strategies](/ja/aftersell/strategies_overview)ルールセットからウィジェットを埋める。このオプションは、ストアでStrategiesターゲティングが有効になっており、他の方法で商品をまだ選択していない場合にのみ表示されます。
2. 表示する **最大商品数** を設定します。固定の上限はありませんが、数を絞る（例：4〜10商品）とオファーが一目で把握しやすくなります。
3. **Hide product if purchased** を有効にすると、同じ注文で顧客がすでに購入した商品は表示されません。
4. **Hide out of stock variants** を有効にすると、購入できないバリエーションが除外され、顧客は実際に購入できる商品のみを目にします。

商品ピッカーの **Products** タブを閲覧する際、**Active products only** にチェックを入れるとDraftとArchivedの商品を非表示にできます。このフィルターはデフォルトでオフで、Productsタブにのみ適用されます。Collectionsには影響しません。

### 特定の商品の編集

特定の商品を選ぶには、ウィジェットエディターで **Add upsell products** をクリックします。商品を選択すると、ボタンのラベルは **Edit upsell products** に変わります。

商品がすでに選択されている状態でピッカーを開くと、現在の選択内容にチェックが入った状態で表示されます。そこから次の操作が可能です。

* 新しい商品にチェックを入れて**追加**する。
* 既存の商品のチェックを外して**削除**する。
* すべての商品のチェックを外して選択を**クリア**する。

ピッカーを保存すると、ウィジェットは選択したままの状態に合わせて調整されます。追加した商品は含まれ、チェックを外した商品は削除され、変更のない選択を再保存しても何も変わりません。特定の商品を編集しても、コレクション、AI、Strategyのアップセル行には影響しません。

## Display on

**Display on** 設定は、顧客が購入を完了した後にウィジェットが表示される場所を制御します。

* **On every impression** - サンキューページと注文状況ページの両方にウィジェットを表示します。
* **Only on thank you page** - サンキューページにのみウィジェットを表示します。
* **Only on order status page** - 注文状況ページにのみウィジェットを表示します。
* **Only once on order status page** - 注文状況ページで、毎回の訪問ではなく1回のみウィジェットを表示します。

<img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/typ-extensions-recommendation-display-settings.gif?s=a7c3c5c98669d63e59100c05f33dd9f9" alt="商品レコメンドのDisplay onドロップダウン、Max productsフィールド、商品非表示トグル" width="1192" height="1080" data-path="images/aftersell/typ-extensions-recommendation-display-settings.gif" />

## オファーデザイン

**Offer design** 設定は、商品レコメンドが顧客にどのように表示されるかを制御します。

* 商品を**横並び**または**縦並び**のレイアウトで表示するかを選択し、枠線、ボタンスタイル、余白などの視覚要素を調整して、チェックアウトに合わせます。
* オファーの上に**バナーテキスト**を追加して、レコメンドを紹介したり、インセンティブを強調したり、表示される商品の補足を提供したりします。
* **比較価格（compare-at price）** の表示と、セール価格に使用する色を設定します。
* **数量セレクター**を有効にし、数量ラベルをカスタマイズし、**最小・最大数量制限**を設定します。

Compare、Discount、Saleの各価格には2種類のカラーファミリーがあります。

* **Checkoutブランディングカラー** - Accent、Decorative、Info、Subdued
* **プリセットカラー** - Success（緑）、Warning（黄）、Critical（赤）

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/typ-extensions-compare-price-color-options.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=555ec0085917bccf174d689e0a9c725c" alt="テーマとプリセットの両方から選べる比較価格のカラーオプション。" width="282" height="284" data-path="images/aftersell/typ-extensions-compare-price-color-options.png" />
</Frame>

これらの設定の一部は、Shopifyのチェックアウトエディターや、この機能を提供する他のアプリを使用しても変更できます。

2つのトグルが自動割引機能を補完します。

* **Show compare at price** - 「Compare at」価格を取り消し線付きで表示します。
* **Show discount** - アップセルに割引を表示します。

## 割引と注文処理

### 割引

**割合（%）** または**固定額**を設定して、アップセルに直接割引を適用できます。割引は顧客がオファーを承諾したときに自動的に適用されます。

**割引テキスト**と**割引価格の色**で、割引の表示方法をカスタマイズします。割引色にはチェックアウトブランディングのカラー（Accent、Decorative、Info、Subdued）またはプリセット（Success、Warning、Critical）を使用できます。有効にすると、割引表示に**比較価格**を含めることができ、取り消し線付きで表示されてお得感が強調されます。

<img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/typ-extensions-thank-you-upsell-offer.gif?s=41788af72c0b25ff35871242596c5f79" alt="43%オフと取り消し線付き比較価格が表示されたHatのサンキューページアップセルオファー" width="2000" height="1080" data-path="images/aftersell/typ-extensions-thank-you-upsell-offer.gif" />

割引はShopifyの標準的なチェックアウト割引ルールに従います。1つの商品に同時に適用できるラインアイテム割引は1つのみで、割引はShopify Adminで**組み合わせ可能（combinable）** とマークされている場合にのみ併用されます。他のアプリがチェックアウトを変更している場合、割引が適用されないことがあります。割引を有効にした後は、チェックアウトをテストすることをおすすめします。

### 注文処理

<a id="order-handling" />

注文処理は、承諾されたアップセルが顧客の注文にどのように追加されるかを制御します。2つのオプションがあり、それぞれに異なるトレードオフがあります。

* **Modify original order** - アップセルを既存の注文に直接追加します。送料無料が自動的に適用されます。注文が変更された際に顧客にメールを送信するオプションもあります。
* **Create new draft order** - 元の注文には手を加えず、アップセル用に別の注文を作成します。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/typ-extensions-order-handling-options.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=de2249c801aef599ce76686b46f91dec" alt="元の注文を変更するか、新しい下書き注文を作成するかを選ぶ注文処理オプション" width="828" height="722" data-path="images/aftersell/typ-extensions-order-handling-options.png" />
</Frame>

#### 各オプションを選ぶべきタイミング

| **Modify original order** を使う場合... | **Create new draft order** を使う場合...      |
| ---------------------------------- | ---------------------------------------- |
| 顧客が購入したすべての商品を1回のフルフィルメントで処理したい    | 顧客が購入したばかりの商品を再度オファーしたい（例：同じ商品を購入後割引で提供） |
| アップセルカタログがベストセラーとは別である             | トップセラーが主なアップセル候補でもある                     |
| アップセルの送料無料が最優先である                  | フルフィルメントやレポートの都合で別注文が必要である               |
| アップセル商品にバンドル商品が含まれない               | アップセル商品にバンドル商品が含まれる                      |

<Warning>
  **「Modify original order」には制限があります。** このモードを選択すると、ウィジェットエディターに次の内容を示す **Limitations** バナーが表示されます。

  * **同一バリエーションのアップセルは非表示になります。** Shopifyの注文編集APIは、注文内でのバリエーションの重複を許可していません。顧客の元の注文にすでにアップセルのバリエーションが含まれている場合、そのアップセルはサンキューページから非表示になります。この理由でアップセルが非表示になった場合、Order Browserは該当する注文に「Upsell hidden due to order merging」バナーを表示します。
  * **バンドル商品は既存の注文に追加できません。** Shopifyの注文編集APIはバンドル商品を拒否します。選択したアップセルバリエーションがバンドルの場合、結果は **When the order can't be modified** の設定に従います。
    * **Hide the offer and block late acceptances** の場合：バンドルのアップセルは非表示になり、顧客はこのオファーを通じて購入できません。
    * **Hide the offer, but allow late acceptances as a new order** または **Keep showing the offer and sell it as a new order** の場合：バンドルのアップセルは元の注文にマージされる代わりに、別の下書き注文として処理されます。

  バンドル商品や同一バリエーションのアップセルを常に顧客に提供したい場合は、**Create new draft order** に切り替えてください。
</Warning>

#### 注文を変更できない場合

**Modify original order** が選択されている場合、顧客がアップセルを承諾した時点で編集できない注文があります。ケースは次の3つに限られます：注文が**アーカイブ済み**である、**一部支払い済み**である、または以下で設定する**有効期限ウィンドウ**より古い。**When the order can't be modified** 設定は、これらのケースで何が起こるかを制御します。

**フルフィルメント済み**の注文はこれには含まれません。フルフィルメント済みの注文も編集は可能ですが、配送を必要としないアップセル商品のみをマージできます（下記の注記を参照）。

| オプション                                                         | 動作                                                                                                          |
| ------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- |
| **Hide the offer and block late acceptances**                 | 注文が編集できなくなるとオファーが非表示になります。注文が対象外になった後に届いた承諾はブロックされます。                                                       |
| **Hide the offer, but allow late acceptances as a new order** | 注文が編集できなくなるとオファーが非表示になります。オファーが非表示になる直前に顧客が承諾した場合（競合ウィンドウでの承諾）、アップセルは代わりに別の下書き注文として処理されます。新規ウィジェットのデフォルトです。 |
| **Keep showing the offer and sell it as a new order**         | 注文が編集可能かどうかにかかわらず、オファーは表示され続けます。注文を変更できない場合、承諾されたアップセルは別の下書き注文として処理されます。                                    |

2つのフォールバックオプションは、元の注文を変更できない場合に、アップセル用の別の下書き注文を作成します。顧客は支払いリンクを受け取り、新しい注文として購入を完了します。

#### 有効期限ウィンドウの設定

注文がマージ対象として有効な期間に制限を設定できます。**Consider the order uneditable after** フィールド（**Order handling** の動作セレクターの下にあります）に分数を入力します。注文の作成からその分数が経過すると、注文は対象外として扱われ、**When the order can't be modified** の動作が適用されます。

フィールドを空欄にするか **0** に設定すると、期限は設定されず、注文自体が編集可能である限りオファーは有効なままです。

これは、フルフィルメントのワークフローで注文を素早く処理しており、すでに処理中の可能性が高い注文へのマージを避けたい場合に便利です。

#### 「Modify original order」に関するその他の注意点

* 送料無料は自動的に適用され、無効にできません。
* 顧客が追加されたアップセルの支払いを完了するまで、元の注文は**一部支払い済み**とマークされます。支払いがキャプチャされると、Shopifyが自動的に注文を更新します。
* 注文がすでにフルフィルメント済みの場合、配送ラインがない場合、または配送を必要としない商品のみを含む場合、**配送を必要としない**アップセル商品のみをマージできます。配送を必要とする商品は、それらの注文ではオファーから除外されます。

### 送料無料

コンバージョンの向上に役立てるため、承諾されたアップセル商品に**送料無料**を提供できます。有効にすると、アップセルには送料が課金されず、元の注文には既存のShopify配送設定が引き続き適用されます。

Free shippingトグルの動作は、**Order handling** の設定によって異なります。

* **Modify original order** - 送料無料は承諾されたアップセルに自動的に適用され、トグルを無効にすることはできません。
* **Create new draft order** - Free shippingトグルは、アップセル用に作成される別の下書き注文に適用されます。有効にすると、下書き注文はアップセルのラインアイテムに送料なしで作成されます。その新しい注文にShopifyの通常の配送料を適用したい場合は、トグルをオフのままにしてください。

**Modify original order** の下でフォールバックにより別の下書き注文が作成される場合（例：同一バリエーションやバンドルのアップセル、注文が編集不可になった後の承諾）も同じ動作が適用されます。Free shippingトグルは、下書き注文がアップセルに送料なしで作成されるかどうかを制御します。

また、オファーに\*\*「Free Shipping」バッジ\*\*を表示し、バッジテキストをカスタマイズしてメリットを強調することもできます。
