How to reverse the order of comments on Confluence pages

From a recent comment on Atlassian Answers, Norman Hills asked “Is it possible to reverse the order in which comments appear?

This is straightforward if done client-side, so I’ve written it up here.

If you just want to reverse the order for good, browse to Confluence Admin | Look & Feel | Custom HTML

Add this to At the end of the HEAD:

<script>
  AJS.toInit(function(){
    $comments = AJS.$('#page-comments'); 
    $comments.children().each(function(i,li){$comments.prepend(li)});
  });
</script>

Job done.

For extra points

If you want to be able to reverse the order, then it’s slightly more effort.

Browse to Confluence Admin | Look & Feel | Custom HTML

Add this to At the end of the HEAD:

<script>
  function reverseCommentOrder(){
    $comments = AJS.$('#page-comments'); 
    $comments.children().each(function(i,li){$comments.prepend(li)});
  }
  
  AJS.toInit(function(){
    // reverse the comment order
    reverseCommentOrder();
  
    // add a link to reverse the order
    AJS.$('#comments-section-title').append('<a id="page-comments-reverse" href="#">(Reverse Order)</a>');
    AJS.$('#page-comments-reverse').css({ 'color':'#999','font-size':'0.65em'})
                                   .click(function(e){
      reverseCommentOrder();
      e.preventDefault();
    });
  });
</script>

That’s all. Have fun.

David is a senior developer and solutions architect at AppFusions based in Nottingham, England.

AppFusions
AppFusions solves mixed-technology integration problems. We bring engineering and business workflows together, you can work better, faster and smooter.

AppFusions is headquartered in San Francisco, California and works with enterprise vendors and partners such as IBM, Jive, DropBox, Box and Atlassian.

9 comments on “How to reverse the order of comments on Confluence pages

  1. Aviram says:

    Hi,

    I just tried this on confluence 3.5.13 but this appears to break the rich text editor when replying a comment.
    also, posted here:
    https://answers.atlassian.com/questions/28999/is-it-possible-to-reverse-the-order-in-which-comments-appear?page=1#43385

  2. kevin says:

    hi David,
    I tried this on confluence 4.17 ,while reply a comment,it don’t work,it cann’t type a word in the text editor~~is there a solution for this ?

    1. David says:

      Hmm. The best thing to do then is to prevent the reversal when editing comments. This seems to do the trick on Confluence 4.1:

      <script>
        AJS.toInit(function(){
          if (AJS.$('meta[name=ajs-form-name]').attr("content") != "editcommentform"){
            $comments = AJS.$('#page-comments');
            $comments.children().each(function(i,li){$comments.prepend(li)});
          }
        });
      </script>
      
  3. sander says:

    Hi David! Their is not solution yet for Confluence ondemand that you know?
    Thanks,

    Sander

    1. David says:

      No, sorry — there’s no solution for OnDemand I’m afraid.

  4. Scott Brown says:

    How can you put the comment box on top of the actual comments? With the reversal, it seems more natural to have them up top.

    1. David says:

      @Scott: Try adding this before e.preventDefault();

      AJS.$('#comments-section').prepend(AJS.$('#comments-actions'))
      
      1. Chris says:

        Hi David,
        I’d like to do the same as Scott, move the comments box to the top. The descending order snippet works great, but I’m afraid I’m having trouble with the comment-box-at-the-top snippet. Here’s what I put in:

        function reverseCommentOrder(){
        $comments = AJS.$(‘#page-comments’);
        $comments.children().each(function(i,li){$comments.prepend(li)});
        }

        AJS.toInit(function(){
        // reverse the comment order
        reverseCommentOrder();

        // add a link to reverse the order
        AJS.$(‘#comments-section-title’).append(‘(Reverse Order)‘);
        AJS.$(‘#page-comments-reverse’).css({ ‘color’:'#999′,’font-size’:’0.65em’})
        .click(function(e){
        reverseCommentOrder();
        AJS.$(‘#comments-section’).prepend(AJS.$(‘#comments-actions’))
        e.preventDefault();
        });
        });

        Descending order still works, but the comment box remains stubbornly at the bottom.

        1. David says:

          OK, I’ve just tried it on Confluence 4.3. This moves the edit box to the top of the comments:

          AJS.$('#comments-section .section-header ').after(AJS.$('.bottom-comment-panels.comment-panels'))

          Have a look in Firebug or similar and if this fails for your version.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

WP-SpamFree by Pole Position Marketing