Learning Movable Type: Category Archive Pages


The tips in this tutorial are designed around the templates for MT 2.661 and earlier versions.

Once you have set up category archiving, the next step is to customize the category archive display pages. The default Category Archive Template that comes with Movable Type lists the whole entries (not excerpts), doesn't tell the viewer what category she is actually viewing, and has no intuitive link back to the home page. We'll address these issues here.

1. Listing excerpts instead of full entries. You may want to keep the archives as is, with full entries. But if you have few categories and lots of entries you will soon have very large and long category pages. Changing to excerpts instead of the full entries is easy. Open up the template editing window for Category Archives Template. Find the following code:

<$MTEntryBody$>

<MTEntryIfExtended>
<$MTEntryMore$>
</MTEntryIfExtended>

Replace the above code with the following:

<$MTEntryExcerpt$> </$MTEntryExcerpt$><br />

Have the title of your excerpt be a hyperlink to the full entry. To do this, replace the following code on your Category Archives Template:

<h3 class="title"><$MTEntryTitle$></h3>

with

<h3 class="title"><a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a></h3>

2. What category is this? There are lots of ways to list the category you are in on the category page. All you have to do is add the following code somewhere on the Category Archive Template page:

<$MTArchiveTitle$>

To show the category category in the title banner, change your banner div section like so:

<div id="banner"> <h1><a href="<$MTBlogURL$>" accesskey="1"><$MTBlogName$></a></h1> <span class="description"><$MTBlogDescription$></span> </div>

to

<div id="banner"> <h1><a href="<$MTBlogURL$>" accesskey="1"><$MTBlogName$>: <$MTArchiveTitle$></a></h1> <span class="description"><$MTBlogDescription$></span> </div>

3. A nav link back home. If your website visitor clicks on the title of your weblog, MT should direct her back to your home page. But not everyone knows to do that. If you would like to add a more explicit link back home (see here for an example, with little directional arrows, here's the code (right after the container and blog div tags).

<div id="container">

<div class="blog">

<h3 class="title"><a href="<$MTBlogURL$>" accesskey="1"> &laquo; Home </a></h3><br><br>

You can combine a home link and a category title like so:

with this code:

<h3 class="title"><a href="<$MTBlogURL$>" accesskey="1"> &laquo; <$MTBlogName$> Home &raquo; </a> <$MTArchiveTitle$></h3><br />

Links for further category archive customization:

Brad Choate's Next/Previous Category Plugin
MT Support Forum Thread on Category Images
MT Wiki on Category Images
Different templates for different category archive pages - from Stepan Rhia


Posted by Elise Bauer on February 26, 2004 11:21 AM to Learning Movable Type http://www.learningmovabletype.com/