Forums

WordPress › Support » Plugins and Hacks

[resolved] how to display comment reply-button after every comment in 2 levels threads? (5 posts)

  1. MarcDK
    Member
    Posted 2 years ago #

    Hi!

    If WP is configured to display only two levels of comment threading the reply-button is only visible at the first comment in one thread:

    - comment
    - reply-button
    -- comment
    -- comment
    -- comment
    -- comment
    -- comment

    But this is confusing if you want to answer to the last comment. So, how do I configure wp to display the button after every comment AND limiting wp to only 2 levels of comment-threading? Just like this:

    - comment
    - reply-button
    -- comment
    - reply-button
    -- comment
    - reply-button
    -- comment
    - reply-button
    -- comment
    - reply-button

    Any idea? Is there a hook or parameter I can use?

  2. MarcDK
    Member
    Posted 2 years ago #

    I'll answer this myself. Here is a javascript solution with jQuery. It will append a reply link to the last li element of the children ul. 

    $('.commentlist > li > div .reply').each(function() {
		var reply = this;
		var lastchild = $(this).parent().parent().children('.children').children(":last");
		$(reply).clone().appendTo(lastchild);
	});

  3. hozyali
    Member
    Posted 1 year ago #

    could you please guide me where do I put this script?

  4. travelvice
    Member
    Posted 1 year ago #

    Very interesting!

    Hozyali - If you're still around, don't use this code block below (as it goes about things in the wrong way), but just for example purposes:

    <head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.commentlist > li > div .reply').each(function() {
		var reply = this;
		var lastchild = $(this).parent().parent().children('.children').children(":last");
		$(reply).clone().appendTo(lastchild);
	});
});
</script>
</head>

    Note, as is, this will still jump the form all the way back up to the parent comment when the cloned reply button is clicked (and the comment-reply.js is active).

  5. travelvice
    Member
    Posted 1 year ago #

    So, this is pretty neat.
    Building off of what MarcDK has created...

    If you'd like the reply form to drop in below the last child instead of popping up to the top parent comment, as well as change "Reply" to "Reply to this thread", try this:

    var lastchild = $(this).parent().parent().children('.children').children(":last");
var lastchildattr = $(this).parent().parent().children('.children').children(":last").children().attr("id");
var targetdiv = $(this).parent().parent().children('.children').children(":last").children().children('.reply');
var continuethread = $(this).html().replace(/comment\-(\d+)/g, lastchildattr).replace('>Reply<', '>Reply to this thread<');
$(targetdiv).replaceWith('<div class=\"reply\">' + continuethread  + '</div>');

    It looks totally absurd, but this is how it would be done using the TwentyTen theme, which has a commenting nest like so:

    <ol class="commentlist">
  <li class="depth-1" id="li-comment-1">
    <div id="comment-1">
      (all that comment's data and divs)
    </div>
    <ul class='children'>
      <li class="depth-2" id="li-comment-2">
        <div id="comment-2">
          (all that comment's data and divs)
        </div>
      </li>
    </ul>
  </li>
</ol>

    Because comment_reply_link is a little silly in that it will dump empty divs where the reply link should go, we can take advantage of this and replace it for the last child.

    Remember, this is only for comments with one level of threading (depth 2).

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags