Alister Cameron // Blogologist

Changing the world. One blog(ger) at a time.

WordPress comment spam: my simple way to stop (most of) it before it happens

stop spam Wordpress comment spam: my simple way to stop (most of) it before it happensI am now averaging over 100 spam emails every day in my Akismet spam trap. So, thank you Akismet.

But being a conscientious kind of guy, I want to make sure a “false positive” hasn’t got quarantined, so I like to go through the spam comments before deleting them, just to be sure.

As your blog grows in popularity, you will probably experience the same problem as I have: that unless you are regimental in checking through the spam comments on a daily basis (and then deleting them), the list gets too large, and it takes too long (and is too painful) to look through them all.

So I needed a better way.

I looked through all the different captcha-style solutions online, but I just didn’t like the idea of adding another plugin to my WordPress install, let alone a plugin that either a) implemented a rather “heavy” solution to a simple problem or b) relied on javascript to do some sort of funky cookie/hash thing.

In the end all I needed was some way to allow a human to show me they were indeed human… something a machine couldn’t do, thus blocking bots out of my comment form. Well, I came up with something last night and I’m waiting to see how it goes.

A Really Simple Spam Bot Blocker

What I did was add a field to my form (as seen below) where the commenter is asked a question, and needs to give the right answer. You could come up with any question/answer combo you choose, as long as they’re both short and simple. In my case the question asks “Are you human?” and the reply I ask for is my firstname.

The trick with my implementation is that I use a background image in that form field, which explains the answer I’m looking for. That way, anything other than a human being can’t see the answer I’m looking for, and humans actually see the answer right there in front of them.

(What I hate about those maths ones is that they make me think too much. Do you know the difference between a product and a sum? I don’t want to introduce fear and doubt for the commenter about whether they’ve actually entered the right answer. I want to make it really simple.)

As the commenter clicks into that field (if javascript is turned on), the background image disappears, so they can see their typing easily. In case they’re brain-dead and then spell my firstname wrongly, I actually only check on the server side that they’ve started my name with “al”… the rest I ignore. Man, how easy can I make it?! icon wink Wordpress comment spam: my simple way to stop (most of) it before it happens

I use a tiny bit of inline javascript to control the on/off display of the background image of that field, which, if you’re wondering, looks like this:

onfocus="if(this.value=='')
  this.style.backgroundImage='none';"
onblur="if(this.value=='')
  this.style.backgroundImage='url(/images/despam.gif)';"

To create the background image, I typed the text into the field, took a screenshot, then messed around with it in ImageReady, reducing the opacity to 33% so it has the light grey colour. (If that’s too intimidating for you, I found this webpage that creates a GIF image from text you enter, with all the configuration options you need. Way cool!)

The only other thing I had to do was implement the additional check for this new field in the WordPress file wp-comments-post.php, which is found in the root folder of your WordPress install.

I found this bit (on line 33 of the WP 2.1.2 version of the file):

if (get_option('comment_registration')
wp_die(__('Sorry, you must be logged in to post a comment.'));

…and added this bit immediately below it:

if ('AL' != strtoupper(substr(trim($_POST['despam']),0,2)))
wp_die(__('Error: please correctly type my firstname.'));

The PHP code here looks at what was typed into that new field of the comment form, cleans it up, capitalizes it all, pulls out the first two letters only, and compares them to “AL”. If there’s no match, a WordPress error screen is presented. (That error screen is ugly and would be better inline on the post page, but I don’t care. Real people should never see it.)

My only gripe is that I have introduced a “hack” to my WordPress installation, meaning that when I upgrade I have to make this edit manually.

(Note: if you copy the above code snippets make sure to check and replace the funny single quotes with “plain” ones or PHP will have a fit. I can’t stop WordPress using these weird ones, sorry!)

So, what do you think? Is Akismet (or similar) enough for you? What WordPress plugins do you use to handle spam? Why?

Updates

In the last 24 hours only about 10 spam comments got through to Akismet! How happy am I?! But…

It turns out Safari and some other obscure Linux browsers don’t allow background images in input fields, meaning that my solution doesn’t work for what my stats package tells me is 4% of my readership… and presumably yours as well. Drats and double drats!

(Thank you to very helpful commenter Scott Jangro for pointing this out.)

So I’ve had to implement what turns out to be a simpler solution still, but which relies on javascript being turned on. No background image this time, just a bit of “obfuscated” text that gets injected into the input field onload, saying the same thing as the image did. You’ll be pleased with this solution if you didn’t like the prospect of having to create an image, changing your CSS to suit, etc.

Now the onfocus and onblur event handlers to be added to the input tag look like this:

onfocus="if(this.value==despamVal){ this.style.color='#000';this.value=''}" onblur="if(this.value==''){ this.style.color='#999';this.value=despamVal}"

…and you need to add one line of javascript anywhere below that on the page:

<script type="text/javascript">var despamVal=unescape( "%49%66%20%73%6F%2C%20%74%79%70%65%20%6D%79%20%6E%61%6D%65 %20%27%41%6C%69%73%74%65%72%27%20%68%65%72%65%2E"); document.getElementById('despam').value=despamVal; document.getElementById('despam').style.color='#999'; </script>

Just be aware that all those percent signs and numbers in the javascript above are an “escaped” string of text, to make it that little bit harder to hack/read. I use this page to do the escaping. But this is optional… you don’t have to escape the text if you don’t want to, and I can’t be sure it will positively effect the rate of spam getting past this counter-measure.

I’m sorry for having to update with this change of approach, but I don’t want to alienate/annoy Safari users (it being the preferred browser of most Mac users).

coding, productivity, wordpress, spam emails, spam trap, captcha, background image, hash, akismet, spam comments, comment spam plugin, wordpress plugin, wordpress hack

13 Comments

Note: Commenter website links are not no-followed, in case
you were wondering... I believe in rewarding commenters!

  1. Posted 7 years, 7 months ago // Permalink

    That’s pretty cool.

    If this post comes through, then it would seem to work too!

    I do like Matt Cutt’s solution (but I still struggle with the complexity of the math problems he uses ;) )

  2. Posted 7 years, 7 months ago // Permalink

    Excellent idea! Akismet is catching about 40 a day for me – so I know what you mean about not wanting that list to get too big. After combing my way through 800 comments about Insurance I want to just go out and shoot myself.

    Todd
    http://www.scrapscene.com

  3. Posted 7 years, 7 months ago // Permalink

    I will likely try something like this. Or exactly this. Thanks for the tutorial. I thought Akismet had caught a lot of spam for me back in November when I had about 800 comments blocked. Now I’m up to 11,000 plus. I usually just click “delete all” because I don’t like to read the crap that gets caught. Who gets fooled by this garbage to make it worthwhile for the spammers?

  4. Posted 7 years, 7 months ago // Permalink

    Good idea.
    This is how I got rid of spam – 100%
    http://alpesh.nakars.com/blog/2007/01/30/how-to-control-spam-on-wordpress-blog/

    Rid, means I don’t have to moderate
    :-)
    Cheers!
    Alpesh Nakar

  5. Posted 7 years, 7 months ago // Permalink

    This is a really cool idea. I’d rather see something like this than a crazy captcha that I can’t read.

    Personally, Akismet has been doing a good job on my blog. I just installed Bad Behavior to help cut down on spam in the first place. It’s only been 2-3 days, and it already claims to have blocked 1200+ access attempts. In that time, only ~250 spams have gotten through to Akismet.

    Take care,
    Andrew

  6. Posted 7 years, 7 months ago // Permalink

    The best I can tell, the comment spam I’m getting now is all now hand-entered from Romania. A lot less of it, though.

    This is a great way to reduce it!

    Dan

  7. Posted 7 years, 7 months ago // Permalink

    Cool alternative to the math test plugin (which I use).

    Your method is fun and fancy, but you are alienating some users. I don’t see any image in your text field. I’m using Safari.

    You should change the question text to, “Are you human? if so, what’s my first name?” So at least I have a prayer of getting it correct if I cannot see the image. Otherwise, my answer to that question is, of course, “Yes”.

    Even better, put an image next to it with your name in it to make it more foolproof instead of in the text field.

  8. Posted 7 years, 7 months ago // Permalink

    It probably would’ve been easier to just install a plugin that would do this, as I’ve seen it on many other WordPress blogs…

  9. Posted 6 years, 11 months ago // Permalink

    Hello

    >> I use this page to do the escaping.
    I create more progressive tool, working at once with several algorithms – http://iframe.in

  10. Posted 6 years, 11 months ago // Permalink

    That way, anything other than a human being can’t see the answer I’m looking for, and humans actually see the answer right there in front of them.

    What about humans who cannot see?

  11. Louis
    Posted 6 years ago // Permalink

    I appreciate the thought you've put into this…since your work is helping a large part of the world. I have a thought: With your original implementation couldn't you just add an additional same image (NOT IN A FORM Field) and with creative CSS position it so absolutely so it would be over the form field that should display it? Would that work? Then Safari would display the image where it doesn't honor the form field image and the browsers that do honor the form field image would simply have another absolutely positioned over it????? This sounds crazy the more I write, but wondering if that would be useful. Best of luck and thanks again for you great thinking!

  12. Posted 4 years, 4 months ago // Permalink

    Hi, I’m having troubles loading your web site. Only close to half on the article appears to load, and the remaining is just blank. I’m not quite certain why…. but you might like to investigate it. I will check back later, it may very well be on my end.

  13. Posted 3 years, 7 months ago // Permalink

    I really have a big problem with spam comments in my website.
    As of the moment I have about 600+ comments to delete. Please help me.

3 Trackbacks/Pingbacks

  1. WordPress comment spam: my simple way to stop (most of) it before it happens

  2. ones or PHP will have a fit. I can’t stop WordPress using these weird ones, sorry!) So, what do you think? Is Akismet (or similar) enough for you? What WordPress plugins do you use to handle spam? Why? Comments Tag: comment spam

  3. […] Cameron Blogologist to the rescue with a nifty method to confound the robot spammers without unduly forcing your blog readers through hoops before they […]

Post a Comment

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

Current ye@r *

    • marketsamurai.com
    • madmimi.com
    • www.medialayer.net
    • splash.oiopublisher.com
    • Advertise Here

  • My Posts in Your In-box!

    Enter your email address here for instant updates in your inbox, whenever I post something new.
    Your email address is in safe hands. Relax!
© Copyright 2007 Alister Cameron. All Rights Reserved Theme // Sitemap // RSS