Customizing Securimage

This page explains how to change the look of Securimage by modifying it’s configuration.

There are two places the look of Securimage can be changed from, either from the __construct() function in securimage.php, or directly in securimage_show.php (recommended). The examples below will show you how to change settings from securimage_show.php

Changing Colors

Setting colors with Securimage is flexible and easy, all colors are set using the Securimage_Color class. Colors can be given as RGB values, or HTML hex values. The examples below show each method.

// Using RGB values from 0 - 255:
// Setting color to blue R=0, G=0, B=255
$color = new Securimage_Color(0, 0, 255);

// The same as above except using hexadecimal values
$color = new Securimage_Color(0, 0, 0xff);

// Using HTML/CSS color codes
// Setting color to a light blue using html color code
$color = new Securimage_Color('#3388FF');

// Same as above except as an rgb triplet
$color = new Securimage_Color('#38F');

The next example shows what properties to use in order to change background, text, and line color.

// in securimage_show.php

// setting the background color to white
$img->image_bg_color = new Securimage_Color('#ffffff');

// setting the text color to a dark grey
$img->text_color = new Securimage_Color('#525252');

// setting the line color to a dark gray to match the text
$img->line_color = new Securimage_Color('#525252');

Using Backgrounds

Securimage makes it easy to use a single static background on all of your captchas, or it can choose a random background from a directory to use in every image. Note that backgrounds look and work best when they are the same size as your image (230×80 by default), but they will be resized to fit the image if they are not the same size.

To use a single background for all or your images, edit the last line of securimage_show.php and pass the full path to an image to the show() function.

// in securimage_show.php - this is the last line

// pass the background image to show() - it must use a full path
$img->show( '/home/user/public/securimage/backgrounds/image.png' );

// on windows
$img->show( 'C:\\inetpub\\wwwroot\\securimage\\backgrounds\\image.png' );

Instead of showing the same image, Securimage provides a backgrounds directory in the Securimage folder where multiple png, jpg, or gif images can be placed and one will be picked out at random each time an image is displayed.

// in securimage_show.php

// set the background directory to use Securimage's backgrounds folder
// using dirname will automagically resolve the path to the proper folder

$img->background_directory = dirname(__FILE__) . '/backgrounds/';

Securimage comes with a few backgrounds, but you can upload as many of your own backgrounds as you would like and they will be used.

Change Difficulty

Two important factors for making it difficult for bots to automatically solve the captchas are the distortion of the code itself, and the drawing of random lines over the image. If characters are distorted enough, bots will not have much success in deciding what the correct value is. Drawing distortion lines throughout the image can greatly confuse bots as they will try to follow the random lines thinking they are part of a letter or number and fail at deciding the right value.

On the other hand, the site owner may not wish to make the image too hard to read for users and will want to turn these settings down or off completely.

The distortion level is controlled by the perturbation property and how many lines to draw on the image (if any) is controlled by the num_lines property.

// in securimage_show.php

// set how distorted the characters will be
$img->perturbation = 0.75; // this is default

// very high distortion, it is not recommended to go over 1
$img->perturbation = 1;

// no distortion, the font will look exactly how it was designed to
$img->perturbation = 0;


// drawing lines over the image
$img->num_lines = 10; // a large number of lines on the image

$img->num_lines = 0; // no lines, just the code

Custom Fonts

You may wish to use a different font than the one that is shipped with Securimage to achieve a unique look for your images. More complex fonts can also be used to make automatic solving of the captcha more difficult. Securimage can load any font as long as it is a TTF font.

To use your own font, upload the TTF font file to the Securimage folder (where the default AHGBold.ttf font is located). To prevent issues when loading the font, make sure it’s name has no spaces or other special characters, and make sure it ends in a .ttf extension. Loading of the font is controlled by the ttf_file property.

// in securimage_show.php

// set the custom font
$img->ttf_file = $img->basepath . '/fontfile.ttf';

If the font is uploaded to the Securimage directory, use the basepath property to specify the path of the file. The basepath is automatically registered and points to the Securimage directory. If you have located the font elsewhere, you must use the absolute path to the font file or it will not load properly.

Adding A Signature

A signature is just a small piece of text that appears at the bottom right corner of every captcha image generated. A signature may be your domain name, a short phrase or any other text you may want to display on the image.

The following example shows how to add a signature and change it’s color.

// in securimage_show.php

// set the signature text to "yourdomain.com" and set the color to black

$img->image_signature = 'yourdomain.com';
$img->signature_color = new Securimage_Color('#000000');

Adjusting Image Size

To change the size of the captcha image, the image_width and image_height properties are used. To prevent the text from going off of the image, the width should be at least 2.7 times the height of the image. The best way to calculate size is to pick a desirable height and multiple by 2.875 or pick a desirable width and multiply by 0.35

// in securimage_show.php

// setting width and calculating optimal height
$img->image_width = 260;
$img->image_height = (int)($img->image_width * 0.35);

// setting height and calculating optimal width
$img->image_height = 50;
$img->image_width = (int)($img->image_height * 2.875);

The multiplication rules used above are just guidelines, you can experiment with different heights and widths to see what works best with the chosen perturbation setting and font used.

Changing the Character Set

The default character set used by Securimage is a subset of the range [a-zA-Z0-9], with some ambiguous characters excluded from the set. This is to reduce user frustration as some characters look very similar to others, especially with certain fonts and higher levels of distortion. The characters excluded are I, J, O, Q, i, j, o, q, 0 (zero) and 1 (one).

The character set can be specified using a string of characters to include using the charset property. Specifying the same character more than once only means it has a higher probability of being selected and may appear more frequently than other characters.

// in securimage_show.php

// Use only capital letters from A-Z for the captcha code
$img->charset = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';

// A numeric only captcha
$img->charset = '0123456789';

// lowercase letters and numbers excluding ambiguous characters
$img->charset = 'abcdefghklmnprstuvwyz23456789';

Randomizing Properties

To make it harder for bots to solve your site’s captcha images, some values can be randomized to help deter them from making assumptions about your image. This example shows how to use php’s rand() function to randomize some image properties.

// in securimage_show.php

// generate a code that is 4-6 characters long
$img->code_length = rand(4, 6);

// change the number of lines drawn on the image
$img->num_lines = rand(3, 10);

27 comments “Customizing Securimage”

Good day, I am having trouble in using two captchas on same page. How do I set the namespace on my form processor? Thank you.

In your form processor, you would put:

$img = new Securimage();
$img->namespace = 'namespace-name';

if ($img->check($_POST['captcha_code'])) { ...

How i can make a image with 2 words? Like in demo page.

Thank you!

In securimage_show.php, add $img->captcha_type = Securimage::SI_CAPTCHA_WORDS; before $img->show();

I’ve set up your captcha on the user comments area of my new site and it works a treat. Is it possible to use the same captcha files for a different form on the same website?

You can use the same files for a different form on the site. If they had a comment form open in one tab and went to a contact form in another, the comment captcha would no longer be current. To prevent this, you can use the captcha “namespace” property (need to document).

Here are the steps:

  1. Make a copy of securimage_show.php and give it a new name. This will be the image you show on the new form.
  2. Do the same for securimage_play.php if you are using audio files.
  3. Open the renamed securimage_show.php and securimage_play.php files in your editor.
  4. On a line before $img->show(); and $img->outputAudioFile();, put $img->namespace = ‘form2′; where ‘form2′ can be any reference that makes sense to you.
  5. In your form processor, the validation is exactly the same, except you need to set the namespace to form2 prior to calling $img->check();

Hope that helps, let me know if you need any more assistance.

Thank you, thank you. Your FAQ’s were great, just like your code. FYI, I have multiple sites contained in a folder on our server. Had to change “include_once $_SERVER…” root location to include the main folder name. After than, off and running. Will gladly make a donation tomorrow. Time to go home!
$herman

Thanks for an easy to use and powerful script; your instructions are super clear as well.  Keep up the great work!

Hi, the script is great and working nicely!
I would like to ask if it is possible fot the charset to be Greek characters, beacuse atm it shows up as gibberish.
Thanks!

Hi, Not at the moment but I will add that to the list for an upcoming version. Thanks for the comment.

WOW! Even for me as an amateur it worked within an hour!

First off I would like to say your form is brilliant. I am totally rubbish at php and couldn’t get your form to work because I don’t really understand the instructions, but with a few alterations to the example form and a I frame in my html page it works brill, I even managed to get it to work with my auto responder to send a reply to the email address they filled in, so I love it, if a total novice like me can get it to work anybody should be able to, I don’t think this was quite how you intended it to be used but it works fine so thanks.

The captcha doesn’t show up if I set image_width to 400 or greater. Is this a bug? It worked fine in version 2.

I tried to set it to 500 and it showed okay, but would slow down greatly if I set it to 800 x 500. This is because in order to do the distortion, it creates a scaled up version of the image by 3 times the actual size. You may be running out of memory if the memory limit is set fairly low. Try uncommenting the error reporting lines in securimage_show.php and see if you get a specific error with the large image.

I get a LONG list of errors like this:

Notice: imagecolorat() [function.imagecolorat]: 0,735 is out of bounds in C:\Program Files (x86)\EasyPHP-5.3.8.1\www\securimage\securimage.php on line 781

Notice: imagecolorat() [function.imagecolorat]: 5,735 is out of bounds in C:\Program Files (x86)\EasyPHP-5.3.8.1\www\securimage\securimage.php on line 781

Notice: imagecolorat() [function.imagecolorat]: 10,735 is out of bounds in C:\Program Files (x86)\EasyPHP-5.3.8.1\www\securimage\securimage.php on line 781
etc…

Yep, that did it. Thank you so so much.
An extreemly fast response when you aren’t being paid for it. A great guy.

Hi I love your script its going to be great on my first website.
As it is my first website I am still learning. Can I ask, I want to build a custom words.txt file of 5 letter words.I can do this and save it and also save the appropriate code length but it breaks when I save the word file. I am doing it in Windows notepad so wondered if there is something being added to the file that php doesn’t like.
All the best
Gary

Try saving it using Windows Wordpad instead of notepad. Notepad uses windows line ending which may not be recognized properly on linux systems. See if that fixes it for you.

Hi.. It works on my local server, but not when port to hosting server.
the image not show

Does the host have the required components such as GD and FreeType? Edit securimage_show.php and add error_reporting(E_ALL); ini_set('display_errors', 1); just after the <?php tag and then load securimage_show.php in your browser and see if any errors are displayed.

Guys,

this script is great. I am a noob and manage to make it run and configure in 15 minutes.

the doc is super clear, i mean why people do not write everywhere doc like this?

thanks!

Thanks so much for the tutorial. One thing I’m confused about at the beginning. What exactly does the $color variable affect?

I see that in order to change the text color you use $img->text_color = new Securimage_Color(‘#525252′); which makes sense. So it seems like the first example you give for $color doesn’t do anything. I’m sure it does do something, it’s just not clear to me which aspects the code effects of the captcha that is generated.

In the first example, it doesn’t really do anything. It just demonstrates how to create a Securimage_Color object and store it in a variable.

I would say most of the time you will assign the Securimage_Color directly to a property such as text_color or line_color.

The example would make sense if you wanted to re-use a color, for example you could do:
$color = new Securimage_Color(‘#000000′);
$captcha_image->text_color = $color;
$captcha_image->line_color = $color;

Under “Custom Fonts”, the “ttf_font” property is actually called “ttf_file”, at least in the version I just downloaded from the site.

I have fixed the error, thanks so much for pointing it out.

Thank you — with one re-read of the instructions and a small tweak it worked like a charm.


Leave a Reply



Reload Image