What exactly does currentDesign.writeCssincludes include?

Question

I'm trying to figure out exactly what css is included by the standard call to currentDesign.writeCssIncludes(pagecontext); found in headlibs.jsp. The documentation states simply that it is

Convenience method that writes the CSS include strings to the response.

Looking at what it seems to do, it will include /etc/designs/currentdesign.css which is built off the design components css, and /etc/designs/currentdesign/static.css, which is just a static file. But is this all that is will include?

In particular, what I'd like to do is include a clientLib-processed css file as part of my design. One way to do this is to manually build out the css include:

<link rel="stylesheet" href="<%= currentDesign.getPath() %>/myclientlib.css" />

But I'd prefer to let that get generated automatically, so that my designers have flexibility to structure the css files differently for different designs (i.e., for the "base" design they are fine with just a static.css file, but for the "fancy" design they want to use LESS css and break up the files more granularly). And it would be helpful to put design-specific css info with the components they affect, rather then needing to separate those.

Answer 1

You can use the <cq:includeClientLib> tag, combined with themes and/or categories, to mix and match bits of CSS.

But you may find it somewhat limiting; for instance, you can't specify a media attribute. If you need to do this, or your designers don't structure their CSS in a way that fits the themes/categories model, your fallback is the technique you've identified in your question, using <link> directly.

Update

An excellent question about themes! I have only seen them used in passing.

You can define a theme by just adding a new folder/node under /etc/designs/yourproject/clientlibs/themes, as a sibling to default.

You can pull in the clientlibs for a theme with the <cq:includeClientLibs> tag, perhaps under the control of some conditional logic. For instance, in one of my projects I have a theme called authoring which I only want to apply to the author instance; I pull it in with this code in headlibs.jsp:

<c:if test="${ (global['wcmmode']  eq 'EDIT') || (global['wcmmode'] eq 'PREVIEW') }">
    <cq:includeClientLib theme="apps.myproject.authoring" />
</c:if>

I have not seen any documentation that would apply theme automatically to a particular subtree of the content tree, or based on the presence of a tag.

There is that cryptic statement "The theme name is extracted from the request." in the Adobe docs, which is backed up by this statement in the Sling docs, "ThemeResolverFilter Provides the Theme for the request. The theme is provided as a request attribute." So perhaps tacking &theme=apps.yourproject.foo onto a query string would apply that theme.