Linking The CSS File Last In The Order
Tomas
Link the template.css file in the head tag last, after all others css files.
Rashida Rahman
Accepted AnswerHi Tomas,
In general, if you put your custom CSS within the custom.css file it overrides existing styles as per my knowledge.
If something is not working then you need to be specific and deeper as much as opssible with your selectors. This should be enough to make your own style working.
Can you give me your site URL to check the ordering you mentioned?
Best Regards
Rashida Rahman
Accepted AnswerHi there!
Thanks for your query.
Would you please describe your issue a little bit more, kindly?
Do you want to load the template.css file at the last file?
Best Regards
Paul Frankowski
Accepted AnswerHi Tomas,
So you have problem with using custom.css file, am I right?
What template name you have?
Tomas
Accepted AnswerI want to use main template.css or custom.css, which would be loaded at the end (last) in head tag, after all other linked css files. Because I need to override css properties from previous files and I want to avoid using !important.
I use helix ultimate 1.1.2.
I tried to move row $theme->addscss('master', $scssVars, 'template'); before </head> tag in index.php, but still many modules and plugins add css files after template.css.
All I need is to move template.css or custom.css lower, after all other linked css files.
Paul Frankowski
Accepted AnswerPlease update template, we cannot support old template. You should have Helix Ultimate 2.0.5
Otherwise you have to edit index.php from template to fix it.
Rashida Rahman
Accepted AnswerHi,
Actually, you are supposed to not touch the template.css file. If you want to override CSS then please use the custom CSS field of the Template options or create a custom.css file and put your custom CSS codes there. That should be enough in general.
Here is the related documentation:
https://www.joomshaper.com/documentation/helix-framework/helixultimate/custom-code
Best Regards
Tomas
Accepted AnswerReply to Paul > I can't update Helix template because the new version doesn't work with Advance Template Manager by Regular Labs. I'll update as soon as he cooperates with it. Or version 2.0.5 already works with Advance Template Manager?
Reply to Rashida > Yes, custom.css is the solution that suits me, but I don't know how to add it at the end, after all the other .css files. I have a problem with sorting.
I want something like this:
<link href="/module1.css" rel="stylesheet" />
<link href="/module2.css" rel="stylesheet" />
<link href="/module3.css" rel="stylesheet" />
<link href="/module4.css" rel="stylesheet" />
<link href="/CUSTOM.CSS" rel="stylesheet" />Even if I load the custom.css in the index.php file right before the end of the head tag, the custom.css is not the last one.
$theme->add_css('custom.css');
?>
</head>
<bodyNot like this:
<link href="/module1.css" rel="stylesheet" />
<link href="/module2.css" rel="stylesheet" />
<link href="/CUSTOM.CSS" rel="stylesheet" />
<link href="/module3.css" rel="stylesheet" />
<link href="/module4.css" rel="stylesheet" />Tomas
Accepted AnswerI found a solution using Helix ultimate template settings and "Custom code" > "Before </head>" field. If I load custom.css this way, the last css is loaded in the head tag. I was hoping that there is a better solution, because in this case I have to use an absolute address to the css file.
Best Regards.