Themes: Templates overriding : a small Tutorial

Posted by: alain01on 2006/9/23 21:50:00 12251 reads This article, translated from french to english by Tripmon(many many thanks to him)/Marco, will explain the Template override concept, a feature introduced from XOOPS 2.0.14.
This news is here in order to help users understand this new concept. This article will demonstrate that by 2 examples.




First, What is a template ?
Templates can display data (as well as sort, position, and conditional display...)
Templates are used to separate the process of displaying data from retrival and manipulation.
This allows non programmers to easily format data for presentation, without modifying underlying code, by simply modifying the template file.

XOOPS comes with its own templates (module system, 26 files), for example:
- system_redirect.html (Redirection page)
- system_siteclosed.html (Closed site page)
- system_block_login.html (Login block)
- system_block_online.html (User on line block)
- system_block_comments.html (Comments block)...

Every recent module also uses templates (pages and blocks).

Example :
News module (15 templates) for example:
- news_archive.html (archives page)
- news_block_new.html (New news block)
- news_block_top.html (better read news block)...

To browse these templates, go to admin system / templates and click on list on the module that you want to see, on the default template set.
The top section shows template pages, with template blocks below.

If these pages and blocks do not display to your liking, it's not a problem, you can modify them with the new functionality included in the core since XOOPS 2.0.14:
Templates overriding.



An excerpt from XOOPS 2.0.14 news:
Quote:
Designers can add custom templates to their themes, and those will be used instead of the default ones.
To exploit this feature, templates have to be created in subfolders of the themes duplicating the default folders structure and removing the "templates" part:
To overload :
system_userinfo.html (template located in modules/system/templates/system_userinfo.html), you have to create your custom version in:
<yourthemefolder>/modules/system/system_userinfo.html

To overload :
system_block_login.html (template located in modules/system/templates/blocks/system_block_login.html), you have to create your custom version in:
<yourthemefolder>/modules/system/blocks/system_block_login.html



Explanation:

Now, You don't need to clone your default template set, you can use the default template set (in fact, to override, you MUST), and install the structure file of your modules in the <yourthemefolder> directory.

Bonus :
- In case of "Update" module, your modified files will not be suppressed
- Just modified templates will be installed in <yourthemefolder> directory
- The understanding of custom templates is very easy now (structured files)
- Easy to use
- You can change themes very easily by overriding the default template pack (for example, login block, search block, close site block...)

Page 2: Example 1
Page 3: Example 2
Page 4: Notes and image & css overriding...