Not a developer? Go to MovableType.com

Documentation

Setting up Reply To Links for Threaded Comments

  1. The first step is to add the <$mt:CommentReplyToLink$> template tag where you would like the “reply to this comment” link to appear. The tag must be within an <mt:Comments> container tag. We recommend placing it in the comment byline:

    <p class="comment-footer">
        <$MTCommentAuthorIdentity$>
        Posted by <$mt:CommentAuthorLink default_name="Anonymous"$> |
        <a href="<$mt:CommentLink$>"><abbr class="published" title="<$MTCommentDate format_name="iso8601"$>"><$MTCommentDate$></abbr></a> |
        <$mt:CommentReplyToLink$>
    </p>
    

    By default, <$mt:CommentReplyToLink$> creates a link with the text “Reply”. However, this can be customized by giving the tag an optional text attribute like so, for example:

    <$mt:CommentReplyToLink text="Reply to this comment"$>
    
  2. The next step is to use a new <$mt:RepliedComment$> container tag to show who the commenter is replying to. You can use any of the MTComment template tags you find in Movable Type within an MTRepliedComment container as well as <mt:Else> which can be used as the “default” (i.e. if the comment is a new thread and not replying to someone else). Once again, this tag must be placed within an <mt:Comments> container tag and we recommend the posted byline:

    <p class="comment-footer">
        <$MTCommentAuthorIdentity$>
        <mt:IfCommentParent>
            <span class="vcard author"><$MTCommentAuthorLink$></span> replied to
            <mt:CommentParent>
                <a href="<$mt:CommentLink$>">comment from <$MTCommentAuthor$></a>
            </mt:CommentParent>
        <mt:else>
            <span class="vcard author"><$MTCommentAuthorLink$></span>
        </mt:IfCommentParent> |
        <a href="<$mt:CommentLink$>"><abbr class="published" title="<$MTCommentDate format_name="iso8601"$>"><$MTCommentDate$></abbr></a> |
        <mt:CommentReplyToLink>
    </p>
    

    So with the above example, new, non-reply comments byline look something like this:

    <Maggie> | <date> | <reply>
    

    …and if the comment was replying to another comment, the comment byline would look something like this:

    <Bart> replied to <comment from Maggie> | <date> | <reply>
    
  3. Add the parent_id hidden parameter to your comment form.

    ...
    <input type="hidden" name="parent_id" value="" id="comment-parent-id" />
    ...
    
  4. The final step is to add the reply checkbox to the comment form. Be sure not to place it inside of an element which may be hidden based upon the user’s logged in state, we recommend it is added just before the “comments-open-text”:

    ...
    <div id="comment-form-reply" style="display:none">
        <input type="checkbox" id="comment-reply" name="comment_reply" value="" onclick="mtSetCommentParentID()" />
        <label for="comment-reply" id="comment-reply-label"></label>
    </div>
    <div id="comments-open-text">
        ...
    
  5. Update your JavaScript template with the following functions:

    function mtShow(id) {
        var el = (typeof id == "string") ? document.getElementById(id) : id;
        if (el) el.style.display = 'block';
    }
    function mtSetCommentParentID() {
        var checkbox = document.getElementById('comment-reply');
        var parent_id_field = document.getElementById('comment-parent-id');
        if (!checkbox || !parent_id_field) return;
        var pid = 0;
        if (checkbox.checked == true)
            pid = checkbox.value;
        parent_id_field.value = pid;
    }
    function mtReplyCommentOnClick(parent_id, author) {
        mtShow('comment-form-reply');
        var checkbox = document.getElementById('comment-reply');
        var label = document.getElementById('comment-reply-label');
        var text = document.getElementById('comment-text');
        // Populate label with new values
        var reply_text = 'Replying to <a href="#comment-'+ parent_id +'" onclick="location.href=this.href; return false">comment from '+ author +'</a>';
        label.innerHTML = reply_text;
        checkbox.value = parent_id; 
        checkbox.checked = true;
        text.focus();
        mtSetCommentParentID();
    }
    

    You may already have similar functions in your JavaScript template, feel free to merge the above functions with your own.

Once these changes are made, make sure to rebuild the necessary files!

Back

1 Comment

Dan Wolfgang

Dan Wolfgang on September 3, 2008, 8:13 p.m. Reply

Coupla notes:

In step 2, it the reference to the mtRepliedComment should be changed to mtParentComment and mtIfParentComment.

In step 3, the actual mtCommentParentID tag is missing (it goes in the value=”” spot).

Leave a Comment