Enable Recaptcha

Installing reCAPTCHA with PHP[/color=red]

captchaHomePage.gif


Description
For those who haven’t seen reCAPTCHA yet, it’s a script you can add to your site in form of a widget (for sites like blogs, forums, guestbooks, etc) and using some PHP on a regular site. What sets it apart from other CAPTCHAs out there is that the words the user identifies successfully, help digitize scanned books!

Their instructions for PHP aren’t very clear, and are obviously written for someone who knows exactly what they are doing. So I thought I’d make them a little more user-friendly (as opposed to coder-friendly).

Sign up
If you haven’t done so already, sign up at reCaptcha.com. Add a new site so that you can get your public and private keys for it. You can’t reuse the same keys for sites on other domains, so you have to add a new domain to your account to get a new set of keys.

Create Form and Process Files
When you create a contact form, you usually have 2 files: the form itself with the fields and the file with the script to send the form. We’ll call them form.php and process.php, respectively. If you have no idea what I’m talking about, learn how to make a contact form and the process file.

IMPORTANT: The tutorial I linked to above asks you to create feedback.html (or form.html) file, but we will need to change the extension to .php. Your form file MUST have the .php extension, not .html (or .htm), otherwise it will NOT work. So make sure both of your files end in .php.

Download the Files Needed
Download the reCaptcha library. You only need one file really (recaptchalib.php). The other ones are examples, readme and legal stuff - they don’t affect the functionality of your recaptcha.

Configuring the Form File
Now, open the form.php and add the following code.

Where and How?

Put this piece of code before the Submit button, where you want the CAPTCHA to appear. It needs to be enclosed in PHP tags because…well, it’s PHP.

What’s a public key and where do I get one?

It asks you to enter the public key. You can look this up by signing in and clicking on the registered site name.


<?php
require_once('recaptchalib.php');
$publickey = "…"; // you got this from the signup page
echo recaptcha_get_html($publickey);
?>

Notice that the require_once function in the example above expects the recaptchalib.php to be in the SAME directory as your form file. If it is in another directory, add that in. This works just like liking to pages on your site. So, for example if your recaptchalib.php is in directory called “captcha” that is on the same level as your form file, the function will look like this:


require_once('captcha/recaptchalib.php');

Configuring the Process File
We need to add the following code to the process.php file (or whatever file you are using to process the form). It has to be at the beginning of the file, before anything else, so keep that in mind (otherwise it’ll give you a warning about headers having been set already).

Notice that this code is asking for the private key, don’t confuse them, otherwise the captcha won’t work. You get that from the same page as the public key.

Code:
<?php
require_once('recaptchalib.php');
$privatekey = "…";
$resp = recaptcha_check_answer ($privatekey,
$_SERVER["REMOTE_ADDR"],
$_POST["recaptcha_challenge_field"],
$_POST["recaptcha_response_field"]);
if (!$resp->is_valid) {
die ("The reCAPTCHA wasn’t entered correctly. Go back and try it again." .
"(reCAPTCHA said: " . $resp->error . ")");
}
?>
This opens a blank page with the words after “die” if you enter the validation code incorrectly. Unfortunately, you can’t validate that with JavaScript, which according to reCAPTCHA support is not secure.

UPDATE: if you want to redirect to a different page instead of showing the default blank page, I explain how to do it over here.

Customization
What you can do though is customize the look. Enter the following JavaScript code in the <head> of your form.php file.

Code:
<script type= "text/javascript">
var RecaptchaOptions = {
theme: 'clean'
};
</script>
That strips all the formatting and just leaves the blue buttons, and looks like this:


Screenshots
recaptcha-clean.gif
 
Back
Top