Issue while applying custom css to template



I am currently facing some issues while applying custom CSS to the template. When I am trying to apply styles from the page policy no style is visible and it seems that no CSS is applied. I am also attaching the screenshots of the files and issue.Css.txt fileCss.txt filelayout.css filelayout.css file
page policypage policy



Accepted Solutions (1)

Accepted Solutions (1)




In your css.txt file, you have written



which is totally wrong. this should be written as




just css/layout.css


because #base property denotes the root folder.


Note. you also have to update your clientlib category name inside your page templates component

e.g. /components/structure/page/headlibs.html



Answers (1)

Answers (1)





Thank you for being very clear with your problem by providing screenshots of your configuration. Your setup is 100% correct. The editable template is configured correctly, corresponding to the "dmi-sample.base", client library.

This leaves us to the questions of:

  1. Is your css.txt and js.txt setup correctly?
  2. Is your client library set up properly? Can the client library export CSS and JS? 
    CSS work? http://localhost:4502/etc.clientlibs/demi-sample/clientlibs/clientlib-base.css
    JS work? http://localhost:4502/etc.clientlibs/demi-sample/clientlibs/clientlib-base.js

    If the above works, then it must be the setup of your editable template. 
  3. If #1 and #2 are not resolved, then we need to go into a deeper dive. What does the console log say in your browser? Any Errors?
  4. Try accessing the page with ?debugClientLibs=true, so something like http://localhost:4502/content/my-site/homepage.html?debugClientLibs=true; instructions:

In conclusion, the problem you are facing has a complexity level of 2/10, which means that this is very easy to solve. Something was misconfigured, that's all. Either the client library is not configured properly, the editable-template, wcm-core-components-page-v2, was overlayed and the clientlibrary property is not being respected, or simply there was a css or javascript error when the client library tries to export JS or CSS.