How to toggle comments with one line of code

I accidentally discovered today a great usability feature for WordPress blogs - ability to toggle display of comments with a simple click.

Usually when you have a lots of comments on a post the navigation is hindered as it is difficult to get to the footer of the site. Also when the user wants to give a comment directly in reference to the post, it makes it nearly impossible as they need to scroll up and down all the time.

The solution is following line of code that you can insert in your comment template. I have put mine just below the number of comments.

<a style="cursor:pointer" onclick="jQuery('#comments').toggle();">Toggle comments</a>

This assumes that you have jquery loaded (most sites do) and that your comments div is #comments. You can change to match your needs.

Go ahead try it out below.

See also:


Posted in: WordPress
TAGS:, , , , , , , , , , , , , , ,
leave a comment.

9 Comments

  1. Marshall
    Aug 19th, 2009

    For some reason that bit of code causes all my comments, and comment form to disappear... even the words "Toggle Comments" vanishes. Only way to get the comments/form back is to reload the page.

    Couldn't figure out why it did that

  2. dfg fsdfsdf.com
    Jul 10th, 2009

    hfghfgh

  3. Vladimir prelovac.com
    Apr 14th, 2009

    I use it now all the time to reply to most recent comments without needing to scroll :)

  4. ignacio tedelmecanico.com
    Apr 14th, 2009

    Stupid simple, and really improves usability if combined with the 'Jump to Comment form' anchor.

  5. Hardeep Singh blog.hardeep.name
    Apr 14th, 2009

    I see you have changed themes. Which theme is this?

    What happens for comments spread over more than a page?

  6. Andrea sciamanna.eu
    Apr 13th, 2009

    Ok, just a tip for the tip, is possible to do that also without JQuery. Is just a bit less than a single line.
    A couple of examples:
    http://csscreator.com/node/708
    http://www.rgagnon.com/jsdetails/js-0086.html

    Well, with few changes, you can actually write everything in one line... a very long line :D

  7. Vladimir prelovac.com
    Apr 13th, 2009

    Ahh the wonders :)

  8. kkarpieszuk konradjestwrwandzie.wordpress.com
    Apr 13th, 2009

    ok, so i toggled your comment to post mine faster ;)

  9. Vladimir prelovac.com
    Apr 13th, 2009

    This is a test comment for code demonstration.

Have your say

Your email is never published nor shared. Required fields are marked *

*
*

Subscribe without commenting

About Vladimir

vladimir prelovac Hi! My name is Vladimir Prelovac. I am a computer engineer by profession and an adventurer by state of mind.

"I would love to change the world, I just don't have the source code yet."

Books by Vladimir

WordPress Plugin Devleopment Book WordPress Plugin Development: Beginner's Guide

Published by Packt Publishing, available online through Amazon. Click the image for more information.

Consulting Services

Professional WordPress Services, including custom developed plugins and themes

Expert on-site WordPress SEO consulting and an 'out-of-the-box thinking' approach to problems