Anatomy of a template
Movable Type’s templates are something like the form letters or mail-merges you can create in your word-processor. Very, very complicated form letters, with lots of spaces for pieces of your blog that vary from day to day or post to post. When you look at a Movable Type template, you are seeing three basic elements:
- text on your blog page that never changes (e.g. the title of your search box or blogroll, if you have these things)
- HTML markup that ends up on your blog page, behind the scenes (find the View Source item in your web browser’s menus to see it)
- Movable Type placeholders for elements of your blog page that change (e.g. dates and posts)
Unfortunately, it can be very difficult to tell HTML markup from Movable Type placeholders. If you get lost, it’s not just you—it’s confusing. I lose my place in templates all the time. Honestly, I do. A moderately complex template looks like one great big angle-bracketty mess. So give yourself time and patience to sort it all out.
I’m going to assume here that you understand the basics of HTML tagging—you know what angle brackets are for, and you can tell a start-tag from an end-tag. If not, my advice to you is to choose View Source in your browser on a blog you know has clean markup (I recommend Dive Into Mark, mostly to annoy him) and compare what you see to what appears on the page. You’ll soon figure out what’s what by osmosis.
How do you tell an HTML tag, which Movable Type will use as-is on your blog page, from a Movable Type placeholder? A couple of ways:
- Look for the MT at the beginning of the name, so:
<MTEntryDate>. No HTML tagname starts with the letters “MT,” and I believe all the Movable Type placeholders do. - Look for dollar signs just inside the wedges, so:
<$MTBlogName$>. Only MT placeholders can have dollar signs in those places. The dollar signs are always optional, so you can’t count on them as your sole discriminator, but they are helpful when present.
What’s really ugly is that you can nest a Movable Type placeholder inside an HTML tag. Talk about your angle-bracketty messes! This typically happens inside an HTML attribute value. Take, for example, the permalink, which often shows up as the value of a href because it’s a link.
For the sake of argument, let’s use “Permalink” as the text of the permalink (as I do), rather than the time or date of posting as many other blogs do. The permalink part of a Movable Type template would then look like this:
<a href="<MTEntryPermalink>">Permalink</a>
Movable Type figures out what the URL for the permalink is and substitutes it into the page where the placeholder <MTEntryPermalink> is. The resulting HTML on the blog page is something like this (minus the line-break I am putting in for readability):
<a href="http://blog.example.com/2003_04.htm#000581">
Permalink</a>
and people surfing the blog can click on the word “Permalink” and go to the entry in the archives.
Mmmmmm… angle brackets. If you survived this example, you’ll be fine. Even if you only kinda-sorta get it—you’ll be fine.
Newbie hitch: The single commonest mistake I make while editing my templates is leaving out (or accidentally deleting) end-quotes and close-angle-brackets. If you just edited your template and great huge chunks of your page are suddenly being swallowed into the ether, this is probably why. Check what you edited for missing quotes and brackets.
Next up: Hmm. I’m not sure. Maybe MT placeholders related to the blog page as a whole? If you have other ideas, let me know.