Platform Web SDKを使用したAdobe Targetの設定

Adobe Experience Platform Web SDK を使用してAdobe Target を実装する方法について説明します。 エクスペリエンスを配信する方法と、追加パラメーターを Target に渡す方法について説明します。

Adobe Targetは、顧客体験をカスタマイズおよびパーソナライズするために必要なすべてを提供するAdobe Experience Cloud アプリケーションです。web サイト、モバイルサイト、アプリ、その他のデジタルチャネルで売上を最大化できます。

学習目標

このレッスンの最後では、TargetのWeb SDK実装で次のことができます。

前提条件

このセクションのレッスンを完了するには、まず次のことをおこなう必要があります。

ちらつき処理の追加

開始する前に、タグライブラリの読み込み方法に応じて、追加のちらつき処理ソリューションが必要かどうかを判断します。

非同期実装

タグライブラリが非同期で読み込まれると、Targetがデフォルトコンテンツをパーソナライズされたコンテンツに置き換える前に、ページのレンダリングが終了する場合があります。 この動作により、「ちらつき」と呼ばれる場合があります。これは、パーソナライズされたコンテンツに置き換えられる前に、デフォルトのコンテンツが簡単に表示されます。 このようなフリッカーを避けたい場合は、非同期タグ埋め込みコードの直前に特別な事前非表示スニペットを追加することをお勧めします。

このスニペットは既にLuma サイトに存在していますが、このコードが何をするのかを詳しく見てみましょう。

<script>
  !function(e,a,n,t){var i=e.head;if(i){
  if (a) return;
  var o=e.createElement("style");
  o.id="alloy-prehiding",o.innerText=n,i.appendChild(o),setTimeout(function(){o.parentNode&&o.parentNode.removeChild(o)},t)}}
  (document, document.location.href.indexOf("adobe_authoring_enabled") !== -1, ".personalization-container { opacity: 0 !important }", 3000);
</script>

事前非表示スニペットは、ページの先頭にスタイルタグを作成し、選択したCSS定義を使用します。 このスタイルタグは、Targetからの応答を受信したとき、またはタイムアウトに達したときに削除されます。

事前非表示の動作は、スニペットの最後にある2つの設定によって制御されます。

タグ内では、事前非表示のスニペットも使用できます。

同期実装

Adobeでは、Luma サイトで示すように、タグを非同期で実装することをお勧めします。 ただし、タグライブラリが同期して読み込まれる場合、事前非表示スニペットは必要ありません。 代わりに、事前非表示スタイルはPlatform Web SDK拡張機能の設定で指定されます。

同期実装の事前非表示スタイルは、次のように設定できます。

Platform Web SDKでのフリッカーの管理方法について詳しくは、ガイドの節「​ パーソナライズされたエクスペリエンス用フリッカーの管理」を参照してください。

データストリームの設定

Target アクティビティをPlatform Web SDKで配信する前に、データストリーム設定でTargetを有効にする必要があります。

データストリームでTargetを設定するには：

プロパティトークン

Target Premiumのお客様は、プロパティを使用してユーザー権限を管理できます。 ターゲットプロパティを使用すると、ユーザーがTarget アクティビティを実行できる場所の境界を設定できます。 詳しくは、Target ドキュメントの​ エンタープライズ権限 セクションを参照してください。

プロパティトークンを設定または検索するには、Adobe Target > 管理 > プロパティ​に移動します。 </> アイコンに実装コードが表示されます。 at_property値は、データストリームで使用するプロパティ トークンです。

データストリームごとに1つのプロパティトークンのみを指定できますが、プロパティトークンのオーバーライドを使用すると、データストリームで定義されたプライマリプロパティトークンを置き換える代替プロパティトークンを指定できます。 データストリームを上書きするには、sendEvent アクションの更新も必要です。

ターゲット環境ID

Targetの環境は、開発のあらゆる段階で実装を管理するのに役立ちます。 このオプション設定では、各データストリームで使用するTarget環境を指定します。

Adobeでは、作業をシンプルにするために、開発用、ステージング用、実稼動用の各データストリームごとにTarget Environment IDを異なる方法で設定することをお勧めします。 または、hosts機能を使用して、Target インターフェイスで環境を整理することもできます。

環境IDを設定または検索するには、Adobe Target > 管理 > 環境​に移動します。

Target サードパーティ ID名前空間

このオプション設定では、Target サードパーティ IDに使用するID シンボルを指定できます。 Targetは、単一のID シンボルまたは名前空間でのプロファイル同期のみをサポートします。 詳しくは、Target ガイドの「Real-Time profile syncing for mbox3rdPartyId」セクションを参照してください。

ID記号は、データ収集 > 顧客 > ID​のID リストにあります。

Luma サイトを使用するこのチュートリアルでは、IDに関するレッスン中に設定されたID シンボル lumaCrmIdを使用します。

視覚的なパーソナライゼーション決定のレンダリング

Adobe Target visual experience composerで作成されたエクスペリエンスを指します。 まず、Target インターフェイスとタグインターフェイスで使用される用語を理解する必要があります。

​ イベントを送信 アクションを更新します

データストリームでTargetが有効になっている場合、Targetからのビジュアルパーソナライゼーションの意思決定は、Platform Web SDKによって配信されます。 ただし、自動的にレンダリングされません。 自動レンダリングを有効にするには、​ イベントを送信 アクションを更新する必要があります。

「視覚的なパーソナライゼーションのレンダリング」の設定により、Platform Web SDKは、Target Visual Experience Composerまたは「グローバル mbox」を使用して指定された変更を自動的に適用します。

カスタムコードを使用して、これらの決定に対してレンダリングまたはアクションを実行する場合は、視覚的パーソナライゼーション決定のレンダリング ​設定を無効のままにすることができます。 Adobe Experience Platform Web SDKには、あらゆるコンテンツを柔軟に管理するための機能が揃っています。 パーソナライズされたコンテンツの手動でのレンダリング ​について詳しくは、ガイドを参照してください。

Visual Experience Composerを使用したTarget アクティビティの設定

基本的な実装部分が完了したら、Targetでエクスペリエンスターゲティング（XT）アクティビティを作成して、すべてが正しく動作していることを検証します。 サポートが必要な場合は、​ エクスペリエンスのターゲット設定アクティビティの作成に関するTarget チュートリアルを参照してください。

デバッガーを使用した検証

アクティビティを設定すると、ページにコンテンツがレンダリングされます。 ただし、アクティビティがライブでない場合でも、イベントの送信ネットワーク呼び出しを確認して、Targetが適切に設定されていることを確認することもできます。

カスタム決定範囲の設定とレンダリング

カスタムの決定範囲（旧称「mbox」）を使用すると、Target フォームベースのExperience Composerを使用して、HTMLまたはJSON コンテンツを構造化された方法で配信できます。 これらのカスタムスコープのいずれかに配信されたコンテンツは、Platform Web SDKによって自動的にレンダリングされません。 タグのアクションを使用してレンダリングできます。

​ イベント送信アクション ​にスコープを追加

ページ読み込みルールを変更して、カスタム決定範囲を追加します。

Targetからの応答の処理

これで、homepage-hero スコープのコンテンツをリクエストするようにPlatform Web SDKを設定したので、応答を使用して何かする必要があります。 Platform Web SDK タグ拡張機能は、Send Event Complete イベントを提供します。このイベントを使用すると、Send Event アクションからのレスポンスを受信したときに、新しいルールをすばやくトリガーできます。

フォームベースのExperience Composerを使用したTarget アクティビティの設定

カスタムの決定範囲を手動でレンダリングするルールを用意したので、Targetで別のエクスペリエンスターゲティング（XT）アクティビティを作成できます。 今回は、フォームベースのExperience Composerを使用します。

デバッガーを使用した検証

アクティビティをアクティベートすると、ページにコンテンツのレンダリングが表示されます。 ただし、アクティビティがライブでない場合でも、​ イベントを送信 ネットワーク呼び出しを確認して、Targetがカスタムスコープのコンテンツを要求していることを確認することもできます。

Targetにパラメーターを送信

このセクションでは、Target固有のデータを渡し、XDM データがTarget パラメーターにどのようにマッピングされるかを詳しく見ていきます。

ページ（mbox）パラメーターとXDM

すべてのXDM フィールドは、​ ページパラメーターまたはmbox パラメーターとしてTargetに自動的に渡されます。

これらのXDM フィールドの一部は、Targetのバックエンドの特殊オブジェクトにマッピングされます。 例えば、web.webPageDetails.URLは、URL ベースのターゲティング条件を作成したり、プロファイルスクリプトを作成する際にpage.url オブジェクトとして自動的に使用できます。

データオブジェクトを使用してページパラメーターを追加することもできます。

特殊パラメーターとデータオブジェクト

XDM オブジェクトからマッピングされていないTargetに有用なパラメーターがあります。 Targetの特別なパラメーターには、次のものが含まれます。

これらのパラメーターは、xdm オブジェクトではなく、data オブジェクトで送信する必要があります。 さらに、ページ（またはmbox）パラメーターをdata オブジェクトに含めることもできます。

データオブジェクトを設定するには、​ データ要素の作成 レッスンで作成したデータ要素を再利用して、次のデータ要素を作成します。

ページ読み込みルールの更新

XDM オブジェクト外のTargetに追加データを渡すには、該当するルールを更新する必要があります。 この例では、新しい​data.content データ要素を汎用ページ読み込みルールと製品ページ表示ルールに含めるだけで、変更を加える必要があります。

PersonalizationとAnalytics リクエストの分割

Luma サイトでは、データレイヤーが迅速に読み込まれ、イベントの送信の呼び出しが発生する前に完全に定義されます。 これにより、1回の呼び出しを使用して、パーソナライズされたコンテンツ（例：Adobe Target）を取得し、分析データ（例：Adobe Analytics）を送信できます。

しかし、多くのweb サイトでは、両方のアプリケーションに対して1回の呼び出しを使用できるほど、データレイヤーを早い段階で読み込むことができません。 このような状況では、1回のページ読み込みに2つの​ イベント送信 アクションを使用し、最初のアクションをパーソナライゼーションに、2番目のアクションを分析に使用できます。 このようにイベントを分割すると、Analytics イベントを送信する前にデータレイヤーが完全に読み込まれるのを待ちながら、パーソナライゼーションイベントを可能な限り早く開始できます。 これは、多くのWeb以前のSDK実装と同様に、Adobe Targetはページの上部にtarget-global-mboxを呼び出し、Adobe Analyticsはページの下部にs.t()呼び出しを呼び出します。

2回目の呼び出しでは、パーソナライズされたコンテンツのすべてのビューをレポートし、decisioning.propositionDisplay件の呼び出しを置き換える責任も負います。

パーソナライゼーションオントップリクエストを作成するには：

分析オンボトムリクエストを作成するには、次の手順に従います。

デバッガーを使用した検証

ルールが更新されたので、Adobe Debuggerを使用してデータが正しく渡されているかどうかを検証できます。

Target インターフェイスでの検証

次に、Target インターフェイスで、データが受信され、オーディエンスやアクティビティで使用できることを確認します。 XDM データは、カスタムターゲットパラメーターに自動的にマッピングされます。 XDM データがTargetによって受信され、オーディエンスを作成することによって使用可能であることを検証できます。

次に、ログイン状態プロファイル属性が正常に渡されたことを検証します。

Target Premiumを使用している場合は、エンティティデータが正しく渡され、商品データがRecommendations商品カタログに書き込まれたかどうかも検証できます。

Assurance での検証

さらに、適切な場所でAssuranceを使用して、Target Decisioning リクエストが正しいデータを取得していること、およびサーバーサイド変換が正しく行われていることを確認できます。 また、Target DecisioningとAdobe Analytics呼び出しが個別に送信される場合でも、Adobe Analytics呼び出しにキャンペーンとエクスペリエンスの情報が含まれていることを確認できます。

これにより、後でAnalytics トラッキング呼び出しがページ上で実行されたときに、ターゲット決定コールを実行したときに後で送信するためにキューに入れられたA4T情報が正しく送信されたことが確認されます。

このレッスンを完了したら、Platform Web SDKを使用してAdobe Targetを実際に実装する必要があります。