Nevo Template - Force CSS file Order Topic is solved

Everything to do with Joomla! 3.x templates and templating.
Post Reply
gdogaru
Joomla! Apprentice
Joomla! Apprentice
Posts: 10
Joined: Fri Jul 11, 2014 2:01 pm

Force CSS files order

Post by gdogaru » Tue May 24, 2016 5:48 pm

Hi
I have a template I am working on and I want to override the css for some extension.
The problem is that extension adds it's css line after my template and I wouldn't use the important flag

My css is add as

Code: Select all

$doc->addStyleSheet('templates/' . $this->template . '/css/style.css');
... 

<head>
    <jdoc:include type="head"/>
 ....
Is there a way to tell the temlate to load a css file last?

itoctopus
Joomla! Virtuoso
Joomla! Virtuoso
Posts: 4026
Joined: Mon Nov 25, 2013 4:35 pm
Location: Montreal, Canada
Contact:

Re: Force CSS files order

Post by itoctopus » Tue May 24, 2016 6:49 pm

Why do you not want to use the "important" flag if I may ask? It does solve a lot of problem?

In any case, you can simply change the class being used by the extension both in the CSS and in the extension itself - that'll solve your problem.
http://www.itoctopus.com - Joomla consulting at its finest
https://twitter.com/itoctopus - Follow us on Twitter

iamrobert
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 206
Joined: Sat Aug 25, 2007 8:13 am
Location: Taiwan
Contact:

Re: Force CSS files order

Post by iamrobert » Thu May 26, 2016 5:22 am

In your template you can try using unset for the css:

Code: Select all

unset($this->_styleSheets[JURI::root(true).'/media/system/css/calendar-jos.css']‌​); 
However - some components still override your template.

The most reliable solution I have found is utilizing a plugin to block css/js - JSS - CSS control:
http://extensions.joomla.org/extension/js-css-control

Also - in your case place your css after:

<jdoc:include type="head" />


Regards,

Robert
iamrobert Design | Taiwan
https://www.iamrobert.com

gdogaru
Joomla! Apprentice
Joomla! Apprentice
Posts: 10
Joined: Fri Jul 11, 2014 2:01 pm

Re: Force CSS files order

Post by gdogaru » Thu May 26, 2016 8:00 pm

Thank you iamrobert,
and indeed, that helps me a lot, and I hope to solve my problem using your suggestion.
I was hoping for a way to set the order of the css, similar to what you do for modules. That way some plugins that compact css could still do their job.
But unfortunately, all I can hope for is for is a new version that supports that :)

Thanks again

User avatar
sozzled
Joomla! Exemplar
Joomla! Exemplar
Posts: 9989
Joined: Sun Jul 05, 2009 3:30 am
Location: Canberra, Australia

Re: Force CSS files order

Post by sozzled » Thu May 26, 2016 8:43 pm

Cascading Style Sheets are processed in the order that they are loaded. As far as Joomla is concerned, the order goes from innermost to outermost.

1) Components
2) Modules
3) Plugins
4) Languages
5) Templates
6) Template overrides

(I may have the order slightly imperfect, but this is just to give you an idea)

Your site may load CSS from a combination of these parts. For most of us, the CSS files are usually loaded by the site template. Starting with the site template index.php file, you can see which CSS files are loaded (and the order they are loaded in). Most templates support the means to add extra/custom CSS files (which are usually, but not necessarily, the last CSS files loaded).

In addition to the use of the !important attribute (which I try to avoid wherever possible) it's also possible to narrow the scope with the #id or .class qualifiers. 99% of the time, I package the most "important" things in one or two custom CSS files and things generally take care of themselves.

Hope some of this helps
https://www.kuneze.com/blog
“If you think I’m wrong then say, ‘I think you’re wrong.’ If you say ‘You’re wrong!’, how do you know?” :)

archer1986
Joomla! Fledgling
Joomla! Fledgling
Posts: 1
Joined: Thu Aug 13, 2020 9:51 am

Nevo Template - Force CSS file Order

Post by archer1986 » Thu Aug 13, 2020 10:16 am

I wanted to post this in the viewtopic.php?f=713&t=925142&p=3402477& ... r#p3402477 topic but it is locked and I cannot reply. I spent a few hours looking online for a solution to this issue I was having and finally found a work around.

Issue:
The Nevo Template was loading my css files before all other files (bootstrap, template css) so I could not override either bootstrap or the template css.

Resolution:
I created a "master" view.html.php file that all other view.html.php files would extend. Created a method that would add the stylesheets to an array in the "view". In the "master" view, inside the method "display", I hooked into the JFactory::getApplication()->registerEvent() that would then add the css files to the "document" (JFactory::getDocument() ). I hope this helps anyone in the future looking for a solution and hopefully prevents hours of searching.


Example: master.view.html.php

Code: Select all

class FiltersViewMaster extends JViewLegacy
{
	protected $stylesheets = array();

	public function __construct($config = array())
	{
		parent::__construct($config);

		//This file will be added to every view
		$this->addStylesheet('path/to/css/file.css');
	}

	//the method to add stylesheet in child views
	protected function addStylesheet($url)
	{
		$this->stylesheets[] = $url;
	}

	public function display($tpl = null)
	{
		//add the event hook which then adds the stylesheet to the bottom of
		//the JDocument array durring the <head> tag creation
		JFactory::getApplication()->registerEvent('onBeforeCompileHead', function () {
			$doc = JFactory::getDocument();
			foreach ($this->stylesheets as $stylesheet)
			{
				$doc->addStyleSheet($stylesheet);
			}
		});

		return parent::display($tpl);
	}

}

User avatar
pe7er
Joomla! Master
Joomla! Master
Posts: 22926
Joined: Thu Aug 18, 2005 8:55 pm
Location: Nijmegen, Netherlands
Contact:

Re: Nevo Template - Force CSS file Order

Post by pe7er » Fri Aug 14, 2020 7:24 am

Thank you for sharing your solution archer1986! Much appreciated!

Old topics are locked automatically to prevent spam. I've merged your topic with the original topic.
Kind Regards,
Peter Martin, Global Moderator
https://db8.nl - Joomla specialist, Nijmegen, Nederland
The best website: https://the-best-website.com


Post Reply

Return to “Templates for Joomla! 3.x”