Find more on AEM Experience Fragments

Our site pages are stored under /content.

All the Experience fragments are stored under /content/experience-fragments.
When we were designing the structure for experience fragment (XF) pages we wanted them to correlate to our existing site pages.

Unlike ordinary AEM pages, XF pages cannot be created one under another. In order to mimic the structure of our main site, or just to group fragments logically in a tree structure, we can create folders/subfolders.

Our site has the following structure:

In order to have different language versions for an XF, we can create XF variations. The difference between XF and the ordinary pages is that the live XF version will be stored under the same node as the blueprint one.

So, the structure of a single XF will be like this:

In order to be able to rollout XFs we need to create a blueprint configuration for XFs:

But this is not enough.

Rewriting XF links

When we rollout a page containing an XF e.g. to fr_fr, and there is french version of that XF, we would expect to automatically see the french XF variation on the french site page. To achieve this we need to create a custom rollout action.

And a separate rollout config for the created action:

Now, for each locale we should add the config (Page Properties -> Live Copy tab):


Rewriting site links inside XFs

When we roll out an XF page we expect all the site links to be rewritten according to the locale we are rolling it out to. We will create another rollout action to take care of the site link inside an XF.

And the new rollout config:
/apps/msm/wcm/rolloutconfigs/site-com/updateSiteReferences:

We won’t be able to set this config at a blueprint level for XF, so we need to select it by default when we create a new variation:

We will create a new client lib “xf-rollout”
.content.xml:

xf-live-copy.js:

Author: Iryna Ason

How can we help you?
Contact Us