1042
Views
5
Comments
Solved
How to control CSS load order?
Question

I am adding a link to a stylesheet with the "AddStylesheetTag" Action. I noticed that this puts the link tag before any of the link tags for the Web Block. However, in my use case, I need it to override the CSS in the Web Blocks. So... what are my choices to get this to load after the CSS from the Web Blocks? Is this a time to use jQuery or JavaScript? I really, REALLY do not want to inject the styles directly into the page, it is a big sheet and caching needs to be my friend here...

Thanks!

J.Ja

mvp_badge
MVP
Solution

Hi Justin,

The order of the stylesheets, afaik, is the following:

1. AddStylesheetTag
2. Webblock
3. Root Theme, (and other parents)
4. Current Theme
5. Screen
6. Inline

You can try to include your CSS in the Current Theme or try to include at the end of the body using JQuery

Kind regards,

Remco Dekkinga

mvp_badge
MVP

Remco -

Thanks! this is about what it looked like to me as well. JQuery it is! This is dynamically generated CSS.

J.Ja

Please advise how to import local css file by JQuery.

mvp_badge
MVP

Hi Jessica,

this post was asleep for 4 years now and has a solution.

Could you please post your answer with a bit more detail on what you need exactly in a new question on the forum? This way you’ll have more community members seeing your question and higher chance of getting an answer in a short time.

Kind regards,

Remco Dekkinga

I have tried to use @import url("\{module\filename.css"); in the css editor of my traditional application but not work. Hence, this post give me some hints to use jquery for generating CSS dynamically. 

Please advise how to do it.

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.