What resourceType for XF in HTL? | Community
Skip to main content
January 16, 2023
Solved

What resourceType for XF in HTL?

  • January 16, 2023
  • 1 reply
  • 751 views

Hi,

 

I have an experience fragment on a page and I need to strip the containing <div class="cmp-container"... and <div class="header"...

 

I saw a post on here about adding a resourceType to strip the added containers and this worked perfectly for static components but I'm having issues figuring out what to add for the XF.

 

This is how the xf is included:

<sly data-sly-test.headerexpvariable="${'{0}/jcr:content/root' @ format=[inheritedPageProperties.headervariantPath]}">
<sly data-sly-resource="${headerexpvariable @ wcmmode='disabled'}"></sly>
 
I added a resourceType to the component but although it successfully removes the containers, it just calls the empty component rather than the content filled XF version.
 
I also saw that adding
resourceType='wcm/foundation/components/parsys' 
would help, and it does remove the cmp-container but not the other div. If need be I can work with this but would really appreciate someone telling me if it's the right way and make sure that I'm not introducing any other issues that I'm not seeing. Would also be great if anybody could help with stripping both containers but I'll take what I can get 🙂
 
Thanks
 
This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by SantoshSai

Hi @doodls ,

Hard Coded Example
The first example uses sightly to reference an experience fragment, /content/experience-fragments/we-retail/equipment, and the required variation, master. This will only work when the path includes the experience fragment variation path. The value here is hard coded.

<sly data-sly-resource="${@path='/content/experience-fragments/we-retail/equipment/master',
   selectors='content', wcmmode='disabled'}"></sly>

Dynamic Example
In the second example, we can see that our component adapts to the com.mysite.models.component.MyCustomComponent, Sling Model backend, and then it exposes the experience fragment in the exPath property. The value returned from the exPath is ‘/content/experience-fragments/we-retail/equipment/master’.

<sly data-sly-use.cmp="com.mysite.models.component.MyCustomComponent"></sly>

<sly data-sly-resource="${@path=cmp.exPath,
   selectors='content', wcmmode='disabled'}"></sly>

Hope that helps you!

Regards,

Santosh

1 reply

SantoshSai
Community Advisor
SantoshSaiCommunity AdvisorAccepted solution
Community Advisor
January 16, 2023

Hi @doodls ,

Hard Coded Example
The first example uses sightly to reference an experience fragment, /content/experience-fragments/we-retail/equipment, and the required variation, master. This will only work when the path includes the experience fragment variation path. The value here is hard coded.

<sly data-sly-resource="${@path='/content/experience-fragments/we-retail/equipment/master',
   selectors='content', wcmmode='disabled'}"></sly>

Dynamic Example
In the second example, we can see that our component adapts to the com.mysite.models.component.MyCustomComponent, Sling Model backend, and then it exposes the experience fragment in the exPath property. The value returned from the exPath is ‘/content/experience-fragments/we-retail/equipment/master’.

<sly data-sly-use.cmp="com.mysite.models.component.MyCustomComponent"></sly>

<sly data-sly-resource="${@path=cmp.exPath,
   selectors='content', wcmmode='disabled'}"></sly>

Hope that helps you!

Regards,

Santosh

Santosh Sai