Electronic Signature Forms for WordPress

Electronic Signature Forms - Field Options
  • Description
  • FAQ
  • Screenshots
  • DEMO
  • Updates & Support

Collect electronic signatures in your WordPress forms. Your users may draw their electronic signature with a trackpad/mouse or just type it.

Heads up!
This signature add-on is not built with the intention to create legally binding contracts. If you need a signature to be legally binding, we recommend using a plugin or 3rd-party integration that is built for that purpose.

Download and Install

  1. If you haven’t already done so, install and activate Formidable Forms Pro.
  2. In your WordPress admin, go to ‘Formidable’ → ‘Add-Ons’ and click the ‘Install’ button for the WordPress Signature plugin.

Build electronic signature forms

Once the Signature add-on is installed it will appear in the right sidebar under the Pro Fields section.

  1. Go to edit the form where you would like to use the Signature field.
  2. Find the ‘Signature’ field and click or drag and drop it into your form.
  3. Save the form and click ‘Preview’. Now when the form is visited, the Signature field will appear and be ready to use.

Standard field options

A Signature field has the following standard options:
Electronic Signature Forms - Field Options

Field-specific options

Signature Options

Set your text for the Draw It, Type It, and Clear labels.

  • Hide Draw It and Type It tabs: Select this checkbox if you want to hide the icons on the signature field. It will set drawing the signature as default.
  • Set Type It as default: Select this checkbox if you want to set typing in the signature as default.

Signature Options

Field icons

Field action icons allows you to duplicate, delete, and/or move a field on the form builder page. See the field action icons article for more information.

Display Signature fields

Display the submitted electronic signature image in a form’s confirmation message, email, or View. Just insert [x], where x is the ID or key of the signature field.

To show the image URL alone without the img HTML, use [x use_html=0].

Note: When saving a signature, an image file is created using the dimensions from your field settings.

Troubleshooting

Out of memory after form submit

When the form is saved, the electronic signature is saved in an image. Larger signature pad dimensions require more memory. You can either increase the memory limit on your site, or decrease the image resolution.

Call to undefined function

The GD library may be missing on some servers. This library is required for the signatures to work. If your server is missing the library, you will get an error after form submission or when viewing an image. The error message shown will be ‘call to undefined function imagecreatetruecolor()’ if this is the case. To solve the problem, contact your web host and ask if they can install this library on your server.

Additional customizations

These code examples can be added to your theme functions.php file or a new plugin. If you want to insert code into your theme functions.php, add it at the very end of the file, before the last ?> if there is one. If you plan to update your theme, be sure to put it in a new plugin so the code won’t be lost on update.

Increase the multiplier

This example allows you to change the multiplier for signature fields. A higher multiplier will create a clearer signature, but it also takes up more memory. The default multiplier is 5. Use a number below 5 to decrease the image resolution.

add_filter('frm_sig_multiplier', 'change_sig_multiplier', 20, 2);
function change_sig_multiplier($multiplier, $field){
	if ( $field->id == 171 ) {//Change 171 to the ID of your signature field
		$multiplier = 10;
	}
	return $multiplier;
}

To apply this change to all signature fields, change $field->id == 171 to $field->type == ‘signature’.

Change the location of signature image

This example allows you to change the default location for your signature field’s image. The default location is /formidable/signatures/.

add_filter( 'frm_sig_upload_folder', 'frm_custom_sig_upload', 10, 2 );
function frm_custom_sig_upload( $folder ) {
    $folder="";
    return $folder;
}

Set image background color

When the signature image is created, the colors can be customized using the example below.

add_filter( 'frm_sig_output_options', 'sig_output_options' );
function sig_output_options( $options ) {
  $options['bgColour'] = 'transparent';
  return $options;
}
or
Shopping Cart
  • Your cart is empty.
Scroll to Top