Creating Printer Friendly Versions of Blog Entries with Movable Type 4
October 24, 2007
| Permalink
| Comments (8)
There are several methods available for creating printer friendly pages of websites but I’m only going to focus on one. Using Movable Type’s dynamic publishing option we can create on-demand printer friendly pages of weblog entries. Cool.
Roll up your sleeves because this method includes changing a blog’s publishing settings, creating a new archive template, archive mapping setting and adding links to an existing template module. It’s really not all that daunting but it was cool to maybe make it sound daunting and hard there for a minute.
Go to Preferences -> Publishing
Under Publishing Options find “Publishing Method” and change it to “Set each template’s Publish Options separately.”
Check “Enable conditional retrieval”
Go to archive templates - > Create a new entry template
Let’s call the new template something like Print. For printer friendly pages I only want the my site’s header, entry title, entry date and entry body to print. I don’t want comments or trackbacks, sidebar content or footer content. So in my new Print template I only include the necessary archive variables and then code for the specific content as follows:
<MTSetVar name="body_class" value="mt-archive-listing mt-entry-archive">
<MTSetVar name="sidebar" value="1">
<MTSetVar name="module_about_context" value="1">
<MTSetVar name="body_onload" value="individualArchivesOnLoad(commenter_name)">
<MTSetVarBlock name="page_title"><$MTEntryTitle remove_html="1"$></MTSetVarBlock>
<$MTInclude module="Header"$>
<b><$MTEntryTitle$></b><br/>
<$MTEntryDate format="%x"$>
<MTIfNonEmpty tag="EntryBody">
<$MTEntryBody$>
</MTIfNonEmpty>
<MTIfNonEmpty tag="EntryMore" convert_breaks="0">
<div id="more" class="asset-more">
<$MTEntryMore$>
</div>
</MTIfNonEmpty>
Before saving make sure to click the box to Enable dynamic publishing for this template. After saving you’ll be able to edit the template’s archive mapping. This is important. This determines that address of your printer friendly page.
So click Create Archive Mapping, leave type set to Entry and choose add. After the archive mapping has been created we need to edit it to a custom address for our printer friendly pages. From the pull down menu select custom and edit it to your liking. This is the custom archive mapping that I’ve used:
%y/%m/%F/print/index.html
That mapping means the address for my printer friendly pages will looking something like: domainname.com/2007/10/entryname/print/.
Next we have to create a link to our printer friendly pages. In the entry metadata template module add the following code wherever you want your printer friendly link to be:
<a href="<mt:BlogArchiveURL><mt:EntryDate format="%Y/%m">/<mt:EntryBasename separator="-" />/print/">Printer friendly version</a>
One note about this code, notice the separator attribute with the mt:EntryBasename tag. By default mt:EntryBasename will spit out urls like so base_name.html. The problem is that my actual archive urls are base-name.html. See the difference? It’s underscore versus hyphen. Without the separator attribute the urls created by the mt:EntryBasename tag wouldn’t match the actual address of the printer friendly pages the new template is going to be creating.
Rebuild your entire site. Marvel at the magic of printer friendly pages.
As always if I've made any mistakes or if you have any questions please let me know.
Differentiating Author Comments in Movable Type 4
October 23, 2007
| Permalink
| Comments (0)
We’ve discussed how to implement alternating comment styles. Another useful option for customizing comment displays is to apply a different style to comments left by an entry’s author. This allows readers to quickly and easily find the author’s contributions in the comments. I find this particularly useful in conversations that have several commenters or conversations where the author is a frequent responder.
Movable Type 4 has a new tag that makes applying a different style to author comments dead simple. This tag is so simple and straight forward even the Movable Type documentation is clear on it (I tease because I love you MT documentation).
<mt:IfCommenterIsEntryAuthor>
<!-- do something -->
</mt:IfCommenterIsEntryAuthor>
The “do something” in our case is to apply a different style in the cases where a comment’s author is the same as an entry’s author.
The first step toward applying a different style is of course creating that style. A simple example of an author style:
.author {
font-weight:bold;
border:2px solid black;
}
After you’ve placed that code in your stylesheet it’s time to dig into the Comment Detail template module. Before I show you this sample code let me say that there are other ways to do this. Probably shorter, more efficient blocks of code. However, this one works well for me, and the way my brain works, so it’s the one I use.
<mt:IfCommenterIsEntryAuthor><div class="author">
<mt:if name="__odd__">
<div class="odd">
<mt:else>
<div class="even">
</mt:if>
<div class="comment"<MTIfArchiveTypeEnabled archive_type="Individual"> id="comment-<$MTCommentID$>"</MTIfArchiveTypeEnabled>>
<div class="inner">
<div class="comment-header">
<$MTCommentAuthorLink default_name="Anonymous" show_email="0"$> <MTIfNonEmpty tag="CommentAuthorIdentity"><$MTCommentAuthorIdentity$></MTIfNonEmpty>
said:
</div>
<div class="comment-content">
<$MTCommentBody$>
</div>
<div class="comment-footer">
<a href="#comment-<$MTCommentID$>" title="Permalink to this comment"><$MTCommentDate format="%x %X"$></a>
</div><!--End Author Class-->
<mt:else> <mt:if name="__odd__">
<div class="odd">
<mt:else>
<div class="even">
</mt:if>
<div class="comment"<MTIfArchiveTypeEnabled archive_type="Individual"> id="comment-<$MTCommentID$>"</MTIfArchiveTypeEnabled>>
<div class="inner">
<div class="comment-header">
<$MTCommentAuthorLink default_name="Anonymous" show_email="0"$> <MTIfNonEmpty tag="CommentAuthorIdentity"><$MTCommentAuthorIdentity$></MTIfNonEmpty>
said:
</div>
<div class="comment-content">
<$MTCommentBody$>
</div>
<div class="comment-footer">
<a href="#comment-<$MTCommentID$>" title="Permalink to this comment"><$MTCommentDate format="%x %X"$></a>
</mt:IfCommenterIsEntryAuthor>
</div>
</div>
</div>
</div><!--End odd or even class-->
You’ll notice that this contains the code for alternating comments as well as as the IfCommenterIsEntryAuthor stuff. So implementing this as is (with accompanying styles in your stylesheet of course) will give you 3 different styles in your comments. One for even comments, one for odd comments and one for author comments. You’ll want to double check any inheritance issues in your CSS so that your author style doesn’t get dominated by either the even or odd class (because remember your author comments are going to be either even or odd in addition to being an author comment).
As always if I've made any mistakes or if you have any questions please let me know. Thank you for reading.
Alternating Comment Styles with Movable Type 4
October 22, 2007
| Permalink
| Comments (2)
A list of comments, particularly a long list, that doesn’t include any style differentiation can get a little hard to read.
Using two alternating comment styles will give your readers’ eyes a break and your blog a little more style. Happily, Movable Type 4 provides a relatively simple way to do this.
![]()
There are really only two steps to implementing alternate comment styles. The first is actually creating the two different styles. You can of course call these styles anything you like but since the styles are going to alternate between even and odd comments I like to call the styles, well, even and odd. Define these styles however you like and place them in your stylesheet. Here’s an example:
.even {
background-color:#FFF;
padding:8px;
margin-bottom:5px;
}
.odd {
background-color:#F4F4F4;
padding:8px;
margin-bottom:5px;
border:2px dotted #999;
}
Simple enough right? Good. The next step is where the alternating magic within Movable Type happens. I’m going to give you the code to make that magic work and then I’ll go into a bit of detail about what that code is doing. You can choose to either simply paste the code straight into your template and move on or you can dive into the why and how it works.
The following code can replace all of the code in your Comment Detail template module or you can paste the necessary new parts in.
<mt:if name="__odd__">
<div class="odd">
<mt:else>
<div class="even">
</mt:if>
<div class="comment"<MTIfArchiveTypeEnabled archive_type="Individual"> id="comment-<$MTCommentID$>"</MTIfArchiveTypeEnabled>>
<div class="inner">
<div class="comment-header">
<$MTCommentAuthorLink default_name="Anonymous" show_email="0"$> <MTIfNonEmpty tag="CommentAuthorIdentity"><$MTCommentAuthorIdentity$></MTIfNonEmpty>
said:
</div>
<div class="comment-content">
<$MTCommentBody$>
</div>
<div class="comment-footer">
<a href="#comment-<$MTCommentID$>" title="Permalink to this comment"><$MTCommentDate format="%x %X"$></a>
</div>
</div>
</div>
</div><!--End odd or even class-->
Pasted it in? Good. Seeing alternating styles between comments? Excellent. Why? It’s all thanks to Template Loop Meta Variables and if/else statements.
The Movable Type documentation explains Template Loop Meta Variables thusly:
Movable Type exposes a number of different template tags called container tags that loop over a set of objects. This allows designers to display for example the last 10 entries on a blog, or to display each of the comments associated with an entry.
As Movable Type iterates or loops over a list of objects in this fashion it maintains a number of meta variables for you, allowing you to test if the current item is an odd or even item in the list for example.
Got that? Maybe, maybe not. For our purposes the easiest way to understand this is to say that when anything Movable Type outputs takes the general form of a list where one item follows another (blog entries, comments, trackbacks, etc.) Movable Type keeps track of which items are oddly numbered (1, 3, 5) in that list and which are evenly (2, 4, 6) numbered. Until you implement alternating comment styles or some other modification there is no difference between odd and even comments on your blog’s output. That doesn’t mean Movable Type doesn’t know which is which though. By knowing that difference Movable Type is able to conditionally apply different styles based on an if/else statement. That statement is:
<mt:if name="__odd__">
<div class="odd">
<mt:else>
<div class="even">
</mt:if>
That code says “if a comment isn’t odd then it’s even. If it is an odd comment apply the odd style class, if it is an even comment then apply the even style class.”
You might be wondering, since the above code snippet doesn’t actually contain the word “comments” and it comes before any of the comment tags in the template we’ve put it in, how does Movable Type know for certain, that it’s odd and even numbered comments we want to keep track of. and not something else. In this case remember that the Comment Detail template module is pulled into the Comment template module as an include. So even though our code snippet is coming at the beginning of the Comment Detail template it’s really in the middle of all the tag soup for comments. So it’s clear to Movable Type that our if/else is referring to comments specifically.
You can see the code used in this tutorial in action at my personal blog. This tutorial was inspired by a conversation about the Gizmos for MT plugin at Appnel Solutions.
As always if I've made any mistakes or if you have any questions please let me know. Later this week we'll look at how to style comments from a blog entry's author differently than other comments.
Unsticking Menus in Movable Type 4
October 18, 2007
| Permalink
| Comments (0)
Six Apart has recently released some updated JavaScript to keep navigational menus in Movable Type 4 from getting stuck. With the previous .js file sometimes the menus would get stuck in the open, expanded position and wouldn't close until you moused over them again. This update JavaScript corrects that problem.
Unstick those menus - some users have rightly complained that our pull down menus sometimes get stuck open, and can only be closed by hovering the mouse over them again. To avoid this very annoying "feature" you can download a new version of mt.js and install it over the file of the same name in your Movable Type 4.01 installation.
Working with Movable Type 4.0 Templates: Sidebar
October 17, 2007
| Permalink
| Comments (0)
The new templates and template structure in Movable Type 4 streamline
and simplify the process of making site wide changes to your blog. Well
that’s what they do once you actually understand the templates and
template structure. But understanding how the templates work together
and digesting the tag soup that swims in each of those templates? Not
exactly simple. So at the suggestion of a friend I thought I’d create a
series of basic tutorials that help explain the templates and template
structure. The tutorials will begin at a relatively basic entry level.
Instead
of just breaking down templates line by line I thought it would be
easier and more practical to look at templates in the context of
actually doing something. You don’t really need to understand every
single line of code if you know where and how to make the changes to
accomplish what you want. For this first tutorial we’ll be making
changes to the sidebar. Specifically we’re going to remove a widget we
don’t want and add Google AdSense ads in the sidebar, after the archive
content, on every page of a blog.
Before we get to actually editing any templates I can’t recommend highly enough that you download and install the Template Shelf
plugin. If you’re going to spend any time at all editing your templates
this plugin will make your life much easier. For this tutorial we’re
only going to be editing one template. But it’s not unlikely that
you’ll be needing to hop back and forth between multiple templates and
modules in the future and this plugin makes that much, much simpler.
I’ve set up a brand new blog
to serve as an example of the work done in this tutorial. I selected
the minimalist light blue style and a two column (wide-thin) layout
from Stylecatcher in Movable Type. Since we’ve got a two column layout
the template we’re going to be modifying is the Sidebar - 2 Column
Layout. This template is actually a template module. What’s a module?
The best analogy I can think of is that a template module is like a
backpack. You’ve got a whole bunch of stuff (all the code for the
sidebar) you need to get somewhere (in the sidebar of all the pages on
your blog) and it’s much easier to put all of that stuff in a backpack
(a template module) and then unpack it when you get to where you’re
going.
So instead of having to put all your sidebar code into
every template (main index, individual archive pages, monthly archives,
etc) you just reference the particular module that contains the code
like so <$MTInclude module="Sidebar - 2 Column Layout"$>.
Out of the gate this is what the sidebar looks like.
Continue reading Working with Movable Type 4.0 Templates: Sidebar.
Forget MT:OtherBlog Let’s All Use MT:MultiBlog Instead
October 16, 2007
| Permalink
| Comments (0)
When my friend and I were first discussing the MT:OtherBlog tag I mentioned that it seemed to do the exact same thing as MT:MultiBlog. I couldn’t, and still can’t, figure out why there would be two different tags with redundant functions but it turns out MT:MultiBlog has a couple more bells and whistles than MT:OtherBlog that make it much more functional.
In the comments of my post on MT:OtherBlog J. Brotherlove reminded me of one serious advantage PHP includes have over using MT:OtherBlog: automatic updating. If I’m pulling content from Blog 1 with a PHP include into Blog 2 whenever Blog 1 is updated the pulled content is automatically updated on Blog 2. This isn’t the case when using MT:OtherBlog. When I update Blog 1 the pulled content on Blog 2 will not be updated until Blog 2 is rebuilt (either indexes or the entire blog depending on how you’ve got it set up). So after round 1 the score card finds MT:OtherBlog winning in the ease of use category but PHP includes winning in terms of actual useful functionality. So, a tie.
But then (again in the comments of my post on MT:OtherBlog) David Raynes dropped some incredibly helpful knowledge that turned PHP includes and MT:OtherBlog both into also-rans. Turns out David originally developed the MT:OtherBlog functionality as a plugin for an older version of Movable Type. With Movable Type 4.0 this functionality was packaged into the application as MT:MultiBlog. While on the surface MT:MultiBlog and MT:OtherBlog do the same thing (namely allow you to easily pull content from one blog into another blog) the former has a serious advantage.
The MT:MultiBlog tag gets its functionality from the MT:MultiBlog plugin and that plugin has rebuild triggering options. Whereas when using MT:OtherBlog I would have to manually rebuild Blog 2 to force it to pull the most recent content from Blog 1 when using MT:MultiBlog I can set a rebuild trigger to automatically rebuild.
Let me use my personal blog and Correspondence Notes again as a real world example. I want the content I’m pulling from Correspondence Notes into the footer of this blog to always be up to date. Using MT:MultiBlog I have two steps to making that happen. First step is getting the code in order:
<mt:MultiBlog include_blogs="1">
<MTEntries lastn="2">
<a href="<$MTEntryLink$>"><$MTEntryTitle$></a>
<$MTEntryExcerpt$><p>
</MTEntries>
</mt:MultiBlog>
This is of course almost identical to the code used in the MT:OtherBlog example. David rightly points out that this code could be condensed but I prefer writing it out like I have here. Just a personal preference so feel free to do it however you like.
The second step is to configure a rebuild trigger using the MT:MultiBlog plugin. Go to plugin configurations for Blog 2.
Select MT:MultiBlog 2.0, click settings and then Create Rebuild Trigger. Choose the blog that will be triggering the rebuild (in my example it’s Correspondence Notes) and configure it. I chose to rebuild the On a path indexes whenever a Correspondence Notes entry is saved.
Now my footer here on my personal blog will always be rebuilt when a new entry is saved at Correspondence Notes and thus my footer here will always have the most up to date content. Sweet.
Change the Default Font in Apple's Pages
October 16, 2007
| Permalink
| Comments (0)
That title is a little misleading because you can't actually change the default font in Apple's Pages. I find that very frustrating because I find Gill Sans to be much more pleasing to the eye than Helvetica. Although you can't change the default font you can implement a simple work around that achieves the same effect as say setting a new default font in Microsoft Word would.
1. Open a blank document in Pages
2. Set your font settings to whatever you want the new default to be
3. Save this document as a template
4. Go into Preferences (General Preferences specifically)
5. In the "For New Documents" section click the button for "Use template:"
6. Click the choose button and select the template you saved a few steps ago
A Useful Keyboard Shortcut for iTunes
October 15, 2007
| Permalink
| Comments (0)
For the longest time I had a significant brain block that prevented me from figuring out a keyboard shortcut for searching within iTunes. Today that block finally subsided. When iTunes is the active window Command-Option-F (also known as Apple Key-Option-F for new to Macs people) will allow you to instantly type your search info. Huzzah.