Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

Experience Fragment Via Custom Component

Avatar

Level 3

Hi Friends - Hope, All is well.

 

could you help me know how I can consume the experience fragment variation via a field in custom component, not by OOTB experience fragment component.

 

my custom multi-field component has following fields.

1. icon

2. source

and here source is XF reference. what is the relevant granite/coral resource to be used here and How I can export whole xf by just authoring xf reference in source field and inject it in HTL.

 

please advise.

 

#experiencefragment #aemcomponent #customaemcomponent #aem

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @ravijais04,

Regarding dialog filed, you can use cq/experience-fragments/editor/components/xffield which will allow you to select specific variation of given content fragment. There is no dedicated XF granite/coral widget, however keeping in mind above is used in Core Components this should be a good choice.

In terms of HTL, you can simply use data-sly-resource

data-sly-resource="${@path='path/to/xfvariant'}"

You can find very good code examples looking int core components Experience Fragment component:

So you can use above elements in your custom component respectively.

View solution in original post

4 Replies

Avatar

Correct answer by
Community Advisor

Hi @ravijais04,

Regarding dialog filed, you can use cq/experience-fragments/editor/components/xffield which will allow you to select specific variation of given content fragment. There is no dedicated XF granite/coral widget, however keeping in mind above is used in Core Components this should be a good choice.

In terms of HTL, you can simply use data-sly-resource

data-sly-resource="${@path='path/to/xfvariant'}"

You can find very good code examples looking int core components Experience Fragment component:

So you can use above elements in your custom component respectively.

Avatar

Community Advisor

Relevant resource type we need to use here is cq/experience-fragments/editor/components/xffield.

 

You can refer the following path to get more details: /apps/core/wcm/components/experiencefragment/v2/experiencefragment/cq:dialog/content/items/tabs/items/properties/items/columns/items/column/items/fragmentVariationPath , if you have core component installed on your AEM instance.