Adobe Experience Platform Web SDK can deliver and render personalized experiences managed in Adobe Target to the web channel. You can use a WYSIWYG editor, called the Visual Experience Composer (VEC), or a non-visual interface, the Form-based Experience Composer, to create, activate, and deliver your activities and personalization experiences.
To enable Target, you need to do the following:
renderDecisions
option to your events.Then, optionally, you can also:
decisionScopes
to your events to retrieve specific activities (useful for activities created with the form-based composer).In order to use the VEC with a Platform Web SDK implementation, you need to install and activate either the Firefox or Chrome VEC Helper Extension.
Adobe Experience Platform Web SDK has the power to automatically render your experiences defined via Adobe Target’s VEC on the web for your users. In order to indicate to Adobe Experience Platform Web SDK to auto-render VEC activities, send an event with renderDecisions = true
:
alloy
("sendEvent",
{
"renderDecisions": true,
"xdm": {
"commerce": {
"order": {
"purchaseID": "a8g784hjq1mnp3",
"purchaseOrderNumber": "VAU3123",
"currencyCode": "USD",
"priceTotal": 999.98
}
}
}
}
);
The Form-Based Experience Composer is a non-visual interface that’s useful for configuring A/B Tests, Experience Targeting, Automated Personalization, and Recommendations activities with different response types such as JSON, HTML, Image, etc. Depending on the response type or decision returned by Adobe Target, your core business logic can be executed. To retrieve decisions for your Form-Based Composer activities, send an event with all ‘decisionScopes’ you want to retrieve a decision for.
alloy
("sendEvent", {
decisionScopes: [
"foo", "bar"],
"xdm": {
"commerce": {
"order": {
"purchaseID": "a8g784hjq1mnp3",
"purchaseOrderNumber": "VAU3123",
"currencyCode": "USD",
"priceTotal": 999.98
}
}
}
}
);
decisionScopes
defines sections, locations, or parts of your pages where you would like to render a personalized experience. These decisionScopes
are customizable and user-defined. For current [!DNL Target] customers, decisionScopes
are also known as “mboxes.” In the [!DNL Target] UI, decisionScopes
appear as “locations.”
__view__
ScopeAdobe Experience Platform Web SDK provides functionality where you can retrieve VEC actions without relying on the SDK to render the VEC actions for you. Send an event with __view__
defined as as a decisionScopes
.
alloy("sendEvent", {
"decisionScopes": ["__view__", "foo", "bar"],
"xdm": {
"web": {
"webPageDetails": {
"name": "Home Page"
}
}
}
}
).then(function(results) {
for (decision of results.decisions) {
if (decision.decisionScope === "__view__") {
console.log(decision.content)
}
}
});
When defining Audiences for your Target activities that will be delivered via Adobe Experience Platform Web SDK, XDM must be defined and used. After you define XDM schemas, classes, and mixins, you can create a Target audience rule defined by XDM data for targeting. Within Target, XDM data displays in the Audience Builder as a custom parameter. The XDM is serialized using dot notation (for example, web.webPageDetails.name
).
If you have Target activities with predefined audiences that use custom parameters or a user profile, be aware that they won’t be delivered correctly via the SDK. Instead of using custom parameters or the user profile, you must use XDM instead. However, there are out-of-the-box audience targeting fields supported via Adobe Experience Platform Web SDK that do not require XDM. These are the fields available in the Target UI that do not require XDM:
Decisions: In Target, these correlate to the experience that is selected from an Activity.
Schema: The schema of a decision is the type of offer in Target.
Scope: The scope of the decision. In Target, this is the mBox. The global mBox is the __view__
scope.
XDM: The XDM is serialized into dot notation and then put into Target as mBox parameters.