Post by Qphoria » Mon Aug 30, 2010 1:09 am

So I've been struggling with a problem with the concept of a "template" the way we use them in OpenCart. And I think a few others have mentioned this as well. The issue is that our templates really not templates but full structures and it results in a lot of duplicated code and a lot of work.

The best way to explain this is with modules

A module "should" simply plug in to any store and any theme dynamically. But they do not. Each module has its own template file, and that file comes with "box" wrappers. This is a mistake. If someone makes a theme and changes this "box" style, they have to change this file as well.

Modules should NOT have this outer box wrapper in their template files. It removes the concept of a "template" if they all supply their own box code. They should fit into the normal column_right.tpl structure and only include the contents inside of <div class="middle">

The column_right should then instead of:

Code: Select all

<div id="column_right">
  <?php foreach ($modules as $module) { ?>
  <?php echo ${$module['code']}; ?>
  <?php } ?>
</div>

Should be:

Code: Select all

<div id="column_right">
  <?php foreach ($modules as $module) { ?>
  <div class="box" id="module_<?php echo $module_name; ?>">
    <div class="top"><?php echo $heading_title; ?></div>
      <div class="middle">
        <?php echo ${$module['code']}; ?>
      </div>
      <div class="bottom">&nbsp;</div>
    </div>
  <?php } ?>
</div>
Same with column_left.tpl

Now when people make templates, the module will automatically fit with their theme without needing to edit this file.

By using the id with the module name in it, we can still use css to give things like different colors with css

Image
Donate!|OpenCart Basics|GeoZones
Image


User avatar
Administrator

Posts

Joined
Tue Jul 22, 2008 3:02 am

Post by Maansy » Mon Aug 30, 2010 1:32 am

interesting, but i think i will wait for the promised 1.5 template til i concider in heavy template coding ;)

ALL Templates :: 1.5.1+ Templates :: 50%-75% PRICE DROP ONLY at OpencartStuff.com


User avatar
Active Member

Posts

Joined
Thu Jun 24, 2010 6:04 am


Post by Xsecrets » Mon Aug 30, 2010 2:18 am

Maansy wrote:interesting, but i think i will wait for the promised 1.5 template til i concider in heavy template coding ;)
what do you think we are talking about here?

and I agree I think this sounds like an excellent idea.

OpenCart commercial mods and development http://spotonsolutions.net
Layered Navigation
Shipment Tracking
Vehicle Year/Make/Model Filter


Guru Member

Posts

Joined
Sun Oct 25, 2009 3:51 am
Location - FL US

Post by Maansy » Mon Aug 30, 2010 5:20 am

Xsecrets wrote:
Maansy wrote:interesting, but i think i will wait for the promised 1.5 template til i concider in heavy template coding ;)
what do you think we are talking about here?
i am talking about this Genius:
The issue is that our templates really not templates but full structures and it results in a lot of duplicated code and a lot of work.
A module "should" simply plug in to any store and any theme dynamically. But they do not. Each module has its own template file, and that file comes with "box" wrappers. This is a mistake. If someone makes a theme and changes this "box" style, they have to change this file as well. 


ALL Templates :: 1.5.1+ Templates :: 50%-75% PRICE DROP ONLY at OpencartStuff.com


User avatar
Active Member

Posts

Joined
Thu Jun 24, 2010 6:04 am


Post by Qphoria » Sat Jan 15, 2011 12:38 am

Daniel made a point that this won't work for modules that don't need wrappers, as the template will try to add wrappers to things like banners and links and side logos that don't need wrappers.

So the next suggestion then is a to have the module have a configurable option of "Use Box Wrapper: Yes/No". Then this could still work and give control as needed.

Image
Donate!|OpenCart Basics|GeoZones
Image


User avatar
Administrator

Posts

Joined
Tue Jul 22, 2008 3:02 am

Post by Xsecrets » Sat Jan 15, 2011 12:54 am

that should be easy enough just add some conditional code to the template like

Code: Select all

if(isset($wrapper) && $wrapper = 'no') { wrapper stuff }
then in the controller if the mod maker didn't want the wrapper they would do

Code: Select all

$this->data['wrapper'] == 'no';
that way if you did want the wrapper you wouldn't have to change anything. If they wanted it admin controlled for the wrapper they could add it as a setting and in the controller do

Code: Select all

if(isset($this->config->get('modname_wrapper')) && $this->config->get('modname_wrapper') == 'no'){ $this->data['wrapper'] = 'no'; }

OpenCart commercial mods and development http://spotonsolutions.net
Layered Navigation
Shipment Tracking
Vehicle Year/Make/Model Filter


Guru Member

Posts

Joined
Sun Oct 25, 2009 3:51 am
Location - FL US

Post by hbuchel » Sat Jan 15, 2011 1:07 am

Qphoria wrote:

Code: Select all

<div id="column_right">
  <?php foreach ($modules as $module) { ?>
  <div class="box" id="module_<?php echo $module_name; ?>">
    <div class="top"><?php echo $heading_title; ?></div>
      <div class="middle">
        <?php echo ${$module['code']}; ?>
      </div>
      <div class="bottom"> </div>
    </div>
  <?php } ?>
</div>
I would do something very similar, Qphoria. I think being able to echo the title and module code from the column template helps somewhat.

Code: Select all

register_sidebar( array(
		'name' => __( 'Primary Widget Area', 'twentyten' ),
		'id' => 'primary-widget-area',
		'description' => __( 'The primary widget area', 'twentyten' ),
		'before_widget' => '<li id="%1$s" class="widget-container %2$s">',
		'after_widget' => '</li>',
		'before_title' => '<h3 class="widget-title">',
		'after_title' => '</h3>',
	) );
This is similar to what WordPress does quite smartly when it registers an area for widgets to appear (in our case, our column_left and column_right currently where modules appear) in that you are able to then specify how you want your header wrapped (in the default template's case a div with class "top") and for the module's code, some sort of wrapper (in the default template's case, a div with class "box" and an id). I'm just using that WordPress function as an example, and as an analogy to the one you've given, not proposing that we use the exact function.

I don't really see a problem with all modules having a box wrapper since you could easily adjust its appearance in the stylesheet using the module's id name.

New member

Posts

Joined
Mon Aug 30, 2010 9:41 pm

Post by hbuchel » Sat Jan 15, 2011 1:15 am

I should also add I know there will be no solution to auto-make every module match a custom template, but it feels like adjusting the stylesheet for the id of whichever individual module, or whatever wrapper you choose to use (in our case box) is a lot more efficient then changing every single module's template file that I download.

New member

Posts

Joined
Mon Aug 30, 2010 9:41 pm

Post by Xsecrets » Sat Jan 15, 2011 1:19 am

I agree we should tag the modulename in a class I guess now. I would have said an id, but with modules being instanced in 1.5. so you can have multiple instances of the module on the screen at the same time I guess it will have to be a class, however I don't really see the need to rewrite the entire templating system to use some esoteric function system. I think getting it down to having one main module.tpl and appending the modulename to the class should handle the vast majority of situations with the theme designer only having to change that one file and the stylesheet, which I see as acceptable.

OpenCart commercial mods and development http://spotonsolutions.net
Layered Navigation
Shipment Tracking
Vehicle Year/Make/Model Filter


Guru Member

Posts

Joined
Sun Oct 25, 2009 3:51 am
Location - FL US

Post by hbuchel » Sat Jan 15, 2011 1:30 am

Xsecrets wrote:I agree we should tag the modulename in a class I guess now. I would have said an id, but with modules being instanced in 1.5. so you can have multiple instances of the module on the screen at the same time I guess it will have to be a class,
Well you could append the module's class/id declaration on your column's template to something like this (using Qphoria's above mentioned suggestion) for the left column module area.

Code: Select all

<div class="box left_column" id="left_column_<?php echo $module_name; ?>">
And change accordingly for each modularized area. That way you can still select ALL modules using the "box" class, all modules in the left column, and select SPECIFIC instances of a module to style using its id. This way the wrapper and styles of the module will be more dependent on what the template author has created

New member

Posts

Joined
Mon Aug 30, 2010 9:41 pm

Post by Qphoria » Sat Jan 15, 2011 1:46 am

Xsecrets wrote:I agree we should tag the modulename in a class I guess now. I would have said an id, but with modules being instanced in 1.5. so you can have multiple instances of the module on the screen at the same time I guess it will have to be a class, however I don't really see the need to rewrite the entire templating system to use some esoteric function system. I think getting it down to having one main module.tpl and appending the modulename to the class should handle the vast majority of situations with the theme designer only having to change that one file and the stylesheet, which I see as acceptable.
Actually they are id's still the way he is doing it in 1.5.0 with numbers

Code: Select all

<div class="box">
  <div class="box-heading"><?php echo $heading_title; ?></div>
  <div class="box-content" id="manufacturer<?php echo $module; ?>">
$module would be a number (0 to inf)

Image
Donate!|OpenCart Basics|GeoZones
Image


User avatar
Administrator

Posts

Joined
Tue Jul 22, 2008 3:02 am

Post by Xsecrets » Sat Jan 15, 2011 2:20 am

Qphoria wrote:
Xsecrets wrote:I agree we should tag the modulename in a class I guess now. I would have said an id, but with modules being instanced in 1.5. so you can have multiple instances of the module on the screen at the same time I guess it will have to be a class, however I don't really see the need to rewrite the entire templating system to use some esoteric function system. I think getting it down to having one main module.tpl and appending the modulename to the class should handle the vast majority of situations with the theme designer only having to change that one file and the stylesheet, which I see as acceptable.
Actually they are id's still the way he is doing it in 1.5.0 with numbers

Code: Select all

<div class="box">
  <div class="box-heading"><?php echo $heading_title; ?></div>
  <div class="box-content" id="manufacturer<?php echo $module; ?>">
$module would be a number (0 to inf)
well I guess that works, but it would probably be better if it was modulename_position instead of modulename_instance because then you would have to go find out what the particular instance number is from the admin somehow, though I suppose that wouldn't work either since you might have multiple instances in the same position. hmmm that is a dilemma I guess theme makers will just have to deal with figuring out the instance number when they are doing completely custom one off themes and explain to the customers to leave the modules alone or they may break the theme.

OpenCart commercial mods and development http://spotonsolutions.net
Layered Navigation
Shipment Tracking
Vehicle Year/Make/Model Filter


Guru Member

Posts

Joined
Sun Oct 25, 2009 3:51 am
Location - FL US

Post by hbuchel » Sat Jan 15, 2011 2:30 am

I'm sure you could easily replace the instance number with whatever else you want. And clients break everything anyways :O

New member

Posts

Joined
Mon Aug 30, 2010 9:41 pm
Who is online

Users browsing this forum: No registered users and 9 guests