We are using the Style System in order to apply classes for our components. In one of our components, we are using the cq:styleDefaultClasses option, which applies the correct classes by default on the author environment. However, when published, the default css classes are not applied. We are using AEM 6.5
When the author manually selects a style, the css classes are applied on both author and publish environment. The issue only occurs with default css classes, when the author does not select any style.
Has anyone faced this issue?
Views
Replies
Total Likes
I've just tested this, also on 6.5 and I can't reproduce your issue :S
Just to get this right, you have a default class, slay "redTextClass" for example, which you entered as a default class. You also created a style which adds that same class (called "Red" for example). On publisher the your component does not have the redTextClass class unless you select the Red style, correct?
Could you also show us the policy node for the component in question? Here is the policy for my title component for example:
Export the XML and post it here so we can have a look
Yes, that is the correct scenario. We have "l-container lcontainer--narrow" classes applied by default, and they are also applied when the "narrowContent" style is selected.
On our author instance, the classes are applied to the component by default when nothing is selected and when author selects the style manually. But on our publish instance the styles are applied only when the author selects the "narrowContent" style
Here is the extract from the policy file:
<container
jcr:primaryType="nt:unstructured"
jcr:title="Content"
sling:resourceType="wcm/core/components/policy/policy"
backgroundImageEnabled="true"
columns="4"
cq:styleDefaultClasses="l-container l-container--narrow"
components="[group:Base]">
<jcr:content jcr:primaryType="nt:unstructured"/>
<cq:styleGroups jcr:primaryType="nt:unstructured">
<width
cq:styleGroupLabel="Width"
jcr:primaryType="nt:unstructured">
<cq:styles jcr:primaryType="nt:unstructured">
<narrowContent
cq:styleClasses="l-container l-container--narrow"
cq:styleId="narrowContent"
cq:styleLabel="Narrow Content"
jcr:primaryType="nt:unstructured"/>
<fullContentWidth
cq:styleClasses="l-container"
cq:styleId="fullContentWidth"
cq:styleLabel="Full content width"
jcr:primaryType="nt:unstructured"/>
</cq:styles>
</width>
</cq:styleGroups>
</container>
Sorry, the issue is no longer happening. I just created a new page and styles are working correctly. Maybe it was a caching issue for component or policy that was leading to this behavior
Thank you!
Okay, well I'm happy to hear it's fixed
Just one more question: is "l-container" a class you always want to be applied to your component? Because I think the styles associated with it might belong in the default.less file if that's the case.
Yes, most probably we will need this class in all cases. Will move it to the dafault.less file. Thanks for the advice!!
Views
Likes
Replies
Views
Likes
Replies