Expand my Community achievements bar.

Styling and JS not applying for Teaser and carousel proxy components

Avatar

Level 1

 

I have created the proxy components for both teaser and carousel. While trying to use those components in my page styling and js is not applying. I have added clientlibs and embed property.

I have followed this reference https://experienceleague.adobe.com/docs/experience-manager-core-components/using/get-started/using.h...

 

 

3 Replies

Avatar

Community Advisor

are you calling your client library on to your template/page?

If not,

1. Click on edit template, once the template editor is opened,

2. Click on Page policy from the properties panel, and author your clinetlib category name as shown below.

Screenshot 2022-10-13 at 4.57.17 PM.png

 

(or)

 

On your structure/page component, call your client-library css files on customheaderlibs.thml and

<sly data-sly-use.clientLib="/libs/granite/sightly/templates/clientlib.html"
data-sly-call="${clientlib.css @ categories='<category-name>'}"/>

 js files on customfooterlibs.html

<sly data-sly-use.clientlib="/libs/granite/sightly/templates/clientlib.html">
<sly data-sly-call="${clientlib.js @ categories='category-name'}"/>
</sly>

Thank you. 

Avatar

Level 1

I have components in this path "/apps/weretail/components/content/teaser"

If I try to use those components in my page they are not working. Styling and js are not applying to the component.