I discovered Clickcha yesterday. Seems to be working well so far. Would be nice if there was a developer forum or programmer's reference. This has a lot of potential as a comment spam prevention tool.
The problem I had with Clickcha was that it broke my CSS and caused the page to fail HTML validation. Here's how I fixed it:
1) Go to your wp-content/plugins directory and edit clickcha.php (about line 155) Remove all style directives--that is, everything between (and including) the <style> tags. Paste it in notepad for now--you'll want it later.
2) remove the <noscript> and small> tags (and anything in between) that appear near the javascript code within the clickcha_comment_form function. Below is how my clickcha_comment_form function looks after editing.
Note the /* <![CDATA[ */ ... /* ]]> */ addition. This tells HTML validator to ignore the script.
function clickcha_comment_form($post_id) {
$public_key = get_option('clickcha-public-key');
$help_text = get_option('clickcha-help-text');
if(empty($public_key)) {
echo "<div id='message' class='error fade'><p>Clickcha is not yet active. Please enter Clickcha API keys in settings.</p></div>";
}
// Bypass clickcha for logged-in user (except 'subscriber')
else if(!current_user_can('level_1')){ ?>
<input type="hidden" name="clickcha_token" id="clickchatoken" value=""></input>
<?php echo $help_text; ?>
<input type="image" name="clickcha" id="clickcha" alt="" src=""></input>
<script type="text/javascript">
/* <![CDATA[ */
function clickcha_token(token) {
document.getElementById('clickchatoken').value = token;
document.getElementById('clickcha').src = 'http://api.clickcha.com/challenge?key=<?php echo $public_key; ?>&token=' + token;
}
function clickcha_get_token() {
var e = document.createElement('script');
e.src = 'http://api.clickcha.com/token?output=json&key=<?php echo $public_key; ?>&rnd=' + Math.random();
e.type= 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(e);
}
clickcha_get_token();
// Firefox's bfcache workaround
window.onpageshow = function(e) {if(e.persisted) clickcha_get_token();};
/* ]]> */
</script>
<?php
}
}
3) Edit your stylesheet and put in what you took out of clickcha.php:
here's how it looks in my stylesheet:
#clickcha input {
height: 100px;
width: 200px;
border: 0;
margin: 0;
padding: 0;
display: block;
}
#submit { display: none; }
#commentform input [type="submit"] { display: none; }
#commentform button [type="submit"] { display: none; }
#commentform span.submit { display: none; }
Clickcha is working, my CSS looks like it should, and the page validates as XHTML 1.0 Transitional.
