Loading Clientlibs

[Gunars_Vilcins]

Hi,

I have a setup where I am running three websites that use the same components, similar to this: 

Sites:
/content/myproject/en-us/siteA/
/content/myproject/en-us/siteB/
/content/myproject/en-us/siteC/

Components:
/apps/myproject/

Design Files:
/etc/designs/siteA/
/etc/designs/siteB/
/etc/designs/siteC/

My "header.jsp" file calls the main clientlib that includes all CSS styling: <cq:includeClientLib categories="apps.myproject.main"/>

My problem now is that we would like to incorporate different CSS styles throughout Site C for global elements, such as button color, header graphic, etc, but everything wraps up to this main client library (apps.myproject.main).

I'm thinking that it would make sense to dynamically change out CSS styles like this:

<% String designID = currentDesign.getId(); %>
<cq:includeClientLib categories="apps.myproject.main"/>                    <-- this would include common JS/CSS
<cq:includeClientLib categories="apps.myproject.<%=designID%>.css"/>    <-- this would include separate CSS for each site

Has anyone ran into a similar situation like this? Would this be the best approach? Any other recommendations?

[Amit_Kumar]

If You have everything in one css then you can include that css iD in design dialog selection given you have a different design path for every site. This will resolve your problem.

[Tyler_Maynard · Accepted solution]

I would create a specific stylesheet/clientlib for the site you want to change colors.

Make sure that this site you want to modify gets the included stylesheet after the main stylesheet that has styling for every site.

Then use CSS to overwrite the specific styles you want. You may need to add/overlay your page component to use on the site to overwrite your styles, but that all depends on how you have everything structured and how you want to maintain it moving forward.