Blueprinted

Blueprinted is a template for Textpattern designed by Natalie Jost. The look and feel of the site is based on Blueprint Magazine with it’s ample whitespace, decorative typefaces, and clean lines.

A few unique features

Magazine Contents

The template’s “home” page, or default page, is set up like the table of contents of a magazine, showing the ID number of each article as if it were a page number.

The most recent article

The most recent article is set up to show its article image at full size (450px wide), but can easily be changed to accommodate the image’s thumbnail instead, floating to the left.

Search and find

For the search page I set up a separate section to make searching easier and cleaner. You’ll also find the search results highlighted to make it easier to find what you’re looking for.

It’s all in the details

As you get settled into the template, there are a few things you’ll need to know about how the styles set up in the CSS.

Headings

The main title of the site uses h1, the page heading (in brackets) uses h2, and the article title uses h3. So… within your article, you’ll want to stick to h4 and h5.

Quotations

Your basic blockquotes bq. will look like a typical quote, a slightly offset color and size with italicized font. Then you’ll have a pull quote if you like to use them. For a pull quote simply give a paragraph a class of “pq” for pull quote p(pq)..

Images and Captions

Images are designed to float to the left. You also have the option to add a caption to an image. Place a caption paragraph just before your image and give it a class of “caption” p(caption). and it will hang to the left of the article body, next to your image. You don’t have to use this as an image caption either, but you could use it in any place where you’d like to add a side note to the side of the article.

Code and other pre-formatted text

If you write a lot of lengthy strings of code, you’ll find textile’s bc. (for block code) handy. This will wrap your code in <pre> and <code> tags. The code will appear with a monospace font and a top/bottom border to separate it from the main content.

For any other pre-formatted, use pre. to specify. This will not appear the same as code, but will keep the formatting for use with poetry or other strings of pre-formatted text.