Discusses how to create Experience Fragments and use them in Personalization use cases. Adobe Experience Manager and Adobe Target are used in this article.
A special thank you to Ratna Kumar Kotla, a top AEM community member, for testing this article to ensure it works.
|Digital Marketing Solution(s)||Adobe Experience Manager 6.3/ Adobe Target|
To folllow along with this article, you require credentials to Adobe Target Classic.
However, you can perform this use case by using the Experience Manager ContextHub. For information, see Working with Experience Fragments and the Experience Manager ContextHub.
When working with Adobe Experience Manager and Adobe Target to create personalization use cases, you can use Experience Fragments to change the content that is displayed. Experience Fragments are a new feature introduced in AEM 6.3. They allow content authors to reuse content across channels including Sites pages and 3rd party systems. For more information, see Using AEM Experience Fragments.
Using Experience Fragments, you can display content based on the audience. For example, some users may see this content.
The Experience Fragment component is targeted by using Adobe Target.
Create the Experience Fragment that is targeted by using Adobe Target by performing these steps:
1. Enter the following URL into your web browser: http://localhost:4502/aem/start.html.
2. Click on Experience Fragments.
3. Click the Create button, Experience Fragment.
4. Specify my-first-xf as the title and description as shown in this illustration.
Repeat this procedure to create a second Experience Fragment and name it my-second-xf. Specify a different image and text value. Both Experience Fragments are used later in this article.
To successfully setup personal experiences using Experience Manager and Adobe Target, you must configure Adobe Target from within Experience Manger. Perform these tasks:
1. Login to Marketing.adobe.com at http://localhost:4502/libs/cq/core/content/tools/cloudservices.html.
2. Select Target, Configure now.
5. Enter the following information:
- Client Code of Adobe Target (this can be retrieved from the Adobe Target UI -> Setup -> Implementation -> Edit at.js Settings)
- Email: - Adobe Target Classic email
- Password: - Adobe Target Classic password.
If you do not have Adobe Target Classic credentials, then reach out to AEM support to create an account for you. This procedure only works for Target Classic.
Create a Target Audience on which the personal experience is based. In this article, the audience is based on the Chrome and Firefox browers. That is, if the user views the Experience Manager web page with Chrome, they will see the content different from a user viewing the content with Firefox.
These two audiences are created in this section:
Perform these tasks:
2. Click Create, Target Audience.
5. Specify the following values into the rule:
Refer to the following illustration.
8. Click Save.
9. Repeat this procedure and name the rule AEM_TC_FireFox and base the rule on Firefox, as shown in this illustration.”
From within Experience Manager, you need to configure an Experience Manager page to use the Adobe Target configuration value that was created earlier in this article. In this article, the sample We Retail web site is used. Perform these steps:
1. Go to the following URL: http://localhost:4502/editor.html/content/we-retail/ca/en/experience.html.
2. From the Top menu, click Open Properties.
3. Click the Cloud Services tab and uncheck the uncheck the Inherited from /content/we-retail checkbox.
4. Click the Add Configuration drop-down field, and select Adobe Target.
Add an Experience Fragment component to an Experience Manager page. This component is Targeted by using Adobe Target.
Perform these steps:
1. Open the AEM We Retail web page at http://localhost:4502/editor.html/content/we-retail/ca/en/experience.html.
2. Drag the Experience Fragment component from the Side Rail onto the page, as shown in this illustration.
For this article, ensure that you only add one Experience Fragment component to the page.
The Experience Fragment component is targeted by Adobe Target and whose content will change based on the audience.
In order to change the content, which represents the web visitor experience, you have to target the component. In this example, the Experience Fragment component is targeted and its content changes based on the audience. That is, if the user is using the Chrome browser, they will see an image that is different from a user using Firefox.
To target an Experience Fragment component, perform these steps:
1. Change the mode to Targeting, as shown here (once
.Adobe Target configuration is added, targeting mode option is visible).
2. Click the + icon to create a new activity. Add the following values:
- Name - AEM_TE_Activity
- Target Engine - Adobe Target
- Select Target configuration: AEM_Target_TE
- Activity type - Experience Targeting
3. Click the Create button. You will see a message indicating that the activity was successfully created.
4. Click on the Start Targeting button.
5. On right hand side click on + icon to add Experience Targeting option.
6. Select the audience AEM_TC_Chrome.
8. Click on the AEM_TE_CHROME audience and then click on the Experience Fragment component. You will see the configuration toolbar pop up, as shown here.
9. Click the wrench icon. The Experience Fragment dialog appears. Select /content/experience-fragments/my-first-xf/my-first-xf from the drop-down field.
12. Repeat this procedure for a second audience named AEM_TE_FireFox. Select the AEM_TC_FireFox audience and use the /content/experience-fragments/my-second-xf/my-second-xf experience fragment. Once complete, both audiences are displayed, as shown here.
Ensure that the content changes when you click on the different audiences. If they do not change, repeat these step and ensure you followed all steps correctly. The content has to change based on the audiences.
13. Once you see different experiences fragments, click the Next button in the upper left side.
14. The next screen maps the audience to the experience, as shown here.
After you setup the Personal Experince using Experince Manager and Adobe Target, you can view the different experiences. When you view the AEM page using the FireFox browser, you see the second Experience Fragment.
Likewise, when the Chrome browser is used to display the content, the first Experience Fragment is displayed.
Join the AEM community at: Adobe Experience Manager Community.