Customizing the Archive

Take a look again at the blog page screen shot in Figure 6-11. Notice the format of the archive list — a date range, with each archive accessible via a different hypertext link. Over time, this list can get quite large and take up considerable room in your page.

Rather than list each archive link within the main blog page, you can host a separate Archive index page that contains the list of archived items. Then, within the blog page, attach a link to this page rather than the individual archive items.

Creating a Custom Archive Page

To demonstrate how to create an Archive index page, within the Archive view, click the Archive template option in the upper righthand side of the page. A new page opens showing a small template used to print out the archive history links. As displayed in Example 6-3, the content doesn’t contain any HTML elements.

Example 6-3. Blogger archive listing text

<Blogger>
    document.write("<a href='<$BlogArchiveLink$>'><$BlogArchiveName$></a><br>")
</Blogger>
if (location.href.indexOf("archive") != -1) {
document.write("<a href=\"./\">current >></a>")
}

The content of the Archive template is so simple because the content is normally opened within the template page, using JavaScript:

<script type="text/javascript" src="<$BlogArchiveFileName$>"></script>

When the file is opened in the blog page, JavaScript prints out the archive links.

To create a separate archive page, copy the blog template to the Archive template and then adjust the contents ...

Get Essential Blogging now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.