How can I add a link to show/hide threaded comments?

Question

I've enabled threaded comments in the comment settings on my Drupal 7 site. Now, on every comment that has threaded comments beneath it, I'd like to add a link (in the same place as the reply/edit/delete links) that enables users to toggle the display of the threaded comments beneath it -- a show/hide replies link.

Answer 1

You can do something like this:

In your theme's template.php file:

/**
 * Override or insert variables into the comment wrapper templates.
 *
 * @param $variables
 *   An array of variables to pass to the theme template.
 * @param $hook
 *   The name of the template being rendered ("comment" in this case.)
 */
function THEMENAME_preprocess_comment_wrapper(&$variables, $hook) {
  // Add jQuery UI accordian to hide the comments in.
  // It is already added in preprocess node but it is safer to also have it here
  // and doens't add much overhead as drupal will only add it once.
  drupal_add_library('system', 'ui.accordion');
  // Add some custom js to collapse comments.
  drupal_add_js(path_to_theme() . '/js/collapsi-comments.js');
}

In collapsi-comments.js (in this case it is in a folder called "js" in your theme.

(function($){
  Drupal.behaviors.collapsiComments = {
    attach: function(context, settings) {
      $('.comment-form-wrapper.accordion').accordion({
        collapsible: true,
        autoHeight: false,
        active: false,
        header: 'h2.title.comment-form'
      });
    }
  };
}(jQuery));

In your comment-wrapper.tpl.php in your theme wrap the comment form in a wrapper div like this (if your theme doesn't have one and you have a base theme that does, copy it from the base theme and modify it, otherwise copy from the comment module and modify it):

<?php if ($comment_form): ?>
  <div class="comment-form-wrapper accordion">
    <h2 class="title comment-form"><?php print t('Add new comment'); ?></h2>
    <?php print $comment_form; ?>
  </div>
<?php endif; ?>