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);