MT4’s Comment Templates for Users of MT 3.x or Earlier

A clean set of MT Comments for your Entries

If you have been using Movable Type’s templates for a while, MT4’s default templates might have you scratching your head. A great way to learn how the new system works, and how to adapt your current templates to the new system, is to start with a concrete example. What we’ll learn:

• How a default MT4 template looks
• What all those crazy includes and variables do
• How to simplify includes and variables into a “flat” template
• What conditional tags like MTIfCommentsActive can do to help us
• What a basic commenting form looks like, so we can reuse it in an existing design
• How to create a comment experience that supports MT4’s built-in CAPTCHA, user registration and OpenID support

One of the most practical examples of the things most people want to do with MT4’s new abilities is figuring out how to update your comment form to use all of MT4’s new features. To get started, we’ll look at the default templates that MT4 comes with. Here’s what the MT4 default Entry template looks like:

<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”$>

<$MTInclude module=”Entry Detail”$>

<$MTInclude module=”TrackBacks”$>

<$MTInclude module=”Comments”$>

<$MTInclude module=”Footer”$>

Pretty straightforward, especially once you know that the MTInclude tags are bringing in content from the module templates of the same name. We want to find the pieces we need to add a comment form to our own sites, so it’s helpful to remember that <$MTInclude module="Comments"$> inserts the contents of the “Comments” module. That looks like this:

<MTIfCommentsActive>
<div id=”comments” class=”comments”>
    <MTIf name=”comment_preview_template”>
    <$MTInclude module=”Comment Form”$>
    </MTIf>
    <MTComments>
        <MTCommentsHeader>
    <h2 class=”comments-header”><$MTEntryCommentCount$> Comments</h2>
    <div class=”comments-content”>
        </MTCommentsHeader>
        <$MTInclude module=”Comment Detail”$>
        <MTCommentsFooter>
    </div>
        </MTCommentsFooter>
    </MTComments>
    <MTUnless name=”comment_preview_template”>
    <$MTInclude module=”Comment Form”$>
    </MTUnless>
</div>
</MTIfCommentsActive>

What Does All That Stuff Do?

There are a few things going on here — we’ve got the MTCommentsHeader, which encloses everything you’d want as a header above your comment listing. MTCommentsFooter does the same thing for the content you’d want below your comment listing. Two modules called “Comment Detail” and “Comment Form” display the list of comments themselves, as well as (obviously) the form for submittting new comments.

And then there’s something interesting: <MTUnless name="comment_preview_template">. The Comment Preview Template is one of those special system templates — it’s only displayed when someone types in a comment on your site, and then clicks “Preview” to see what it looks like. The MTUnless tag here basically says, “Publish the content in here only if you know that someone is not previewing a comment”. That does smart stuff like put the comment form at the top of the list of comments if you’re previewing, but at the bottom of the list if you’re not.

How does MT know if it’s including this content on a Comment Preview Template? Well, the default Comment Preview Template sets a variable where it defines its own name as “comment_preview_template”, which makes MT do the right thing here. If you weren’t using the default template and didn’t set this variable on your own, this wouldn’t work. For now, we’ll take all the Comment Preview things out of our templates to keep them as simple as possible.

Simplifying Our Template A Bit

<MTIfCommentsActive>
    <MTComments>
        <MTCommentsHeader>
            <$MTEntryCommentCount$> Comments
        </MTCommentsHeader>
        <$MTInclude module=”Comment Detail”$>
        <MTCommentsFooter>
        </MTCommentsFooter>
    </MTComments>
    <$MTInclude module=”Comment Form”$>
</MTIfCommentsActive>

Putting It All Together

<—
To begin, we see whether comments are enabled on this entry.
// —>

<MTIfCommentsActive>
    <MTComments>
   
        <—
        Then we’ll display a header, in this case just showing a count of how many comments have been published so far.
        // —>
       
        <MTCommentsHeader>
            <$MTEntryCommentCount$> Comments
        </MTCommentsHeader>
       
        <— We’ll want to display the comment author’s info —>
       
        <div class=”comment” id=”comment-<$MTCommentID$>”>
            <$MTCommentAuthorLink default_name=”Anonymous” show_email=”0”$>
           
            <!— And we check if we’ve got a name for the author; If so, it’ll be published. —>
            <MTIfNonEmpty tag=”CommentAuthorIdentity”>
                <$MTCommentAuthorIdentity$>
            </MTIfNonEmpty> said:
        </div>
       
        <— Here’s the actual text of the comment itself. —>

        <$MTCommentBody$>
       
        <—
        And then the link to and date for the comment. We could have a footer for all of our comments, too, but we’ll leave it blank.
        // —>

        <a href=”#comment-<$MTCommentID$>” title=”Permalink to this comment”><$MTCommentDate format=”%x %X”$></a>

        <MTCommentsFooter>
        </MTCommentsFooter>
    </MTComments>

    <—
    First, we test if this entry or page allows additional comments in the first place. If it does, we’ll show all the commenting info here.
    // —>
   
    <MTEntryIfCommentsOpen>
   
        <h2>Leave a comment</h2>
   
        <MTIfRegistrationAllowed>
       
            <!—
            If your site allows registration, then show signed-in users their name.
            // —>
       
            <script type=”text/javascript”>
            <!—
            writeCommenterGreeting(commenter_name, <$MTEntryID$>, <$MTEntryBlogID$>, commenter_id, commenter_url);
            // —>
            </script>
           
        </MTIfRegistrationAllowed>
       
        <!—
        The main comment form starts here. Most of these form elements are self-explanatory.
        // —>
       
        <form method=”post” action=”<$MTCGIPath$><$MTCommentScript$>” name=”comments_form” id=”comments-form” onsubmit=”if (this.bakecookie.checked) rememberMe(this)”>
       
            <input type=”hidden” name=”static” value=”1” />
            <input type=”hidden” name=”entry_id” value=”<$MTEntryID$>” />
            <input type=”hidden” name=”__lang” value=”<$MTBlogLanguage$>” />
   
            <label for=”comment-author”>Name</label>
            <input id=”comment-author” name=”author” size=”30” value=”” />
   
            <label for=”comment-email”>Email Address</label>
            <input id=”comment-email” name=”email” size=”30” value=”” />
   
            <label for=”comment-url”>URL</label>
            <input id=”comment-url” name=”url” size=”30” value=”” />
           
            <label for=”comment-bake-cookie”>
            <input type=”checkbox” id=”comment-bake-cookie” name=”bakecookie” onclick=”if (!this.checked) forgetMe(document.comments_form)” value=”1” />Remember personal info?
            </label>
           
            <—
            Here’s another conditional If tag: If HTML’s allowed in your comments, the template will tell your users they can use it.
            // —>
   
            <label for=”comment-text”>Comments
            <MTIfAllowCommentHTML>(You may use HTML tags for style)</MTIfAllowCommentHTML>
            </label>
            <textarea id=”comment-text” name=”text” rows=”15” cols=”50”></textarea>
   
            <—
            Okay, this one’s a little tricky. We’re deciding whether to show a CAPTCHA to users based on whether comments are allowed, registration is enabled, and CAPTCHA has been turned on in MT. So that’s three different If tags nested inside each other.
            // —>
   
            <MTIfNonEmpty tag=”MTCaptchaFields”>
           
                <MTIfCommentsAccepted>
                    <MTIfRegistrationAllowed>
                        <MTElse><$MTCaptchaFields$>
                    </MTIfRegistrationAllowed>
                </MTIfCommentsAccepted>
               
                <div id=”comments-open-captcha”>
                </div>
               
            </MTIfNonEmpty>
           
            <input type=”submit” accesskey=”v” name=”preview” id=”comment-preview” value=”Preview” />
            <input type=”submit” accesskey=”s” name=”post” id=”comment-submit” value=”Submit” />
   
        </form>
    </MTEntryIfCommentsOpen>
</MTIfCommentsActive>

It Works!