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.
Continue reading:
- Optimize your WordPress page loading times with a simple tweak
- How to use custom page template in WordPress themes
- Price for SPAM you are prepared to pay
Posted in: WordPress
TAGS:comment toggle, jquery toggle all, jquery toggle comments, one line love comments, toggle code wordpress, toggle comment form, toggle comment wordpress, toggle comments, toggle comments blog, toggle text wordpress code, toggle themes, toggle wordpress code, togglr comments website, usa one liner comment, wordpress toggle, wordpress toggle comments
Hi! My name is Vladimir Prelovac. I am a computer engineer by profession and an adventurer by state of mind.
9 Comments
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
hfghfgh
I use it now all the time to reply to most recent comments without needing to scroll :)
Stupid simple, and really improves usability if combined with the 'Jump to Comment form' anchor.
I see you have changed themes. Which theme is this?
What happens for comments spread over more than a page?
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
Ahh the wonders :)
ok, so i toggled your comment to post mine faster ;)
This is a test comment for code demonstration.