Post by bthirsk » Tue Dec 23, 2008 9:01 pm

This will allow Dynamic Assignment of CSS Declarations in the layout.tpl
It will only return Unique References of CSS Declarations to layout.tpl.
This requires no Database access.
Complete instructions and samples are included in the ZIP attached.
This is the basic Idea of how it works.

library/template/cssdefinition.php

Code: Select all

<?php
Class CssDefinition {
	var $CssDef = array();

	function setcss($CssStyle){
		if (array_search($CssStyle,$this->CssDef)===false){
			$this->CssDef[]=$CssStyle;
		}
	}
}
?>
ADD TO library/locator.php

Code: Select all

function createCssDefinition() {       // New CSS
	require_once(DIR_LIBRARY . 'template/cssdefinition.php');
	
	return new CssDefinition($this);
}
In each catalog/template/*(MODULE or CONTENT .TPL) File, add the following at the top of
the tpl file to define your css file, replacing category.css with whatever your css file is.

Code: Select all

<?php 
$css="catalog/template/" . $this->directory . "/css/category.css";
if (!file_exists($css)) {
	$css="catalog/template/default/css/[color=blue]category.css[/color]";
}
$cssstyle->setcss("<link rel=\"stylesheet\" type=\"text/css\" href=\"".$css."\">");
?>
CATALOG/EXTENSION/MODULE/category.php  This is Dynamic/Relevent/Category Sample Controller File
In   (ADD the RED lines)

Code: Select all

function fetch()  {
	$config   =& $this->locator->get('config');
	$database =& $this->locator->get('database');
	$language =& $this->locator->get('language');
	$url      =& $this->locator->get('url');
	$request  =& $this->locator->get('request');
	[color=red]$template =& $this->locator->get('template');       // New CSS Required in all Controller files if not present
	$cssstyle =& $this->locator->get('cssdefinition');  // New CSS Required[/color]

        if ($config->get('category_status'))
Near the bottom of the code, just before Modules are Fetched add the CSS Assignments (Add the RED lines)

Code: Select all

	$view->set('categories', $new_category_data);
[color=red]	$view->set('cssstyle',$cssstyle);    // New CSS
	$template->set('cssstyle',$cssstyle);    // New CSS[/color]
	return $view->fetch('module/category.tpl');

CATALOG/TEMPLATE/YOURTEMPLATE/layout.tpl add the following code under your default.css declaration

Code: Select all

<?php                     // New CSS Generator
	if (isset($cssstyle->CssDef)){
		foreach ($cssstyle->CssDef as $pagecss){
			echo $pagecss."\n";
		}
	}
?>
This code will work on earlier versions as well. I have tested on both 7.8 and 7.9

-EDIT BY Qphoria: Cleaned up code using code tags. Makes it easier to read-
Last edited by Qphoria on Tue Dec 23, 2008 10:29 pm, edited 1 time in total.

Brent


User avatar
Active Member

Posts

Joined
Wed Sep 03, 2008 11:33 am
Location - Canada

Post by Qphoria » Tue Dec 23, 2008 10:34 pm

Nice work :)

To clarify, this will allow fallback to the default CSS file if there isn't one in your custom template correct? But I don't see where it allows dynamic addition of new css files. That was something I was looking into doing was to somehow categorize how certain controllers find css files.

My idea was to prefix the name of the controller for each css file that you want dynamically loaded on that page.

For example, if you had some custom changes to the product page, you could have the following:
product.css <-- core file untouched
product_tabs.css <-- for styling tabs on that page
product_lightbox.css <-- for custom lightbox styling
product_addtocart <-- for custom add to cart styling

and the code would then look for all css files where strpos($cssfilename, $controller) so as soon as you drop the new file into the folder, it would automatically load it. That's how it was done on another cart I worked with and it was probably the best feature I've seen in any platform. It worked for jscript files too
Last edited by Qphoria on Tue Dec 23, 2008 10:36 pm, edited 1 time in total.

Image
Donate!|OpenCart Basics|GeoZones
Image


User avatar
Administrator

Posts

Joined
Tue Jul 22, 2008 3:02 am

Post by bthirsk » Tue Dec 23, 2008 11:08 pm

The only CSS file that is at present hardcoded in the layout is the default.
All other CSS files are defined in the .tpl files, which are the output of the controller.
The reason I did this in the .tpl files is because it is easier to define your template file
instead of default. And yes, it will use default if no custom file exists.

Regarding using the name of the controller or tpl file, that could be added, but what about
a contibution such as manufacturer filter. It is in Product, but has its own CSS file.

I have a working example on my live website that shows in category the CSS files
dynamically loaded, as well as search and product.
This is far as I have done at this moment.

You can also add as many CSS definition as you like, where ever you like.
It will only include ONE copy of each in layout. 

Brent


User avatar
Active Member

Posts

Joined
Wed Sep 03, 2008 11:33 am
Location - Canada

Post by Qphoria » Wed Dec 24, 2008 12:55 am

bthirsk wrote: Regarding using the name of the controller or tpl file, that could be added, but what about
a contibution such as manufacturer filter. It is in Product, but has its own CSS file.
product_manufacturer.css :)

Image
Donate!|OpenCart Basics|GeoZones
Image


User avatar
Administrator

Posts

Joined
Tue Jul 22, 2008 3:02 am

Post by bthirsk » Wed Dec 24, 2008 2:18 am

That's way to complicated for me. I'm just new at this.
I don't even know PHP coding yet, but I stumble through til it works.
Brent

Brent


User avatar
Active Member

Posts

Joined
Wed Sep 03, 2008 11:33 am
Location - Canada
Who is online

Users browsing this forum: No registered users and 3 guests