Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

Style system

Avatar

Level 1

Usually the Style system works on the granular level of each and every individual component in an editable template, so may i know how can we have a global style configured and making the global style accessible for all the components.

Is there any best practices or out of box features in aem 6.4  to achieve this.

Note: Global Style eg: bg-color='white', bg-color='grey'  and different viewports.

Thanks in Advance

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Use Client Libraries (Clientlibs) to implement Global styles:

  • Create a Global Client Library:

    • Create a client library folder (e.g., /apps/your-project/clientlibs/global) that contains your global styles, such as bg-color-white, bg-color-grey, and viewport-specific styles.
    • Ensure that this client library is configured as categories="global.styles", which can then be included in your pages.
  • Include the Global Client Library in Templates:

    • Reference this global client library in your editable templates.

Aanchal Sikka

View solution in original post

2 Replies

Avatar

Correct answer by
Community Advisor

Use Client Libraries (Clientlibs) to implement Global styles:

  • Create a Global Client Library:

    • Create a client library folder (e.g., /apps/your-project/clientlibs/global) that contains your global styles, such as bg-color-white, bg-color-grey, and viewport-specific styles.
    • Ensure that this client library is configured as categories="global.styles", which can then be included in your pages.
  • Include the Global Client Library in Templates:

    • Reference this global client library in your editable templates.

Aanchal Sikka

Avatar

Administrator

@jeevar25487230 Did you find the suggestions from users helpful? Please let us know if you require more information. Otherwise, please mark the answer as correct for posterity. If you've discovered a solution yourself, we would appreciate it if you could share it with the community. Thank you!



Kautuk Sahni