Note: This has been updated to reflect most of the feedback I received from the comments and emails.
One of the ways to combat comment spam is to use a Catchpa: or a Completely Automated Turing Test to Tell Humans and Computers Apart. I have implemented one with a simple bit of JavaScript.
You need to have two sections of code in your comments.html:
function checkCatchpa() { var catchpaResponse = document.getElementById("catchpa").value; if( catchpaResponse == theAnswer ) { return true; } return false; } function SubmitComment() { if (checkCatchpa() == true) { document.commentform.submit(); } }
This one needs to be inside a <script> block: I have it where I also use a couple of functions to show a comment preview. You will also need to surround the script block with {literal} tags to prevent it from screwing up your template.
The next one creates the puzzle. It should go after the URI box in your comment form:
<p> <input type="text" name="catchpa" id="catchpa" value="" size="28" tabindex="4" /> <label for="catchpa">{_e text="<acronym title='Completely Automated Turing Test to Tell Humans and Computers Apart'>Catchpa</acronym>: "}</label> <script type="text/javascript"> var firstNumber = Math.ceil(Math.random()*10); var secondNumber = Math.ceil(Math.random()*10); document.write("What is "+firstNumber+" plus "+secondNumber+"?"); var theAnswer = firstNumber + secondNumber; </script> </p>
You will also then need to tell the form itself to call the checkCatchpa() function, rather than just submitting:
<form action="{$siteurl}/wp-comments-post.php" method="post" id="commentform" name="commentform" onSubmit="return checkCatchpa()">
Depending on your setup, you may also need to use the SubmitComment() call on your link or button that actually submits the form.
<a class='button' href='javascript:SubmitComment();'> Post Reply </a>
I’ve tested this and it works: I’ll leave it on my site for a couple of days so you can test it out: if you have any problems, leave a response here (if you can!), or AIM/email me.
Thanks Schinckel. This is realy cool.
13 hours, 17 minutes after the fact.
And if the comment is submitted by an automated script? Or by a browser with Javascript turned off?? (Pressing enter in any of the single-line text fields submits the form.)
16 hours, 21 minutes after the fact.
Thanks for that - I didn’t realise it. There is possibly a better method for the submit verification - I do recall a site with field verification, but I hadn’t found it again.
I may need to override the
document.commentform.submit()function, but I don’t know how to do this in JavaScript yet.18 hours, 53 minutes after the fact.
Apparently, if I have the
onSubmit="return checkCatchpa()"inside the<form>definition, I can make sure this is called each time beforeSubmit().And this will require me to change
checkCatchpa()so it returns a true or false, rather than callingdocument.commentform.submit().This also has the side effect of allowing non-JavaScript browsers to use it.
19 hours, 13 minutes after the fact.
I’ll rewrite this post when I get home: I use SubEthaEdit for the code markup, and I don’t have that at this machine.
19 hours, 28 minutes after the fact.
If you want to require javascript to post a valid comment, then you should set the action of the form tag to post in such a way that it moderates or discounts the comment by default. Then, if the “captcha” is valid, change the action to post to the real comment script.
19 hours, 43 minutes after the fact.
I think I did something that disabled the catchpa, I’m still working some bugs through it.
1 day, 12 hours after the fact.
This is very cool indeed. Good work
3 days, 3 hours after the fact.
Wow. You’re amazing. I’m still having some trouble with the instant preview, though. Maybe it’s something on my end…
3 days, 12 hours after the fact.
I’ve reimplemented this, in a better method.
Please visit this post to see how to do this, using my new toolbox script.
Basically, you have the code:
<script type="text/javascript" src="http://schinckel.blogsome.com/images/toolbox.jpg"></script>In your
<head>, and<!--catchpa-->where you want the catchpa to appear. You can also have<!--preview-->where you want the Preview button, and<!--livepreview-->where you want the checkbox.1 week, 6 days after the fact.
Is a “catchpa” anything like a CAPTCHA?
I’ve considered a similar idea, but really, anything that requires JavaScript for submission would probably work just as well for the purpose of avoiding spam, as long as it’s different enough from other sites’ that spammers will have no incentive to develop a workarount. Have your form action point to a script that accepts the comment for moderation, and just have the onSubmit handler change the form action to point to a script that accepts the comment for publication.
2 months, 1 week after the fact.
Yeah, a Catchpa is a CAPTCHA
I guess I’ve never looked that closely at it…
I really like your idea of moderating comments that don’t pass the Catchpa: however, I don’t have the ability to do this on my host.
And, if you are getting lots of Spam Comments, you’ll still need to go through the Moderation Queue at some stage. Too many would make the process somewhat untenable. Not that I get that many comments, let alone Spam ones…
2 months, 2 weeks after the fact.
jklmjcc de
2 years, 4 months after the fact.
Test
2 years, 6 months after the fact.