designguide building modules
Now that we have created at least two templates in your system, an index and archive template, you have almost certainly have duplicate blocks of HTML in your templates. The most common elements to be replicated across templates are the header and footer of your website.
Technically there is nothing wrong with having template code replicated across multiple templates, but generally is considered non-ideal because it makes templates harder to manage and update.
Consider for example that you want to update your site's header in some way, perhaps by changing your site's logo or masthead. If the HTML for your header is replicated across multiple templates then you will have to make the necessary changes to your header as many times as there are templates for your website. This can be time consuming, and potentially error prone.
A better approach would be to share the HTML that is common between your templates in some way, which is why we have template modules. Template modules are nothing more than fragments of HTML and MTML that can be included or referenced by name from other templates. When used effectively, that means that if you needed to update your header, you would only need to edit the one relevant template module and you would be done.
Let's look at a simple example. Here is the MTML for a simple header of a website. It is placed in a hypothetical template module called "Site Header":
<div id="header">
<h1><$mt:BlogName$></h1>
<h2><$mt:BlogDescription$></h2>
</div>
The header fragment can then be placed in each of your site's templates via the <mt:include> tag:
<html>
<head>
<title><$mt:BlogName$></title>
</head>
<body>
<$mt:include module="Site Header"$>
<div id="content">
</div>
</body>
</html>
Template modules also offer another key, but often under-appreciated advantage: they make your templates much easier to read. When you use template modules you can effectively collapse large blocks of MTML into a single line. Consider for example the following Main Index template that is common for many blogs:
<html>
<head>
<title><$mt:BlogName$></title>
<$mt:include module="HTML Head"$>
</head>
<body>
<$mt:include module="Banner Header"$>
<div id="content">
<mt:Entries lastn="auto">
<$mt:include module="Entry Summary"$>
</mt:Entries>
</div>
<$mt:include module="Banner Footer"$>
</body>
</html>
In the above example you can see how template modules can dramatically improve the readability of your templates by reducing their complexity. It also makes site-wide changes much simpler. Change in one place, the appropriate template module, republish and voila.
- Prev: Adding an About Page to your Website
- Next: Building Navigation for Your Website
- Table of Contents: Building Websites with Melody, a Guide for Designers
Category: Guide
Tags: design guide, template modules, mt:include
Questions, comments, can't find something? Let us know at our community outpost on Get Satisfaction.
- Author: Byrne Reese
- Edited by: Violet Bliss Dietz