ウィジェットとマイクロサイトのコンポーネントの解説

PXAコースを受講する

circle-check

コンポーネントとは、ヒーロー画像やタスクカードのような個々の構成要素で、あなたのAdvocateプログラムのウィジェットやマイクロサイトを構成するものです。これらの要素は 参加者体験 を形作り、ブランドに合わせてカスタマイズできます。

この記事では、ウィジェットおよびマイクロサイトエディターで利用可能なコンポーネントをカテゴリ別に一覧で紹介します。ほとんどのコンポーネントはスタイル設定とカスタマイズに対応していますが、一部にはデザイン上の制限があります。エディター画面内でコンポーネントの状態をプレビューすることもできます。

chevron-right統計hashtag

使用する 統計 コンポーネントを使って、参加者にプログラムでの進捗を知らせましょう。これらのコンポーネントが対応する統計の一覧については、 ウィジェットとマイクロサイトの統計.

コンポーネント
説明

ポイント残高

参加者のポイント残高を表示します。参加者にポイントを付与するAdvocateプログラムで使用されます。

獲得済みギフトカード

Advocateが獲得したギフトカード特典の数を表示します。

紹介

参加者が行った紹介の数を表示します。開始済みの紹介とコンバージョン済みの紹介が含まれます。

3つの統計を表示するコンテナ

3つの統計を表示するスペースを備えたテンプレートです。表示する統計は変更できます。必要に応じて統計を追加・削除できます。

その他の統計

任意の統計を表示します。紹介統計、各種報酬統計、またはカスタム統計を選択できます。

chevron-right共通コンポーネントhashtag

共通コンポーネント は、ウィジェットやマイクロサイト全体の機能性とデザインの一貫性を高めるために広く使用されます。ヒーロー画像、レイアウトの整形、プログラムの説明ステップなど、汎用的な視覚要素や構造要素を含みます。

コンポーネント
説明

2カラムのヒーロー画像

2カラムにまたがるバナー画像とヘッダーテキストです。画像、テキスト、背景色を更新できます。

オーバーレイヒーロー画像

テキストが重ねられたバナー画像です。画像、テキスト、背景色を更新できます。

画像

画像です。背景色、配置、高さ、幅を変更できます。

リンクボタン

選択したリンクへ参加者をリダイレクトするクリック可能なボタンです。ボタンの色はBrand Containerレベルで設定されたブランドカラーによって制御されます。

プログラム説明

Advocateプログラムの仕組み、たとえば報酬の獲得方法などを説明するテンプレートです。初期状態で2つの説明ステップが含まれます。さらにステップを追加できます。色はBrand Containerレベルで設定されたブランドカラーによって制御されます。

プログラム説明ステップ

プログラムの一部を説明するための補足テキストを追加します。プログラム説明コンポーネント内に収まります。色はBrand Containerレベルで設定されたブランドカラーによって制御されます。

プログラムタイムライン

紹介の流れと参加者向け報酬の概要を表示します。必要に応じてタイムラインの項目を追加または削除できます。円形アイコンと項目間の線の色は、Brand Containerレベルで設定されたブランドカラーによって制御されます。

タイムライン項目

プログラムタイムラインコンポーネント内に配置され、紹介の流れの1ステップを表示します。円形アイコンと項目間の線の色は、Brand Containerレベルで設定されたブランドカラーによって制御されます。

ユーザー名表示

参加者のフルネームを動的に取得します。参加者が名前を入力していない場合は、既定で「Anonymous User」が表示されます。

chevron-right報酬hashtag
circle-info

注: 報酬 コンポーネントは、検証済みアクセスのウィジェットとマイクロサイトでのみ使用できます。

コンポーネント
説明

タスクカードフィード

タスクカードを使うと、ユーザーはウィジェットやマイクロサイト上で直接アクションを実行したり、Advocateプログラムの目標に対する進捗を確認したりできます。このコンポーネントは、ウィジェットまたはマイクロサイトに複数のタスクカードを追加します。ボタンの色はBrand Containerレベルで設定されたブランドカラーによって制御されます。

報酬交換

参加者が獲得した報酬を別の種類の報酬に交換できるようにします。

この機能を使用するには、 報酬交換 を設定しておく必要があります。

報酬テーブル

参加者が獲得した報酬の一覧を表示します。手動報酬や、複数のAdvocateプログラムにわたって獲得した報酬を含めることができます。

顧客メモ列

報酬テーブルに別のメモ列を追加します。Reward tableコンポーネント内に配置する必要があります。

日付列

報酬テーブルに別の日付列を追加します。Reward tableコンポーネント内に配置する必要があります。

報酬列

報酬テーブルに別の報酬列を追加します。Reward tableコンポーネント内に配置する必要があります。

ソース列

報酬テーブルに別のソース列を追加します。Reward tableコンポーネント内に配置する必要があります。

ステータス列

報酬テーブルに別のステータス列を追加します。Reward tableコンポーネント内に配置する必要があります。

chevron-rightマイクロサイトコンポーネントhashtag

マイクロサイト コンポーネントは、主にマイクロサイトの登録フォームとナビゲーションサイドバーで使用されます。これらのコンポーネントはプログラムウィジェットに追加できません。

コンポーネント
説明

フォームのチェックボックスフィールド

登録フォームにチェックボックスを追加します。チェック済みかどうかを、Advocate参加者のカスタムフィールドにマッピングできます。詳細は「マイクロサイト登録フォームの送信内容を表示する」をご覧ください。

フォームのドロップダウンフィールド

カスタマイズ可能なリスト項目を持つドロップダウンリストを登録フォームに追加します。ユーザーが選択した項目を、Advocate参加者のカスタムフィールドにマッピングできます。これについてはサポートにお問い合わせください。

フォームの入力フィールド

自由記述のテキスト入力フィールドを登録フォームに追加します。ユーザーが入力したテキストを、Advocate参加者のカスタムフィールドにマッピングできます。 サポートにお問い合わせくださいarrow-up-right

フォームの名前フィールド

登録フォームに、入力可能な名と姓のフィールドを追加します。

サイドバー項目

マイクロサイトのサイドバーナビゲーションに新しいページまたはリンクを追加します。マイクロサイトのログイン後レイアウト内にのみ配置できます。

フォームのパスワードフィールド

登録フォームに入力可能なパスワードフィールドを追加します。

chevron-right即時アクセスhashtag

即時アクセス コンポーネントを使うと、紹介された友人が通常の登録プロセスを経ずに、簡単かつ迅速に登録したり報酬を引き換えたりできます。即時アクセスの紹介ウィジェットや友人登録フローを使用するプログラムに最適です。

コンポーネント
説明

クーポンコード

Fuel Tank報酬の引き換え可能なコードを表示します。

この 報酬フューエルタンク に、このコンポーネントが意図どおりに機能するための利用可能なクーポンコードが必要です。

Advocate登録

新しいAdvocateがメールアドレスを入力して登録し、紹介を行えるようにします。メールアドレスを入力すると、ユーザーは2つ目の画面に移動し、紹介共有リンクにアクセスできます。即時アクセスのWebsite Referral Widgetで使用されます。

現在のユーザーをサインアウト

閲覧者が個人向けの即時アクセス表示を終了できるようにします。

友人登録

紹介された友人がメールアドレスを入力して登録できるようにします。メールアドレスを入力すると、ユーザーは2つ目の画面に移動し、Coupon Code報酬にアクセスできます。即時アクセスのFriend Widgetで使用されます。

chevron-rightレイアウトhashtag

レイアウト コンポーネントを使うと、他のコンポーネントを整理してまとめることができます。セクション、行、列、タブの作成に使用します。

コンポーネント
説明

2カラムのヒーローレイアウト

2カラムのコンテンツを特徴とするヒーローレイアウトを追加します。

行レイアウトコンテナ

コンテンツ用の新しい行コンテナを追加します。行内には他のコンポーネントを配置できます。

列レイアウトコンテナ

コンテンツ用の新しい列コンテナを追加します。列内には他のコンポーネントを配置できます。

タブ

汎用タブグループに新しいタブを追加します。

汎用タブグループ

タブのグループを追加します。各タブには異なるコンポーネントとコンテンツを含めることができます。初期状態で3つのタブがありますが、必要に応じてタブを削除または追加できます。

見出し付きセクション

見出しと段落テキストを含む新しいセクションを追加します。見出しの下に、Titled sectionに他のコンポーネントを追加できます。

chevron-right請求書hashtag

請求書 コンポーネントを使うと、収益データを表示するための請求書コンポーネントを挿入できます。

コンポーネント
説明

請求書テーブル

収益データを格納する展開可能な請求書アコーディオンを追加します。

請求書テーブルの日付列

請求書テーブルコンポーネントに新しい列を追加します。

この リーダーボード コンポーネントを使うと、プログラム参加者を順位付けし、上位の参加者に報酬を提供し、より大きな成果を生み出すよう参加者を促せます。リーダーボードを 検証済みアクセスウィジェット または マイクロサイトに追加し、スコアリングシステム、ランキングシステム、参加者の絞り込みオプションを設定できます。詳細は以下の記事をご覧ください:

コンポーネント
説明

紹介開始

このタイプのリーダーボードは、開始した紹介の数に基づいて参加者を順位付けします。顧客Advocateのスコアは、開始した紹介の数に対応します。

紹介コンバージョン

このタイプのリーダーボードは、コンバージョンした紹介の数に基づいて参加者を順位付けします。紹介は、紹介された友人が購入など、あなたが定義した価値のあるプログラム目標を達成した時点でコンバージョン済みと見なされます。顧客Advocateのスコアは、コンバージョンした紹介の数に対応します。

獲得ポイント

このタイプのリーダーボードは、ポイントを付与するAdvocateプログラムで獲得したポイント総数に基づいて参加者を順位付けします。保留中またはキャンセル済みでない限り、すべての報酬単位ポイントがカウントされます。このリーダーボードタイプは、ポイント報酬タイプにのみ有効です。

匿名リーダーボード

他のプログラム参加者に関する個人を特定できる情報を一切表示しない、完全匿名版のリーダーボードです。任意のリーダーボードタイプを表示できます。

chevron-right税金と現金hashtag

税金と現金 コンポーネントを使うと、税務フォームの収集と現金支払いオプションを 検証済みアクセスウィジェット または マイクロサイト.

このコンポーネントグループは、 現金支払い 機能がアカウントで有効になっている場合にのみ利用できます。

コンポーネント
説明

支払いステータスアラート

現金支払いを受け取る前に必要な対応を参加者に通知します。このコンポーネントには、参加者を支払い設定の確認画面へ移動させるCTAボタンが含まれます。

必要に応じて、コンポーネント表示時に参加者に見えるテキスト説明を自由にカスタマイズできます。

マイクロサイトおよびウィジェットの現金支払いフォーム

参加者の銀行情報や、W-8やW-9のような該当する税務フォームを収集するフォームを挿入します。

必要に応じて、フォーム表示時に参加者に見えるテキスト説明を自由にカスタマイズできます。

このコンポーネント内で検証アラートや要件を設定することもできます。

chevron-right共有hashtag

共有 コンポーネントを使うと、参加者が紹介リンクやコードを複数のチャネルで簡単に प्रचारできます。参加者が共有ボタンをクリックすると、 Facebook, LinkedIn, WhatsApp、または メールなどの選択したチャネルが開き、あらかじめ入力されたメッセージまたはリンクを送信できる状態になります。

Referral Codeのような一部のコンポーネントでは、参加者固有の紹介コードまたはプロモコードをコピーしてすぐ共有できるオプション付きで表示します。Promo Codesのような他のコンポーネントでは、複数の利用可能なコード(割り当てられている場合)をスライダー表示で提示し、共有ボタンも含めることで、参加者が選択したコードを即座に投稿または送信できます。これらのツールにより、参加者が簡単に情報を広め、新しい紹介を促進できます。

コンポーネント
説明

紹介コード

クリップボードにコピーするオプション付きの紹介コードフィールドを表示します。Promo Codes機能の一部として使用されます。

プロモコード

あらかじめ整形されたコンポーネントブロックで、紹介プロモコードフィールドと、複数のコードが割り当てられている場合にそれらを切り替えるためのスライダーが含まれます。また、共有リンクと、Facebook、LinkedIn、Twitter / Xの共有ボタンコンポーネントも含まれます。

Facebook共有ボタン

カスタマイズ可能なテキスト付きのFacebookで共有ボタンを表示します。クリックすると、ブランドのソーシャルメッセージがあらかじめ入力された状態で、ユーザーのFacebookプロフィール上の新しい投稿へリダイレクトされます。

X共有ボタン

カスタマイズ可能なテキスト付きのXで共有ボタンを表示します。クリックすると、ブランドのソーシャルメッセージがあらかじめ入力された状態で、ユーザーのXアカウント上の新しい投稿へリダイレクトされます。

メール共有ボタン

カスタマイズ可能なテキスト付きのメールで共有ボタンを表示します。クリックすると、ユーザーの既定のメールアプリケーションが開き、ブランドのソーシャルメッセージがあらかじめ入力された新しいメールが作成されます。

モバイル共有シートボタン

参加者のWebブラウザー内で共有するためのボタンを表示します。クリックすると、リンクを共有するために開ける利用可能なアプリの一覧メニューが開きます。アプリを選択すると、ブランドのソーシャルメッセージがあらかじめ入力された新しい投稿またはメッセージが作成されます。

LinkedIn共有ボタン

カスタマイズ可能なテキスト付きのLinkedInで共有ボタンを表示します。クリックすると、ブランドのソーシャルメッセージがあらかじめ入力された状態で、ユーザーのLinkedInプロフィール上の新しい投稿へリダイレクトされます。

SMS共有ボタン

カスタマイズ可能なテキスト付きの友人にテキスト送信ボタンを表示します。クリックすると、ユーザーの既定のSMS/テキストメッセージアプリにリダイレクトされ、ブランドのソーシャルメッセージがあらかじめ入力された新しいSMS/テキストメッセージが作成されます。

Messenger共有ボタン

カスタマイズ可能なテキスト付きのMessengerで共有ボタンを表示します。クリックすると、ブランドのソーシャルメッセージがあらかじめ入力された状態で、ユーザーのFacebook Messengerアプリの新しいメッセージへリダイレクトされます。

WhatsApp共有ボタン

カスタマイズ可能なテキスト付きのWhatsAppで共有ボタンを表示します。クリックすると、ブランドのソーシャルメッセージがあらかじめ入力された状態で、ユーザーのWhatsappアカウントの新しいメッセージへリダイレクトされます。

LINE共有ボタン

カスタマイズ可能なテキスト付きのLine Messengerで共有ボタンを表示します。クリックすると、ブランドのソーシャルメッセージがあらかじめ入力された状態で、ユーザーのLine Messengerアプリの新しいメッセージへリダイレクトされます。

Pinterest共有ボタン

カスタマイズ可能なテキスト付きのPinterestで共有ボタンを表示します。クリックすると、ブランドのソーシャルメッセージがあらかじめ入力された状態で、ユーザーのPinterestプロフィール上の新しい投稿へリダイレクトされます。

共有リンク

このプログラムの参加者の共有リンクを表示します。

QRコード

このプログラムの参加者の共有リンクをQRコード形式で表示します。

chevron-right紹介hashtag

紹介 コンポーネントは、参加者が紹介した友人とそのコンバージョン状況に関する情報を表示します。誰を紹介したか、いつコンバージョンしたか、そしてその紹介によって獲得した報酬を簡単に追跡できます。

コンポーネント
説明

紹介カード

あらかじめ整形されたコンポーネントブロックで、 プログラムタイムライン, 共有リンク、および Facebook, LinkedIn、 そして Twitter / X の共有ボタンコンポーネントが含まれます。必要に応じて他のコンポーネントを追加または削除できます。

紹介テーブル

参加者が紹介した友人、コンバージョン日、コンバージョン状況を表示する表を表示します。

紹介テーブルの日付列

紹介テーブルに別の日付列を追加します。Referral tableコンポーネント内に配置する必要があります。

紹介テーブルの報酬列

紹介テーブルに別の報酬列を追加します。Referral tableコンポーネント内に配置する必要があります。

紹介テーブルのステータス列

紹介テーブルに別のステータス列を追加します。Referral tableコンポーネント内に配置する必要があります。

紹介テーブルのユーザー列

紹介テーブルに別の顧客(紹介された友人)列を追加します。Referral tableコンポーネント内に配置する必要があります。

chevron-right詳細設定hashtag

詳細設定コンポーネントを使うと、参加者に何をいつ見せるかをより細かく制御できます。条件付きコンテンツ表示、プログラムの上書き、特定の対象向けに体験を調整するのに役立つその他の特殊な設定が可能です。

コンポーネント
説明

条件付きエリア / セグメント

参加者が特定の ユーザーセグメント.

に属する場合にのみ、このセクションのコンテンツを表示します。ユーザーセグメントを設定するには、コンポーネントのプロパティを開き、 条件 フィールド内のJSONata式を編集します。

設定したセグメント内のユーザーには条件付きセクションに表示されたすべてのコンテンツが見えますが、セグメント外のユーザーにはコンテンツは表示されません。

条件付きエリア / フィールド

参加者のプロフィール上の カスタムフィールド に特定の値が含まれている場合にのみ、このセクションのコンテンツを表示します。

カスタムフィールド名と値を設定するには、コンポーネントのプロパティを開き、 条件 フィールド内のJSONata式を編集します。

正しいカスタムフィールド値を持つユーザーには条件付きセクションに表示されたすべてのコンテンツが見えますが、正しいカスタムフィールド値を持たないユーザーにはコンテンツは表示されません。

プログラムセクション

プログラムセクションコンポーネントを使うと、子コンポーネントのプログラムIDを上書きできます。特定のプログラムに紐づかないコンテンツを表示したいときに使用します。ほとんどのウィジェットおよびマイクロサイトテンプレートに既定で含まれています。

chevron-rightタイポグラフィhashtag

タイポグラフィコンポーネントを使うと、ウィジェットやマイクロサイトに整形済みのテキストブロックを追加できます。以下から選択してください:

  • 段落

  • 見出し1

  • 見出し2

  • 見出し3

  • 見出し4

最終更新

役に立ちましたか?