Discusses how to create Experience Fragments and use them in Personalization use cases. The ContextHub is used in this article.
A special thank you to Ratna Kumar Kotla, Navin Kaushal, Prince Shivhare, and Shivani Garg, all top AEM community members, for testing this article to ensure it works. Also thank you to Neha Malhotra for helping with this article.
|Digital Marketing Solution(s)||Adobe Experience Manager 6.3|
This article uses two separate images to create Experience Fragments. You can use any two images to follow along with this article.
When working with Adobe Experience Manager ContextHub and 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.
This development article walks you through how to use experience fragments when using the ContextHub.
To create an Experience Fragment, perform these steps:
1. Enter the following ULR 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 and name it my-second-xf. Specify a different image and text value. Both Experience Fragments are used later in this article.
Create a ContextHub audience used in this use case. In this example, the audience is defined by geo-location data. That is, the postal code is used. To create an audience, perform these steps:
1. Click the Personalization icon.
2. Click Audiences.
3. Click the Create button and Create ContextHub Segment.
4. In the title field, specify firstEF and click the Create button.
5. Edit the segment by adding some conditions. Add the Comparison: Property – Value.
6. Configure the component by adding these values:
- Property Name - geolocation/address/postalCode
- Operator - equal
- Data Type - (auto)
- Value - 95110 (corresponds to the San Jose address)
From the ContextHub location field, select San Jose from the Dropdown field. Notice that the postal code lines up with the component, and the component now states: Data located in the ContextHub now resolves the current segment.
The Experience Manager Activities console enables you to create, organize, and manage the marketing activities. Create an Activity by performing these steps:
1. Click the Personalization icon.
2. Click Activities.
3. In the Activities page, click on Create, Create Brand.
4. Select Brand, as shown here.
4. Click Next.
5. In the Template view, enter DemoEFBrand as the Title value.
6. Click Create. The new brand is now listed in the Activities page as shown below:
7. Click on DemoEFBrand.
8. Click Create, Create Activity.
9 Enter the following values:
- Name - DemoActivityContextHub
- Targeting Engine - ContextHub(AEM)
After you create an Experience Fragment, you can use it within an Experience Manager page to achieve personalization. To demonstrate how to work with Experience Fragments, this article uses We Retail.
Perform these steps:
1. Open the page located at the following URL:
To see how to work with Personalization and the ContextHub in a custom site (the Toy Store Site), see this article, Using the Adobe Experience Manager ContextHub to work with Personal Experiences.
2. Drag the Experience Fragment component from the SideRail onto the page, as shown in this illustration.
7. Select the DemoEFBrand as shown below (the DemoActivityContextHub shows up as the Activity value).
8. Click the Start Targeting button. Notice that the Audience is mapped with the DemoActivityUsingContextHub.
11. Next click on Default value and click the Experience Fragment component. Then select the second Experience Fragment that you created.
When working with the Experience Fragment in the Targeting mode, make sure the Target Icon is enabled so this component is included in Targeting. Also make sure that when you click on firstEF and Default, the image changes. This is how you know that Targerting is working properly and the Experience Fragment changes dynamically based on the audience.
You can test the experience by selecting the Preview mode. Then from the drop-down Location field, select Paris France. This does not Match up the defined audience (which is based on the San Jose Postal code). Therefore the default experience is displayed.
When you select San Jose, the postal code matches. As a result, the Experience Fragment 1 is displayed.
When you select a location other than San Jose, the default experience is displayed.
Join the AEM community at: Adobe Experience Manager Community.