Custom CSS - Editable Templates

Avatar

Avatar

sai_santhosht50

Avatar

sai_santhosht50

sai_santhosht50

08-02-2021

Hi All,

 

I have created an editable template in my project. If i open the template structure there is no such css file is loading. And in our project all the components css will be merged in a single file which we will be placed in etc/designs/clientlibs/projectname/sample.css.

 

I want this sample.css file to be loaded when i hit the template structure so that the structure looks good.

 

Is it possible to call the existing css. If yes, can you please help me with the steps.

 

Thanks in advance.

View Entire Topic

Avatar

Avatar

BrianKasingli

MVP

Avatar

BrianKasingli

MVP

BrianKasingli
MVP

08-02-2021

@sai_santhosht50,

You will need to make sure that your client library is properly created. Can you find the client library from here? http://localhost:4502/libs/granite/ui/content/dumplibs.html

Once when your client library with the category exists, you can insert the client category in the editable template's page policy page. 

As an example, I have included 2 valid client libraries of: cq.handlebars && cq.jquery (http://localhost:4502/editor.html/conf/we-retail/settings/wcm/templates/content-page/structure.html)

BrianKasingli_1-1612821676595.png

Results in the page source, I can see client libraries loading as expected. The CSS files will be loaded in the <head> while the JS files will be loaded before the closing of the </body>
view-source:http://localhost:4502/conf/we-retail/settings/wcm/templates/content-page/structure.html?wcmmode=disabled

BrianKasingli_2-1612821751559.png