# Shopifyの購入後ウィジェット

紹介は、トラフィックの多い購入後ページから頻繁に生まれます。そのため、これらは紹介プログラムを促進するのに最適な場所です。Shopify Post-Checkout Widget を使えば、購入直後に顧客とシームレスに関わることができ、紹介を促進します。Shopify の拡張性フレームワークを活用することで、このウィジェットは洗練されたブランド体験を提供し、プログラムの効果を最大化します。

このプログラムがここに表示されていない場合、価値あるエンゲージメントの機会を逃し、すでにこれらの場所を活用している競合に後れを取っている可能性があります。

#### Shopify の購入後ウィジェットとは何ですか？

当社の Post-Checkout Widget は **Shopify Checkout Extensibility** を活用して、購入後ページにブランド付きの紹介CTA（行動喚起）を配置します。これは人気の [Instant Access Widget](/brand/ja/nitsuitebitaidesuka/advocate-program/manage-advocate-participant-experiences/widget-experiences/set-up-an-instant-access-widget.md) を踏襲しており、以下をサポートします：

* 埋め込み表示
* ポップアップモーダル表示

どちらのバージョンにも、2つの主要なウィジェット状態があります。

* メール取得 / ユーザー識別
* 紹介詳細を表示する共有ページ

#### 主な機能

Shopify Post-Checkout Widget は、紹介エンゲージメントを最大化するために設計されています。2段階のフローを備えており、まずユーザーのメールアドレスを収集して本人確認を行い（まだShopifyにログインしていない場合）、その後、パーソナライズされた紹介リンクまたはコードと共有ボタンを表示します。ログイン済みの Shopify ユーザーの場合、このメール入力ステップは完全に省略され、よりシームレスな体験になります。

このウィジェットは埋め込み表示とポップアップ表示の両方に対応しているため、ストアのレイアウトや顧客体験に最適な形式を選べます。紹介プログラムとシームレスに連携し、参加者プロフィールの作成または更新を行い、共有リンク、紹介コード、ソーシャル共有オプションなど必要な紹介データを取得します。共有ボタンは最大3つまで表示でき、Email、Facebook、WhatsApp、Messenger、LinkedIn、X（旧Twitter）、SMS などのプラットフォームに対応しています。

カスタマイズは中核機能です。見出し、サブ見出し、CTAボタン、共有メッセージなど、各ステップのコンテンツを調整できます。さらに、ブランディング強化のためにウィジェット上部へ画像を追加することも可能です。重要なのは、これらすべての設定を Shopify Page Editor 内で行えるため、Shopify 管理画面を離れずに簡単に調整できることです。

さらに、このウィジェットはサイトのブランディングを引き継ぐよう設計されているため、色やフォントを手動で設定する必要はありません。これにより、ストア全体で一貫した見た目と雰囲気を保てます。

#### ウィジェットをサイトに追加する

Advocate ウィジェットを Shopify ストアに追加するには：

1. 次に移動します *テーマエディター*.
2. を選択 **ページナビゲーター** 画面上部で、次を選択します **チェックアウトと顧客アカウント**.
3. 上記の手順を次のページに対して繰り返します *Thank you* ページ。
4. メインセクションで、次を選択します **ブロックを追加**、次に次を選択します **Advocate Referral Widget** を Impact.com の統合セクションから選択します。

#### ウィジェットのフロー

このウィジェット体験は、ユーザーを2つの簡単なステップへ導くように設計されています。

{% stepper %}
{% step %}

#### **ステップ1：**

ウィジェットは、Shopify にすでにログインしている場合を除き、顧客に氏名とメールアドレスの入力を促します。ログイン済みであれば、このステップは自動的に省略されます。ユーザー情報が取得されると、その人は新しい参加者としてプログラムに追加されるか、すでに参加している場合は詳細が更新されます。

<div data-with-frame="true"><figure><img src="/files/66a9c0277dcb99f13961e32e22483b96cd712177" alt="" width="484"><figcaption></figcaption></figure></div>
{% endstep %}

{% step %}

#### **ステップ2：**

顧客には紹介情報が表示されます。プログラムの設定に応じて、一意の紹介リンクまたは紹介コードが含まれます。ウィジェットには最大3つの共有ボタンも表示され、紹介情報の上に短いメッセージを追加して共有を促し、プログラムの利点を強調することもできます。

<div data-with-frame="true"><figure><img src="/files/b47f4c210def4b625aebe5550ddd29a86b5628ee" alt="" width="492"><figcaption></figcaption></figure></div>
{% endstep %}
{% endstepper %}

**カスタマイズオプション**

すべてのビジュアルコンテンツは、ブランドのトーンに合わせて設定できます。これらのカスタマイズは、 **Shopify Page Editor** 内で直接利用できるため、使いやすくなっています。

| カスタマイズ         | 編集可能なセクション                                                                                                                                                                                                                                                                                                                             |
| -------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ウィジェット状態間で共通   | <p>• 画像URL（任意）</p><p>• 見出し（必須）</p><p>• サブ見出し（任意）</p><p>• 利用規約リンク（任意）</p>                                                                                                                                                                                                                                                               |
| ポップアップ固有のオプション | • CTAボタンのラベル（例：「今すぐ始める」）                                                                                                                                                                                                                                                                                                               |
| メール収集オプション     | <p>• 「紹介を始める」ボタンのCTA</p><p>• 氏名フィールド（任意）</p>                                                                                                                                                                                                                                                                                           |
| 共有情報オプション      | <p>• リンク上部に表示するカスタムテキスト</p><p>• 共有ボタンの媒体を最大3つ選択：</p><p>• Email</p><p>• SMS</p><p>• Facebook</p><p>• Facebook Messenger</p><p>• WhatsApp</p><p>• LinkedIn</p><p>• X（Twitter）</p><p>• 直接リンク</p><p>• Email</p><p>• SMS</p><p>• Facebook</p><p>• Facebook Messenger</p><p>• WhatsApp</p><p>• LinkedIn</p><p>• X（Twitter）</p><p>• 直接リンク</p> |


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.impact.com/brand/ja/nitsuitebitaidesuka/advocate-program/manage-advocate-participant-experiences/widget-experiences/shopify-post-checkout-widget.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
