Do you want to create a Digital signature form in WordPress? In this article we will tell you how you can create a signature form in WordPress without doing any kind of coding.
Do you want your customers to sign your form electronically so that they don’t have to take printouts or fax these documents? You can get these done by using the Signature Add-on by WPForms
If you had to get contracts or agreements signed you had to get them printed on a piece of paper and then send it over to the concerned party to take their signatures. This process involves a lot of efforts, time and money and that is where digital signatures, online signature or electronically signed forms come into picture as they are cost-effective and hassle-free and make your lives a lot easier.
If you are looking for an online contract plugin for WordPress then WPForms should be your go to resource.
In this article we will tell you how you can create contracts, service agreements with digital signature on them.
There are several instances wherein you have to accept forms that need to be electronically signed. We have mentioned some of the use cases below
- Non-disclosure agreements
- Contracts & Service agreements
- Terms & Conditions
For the uninitiated, WPForms is one of the best form builder plugins for WordPress which has several amazing features which you can use to create contact forms, accept payments, create multi-page forms and much more. One of the features we are going to utilize is the Signature Add-on to create Digital signature forms in WordPress
Let’s have a look at some of the features that we are going to utilize to create these signature forms
1. Signature Add-on
The Signature add-on by WPForms lets you add online signature to your WordPress website and makes it easy for users to electronically sign forms, contracts and agreements just by drawing with their mouse or touch screen.
When the users signs the forms electronically then their signature gets stored in the form of a PNG image at the backend. Even if the user makes a mistake while signing the forms they don’t have to worry, then click on the cross sign and sign again.
Moreover, the signature add-on gives several flexibility features mentioned below which you can leverage to get the best signature forms.
- – You can adjust the size of the signature box (enlarge or reduce it depending on your needs)
- – You can set the filed “Required” i.e mandatory
2. Drag and Drop Functionality
WPForms is one of the most popular drag-and-drop form builder for WordPress sites. You can make use of their drag-and-drop builder to create amazing signature forms that you can add to your website with minimum efforts. Also, you don’t need to write any kind of codes. WPForms is easy to use so even a beginner can build amazing and powerful forms.
3. Signature Form Templates
To make your life easier WPForms provides several signature form templates and you can choose one from those templates.
4. Mobile-friendly and responsive Forms
All the forms built in WPForms are mobile-friendly and responsive which work seamlessly across all the devices e.g mobile, tablets, & desktop
Let’s have a look at some of the pre-requisites in order to setup a signature form in WordPress
Before we go ahead and create a signature forms do keep in mind about the legalities of your agreement, contracts and consult with a lawyer if needed, so as to ensure that everything is in place and risk-free. The lawyer can give you the assurance if your legal contract or service agreement is right or not.
Considering that you have the WPForms Pro plan let’s continue with the next steps
Now that we have ensure that all the pre-requisites in place let’s go ahead and create our first signature form using WPForms by following the step by step process
- Step 1: Install and Activate WPForms Plugin
- Step 2: Install the Signature Add-on by WPForms
- Step 3: Create Contract Agreement along with Digital Signature Field
- Step 4: Configure the Form’s Settings
- 4. Connecting to Email Marketing Service (Optional)
- 5. Save and Publish your Form
Step 1: Install and Activate WPForms Plugin
Follow the below given process in order to install the WPForms plugin
Navigate to your WordPress dashboard
Go to the Plugins section –> Add New
Once you click on Add New you will come across a screen. In the search box type “WPForms” and then you will come across a screen similar to this one.
Now click on “Install Now” and then Activate the Plugin
Important Note: The Signature is available only to users who have bought the WPForms Pro plan or higher.
So in case you don’t have WPForms Pro plan you should get the Pro plan before you proceed further
Once you are done with the activation you will be asked for the License Key
Where to find the WPForms License Key
Navigate to your WordPress Dashboard and then go to the WPForms section –> Settings
Once you click on Settings you will get a window on the right hand side. Keep on scrolling down until you find the License Key section. You will come across a screen that’s similar to the one shown below
In case you have purchased the WPForms Pro plan then you can find the license key in the account which you used to purchase WPForms subscription
Once you have entered the license key then we will go to the next step i.e Installing the Signature Add-on
Step 2: Install the Signature Add-on by WPForms
In order to install the Signature add-on follow the below given process
Navigate to your WordPress dashboard –> Mouseover on WPForms –> Click on Addons (Refer to the below screenshot)
When you click on “Addons” you will see all the addons. Scroll downwards on the Addons page and you will come across the Signature Add-on. Click on Install Add-on.
Once you have installed the Signature Add-on you are all set and ready to create your first contract agreement with digital signature.
Step 3: Create Contract Agreement along with Digital Signature Field
As stated earlier, users can electronically sign your documents related to contracts, agreements or wherever you have planned to make use of a Digital signature.
There are certain things that you need to keep in mind and try including these pointers in the service agreements or contracts
- Specify the Terms & Conditions clearly
- Specify the Payment specific details, if any
- Include a field to request the client’s physical address & Phone No. (depending on your needs)
- A field for the client to sign electronically
If this is the first time you are creating a contract or service agreement you may want to check out some examples that are out there on Google so as to get an idea.
For the sake of this tutorial we will create a service agreement and then add an option so that users can add digital signature
Go to WPForms –> Add New in order to create your new form.
Once you click on “Add New” a new form builder interface screen will appear. In the next steps you will give a Title to your form as well as select a template
For the sake of this tutorial we will start with a blank form, you can choose a suitable title (Form Name)
Once you mouseover on the “Blank Form” box you will see a screen similar to the one shown below
Once you click on the Create a Blank Form button you will come across the Form builder interface wherein you will see Standard fields.
You can add whatever elements you want to add as per your requirement e.g Name, Email, Numbers, Dropdown etc.
Now we will create a signature field for this Service agreement form
On the left hand side you will come across a section called “Fancy Fields” and in that you will find the Signature field.
Now you can keep on customizing the form as per your needs. Add the elements that you need and make sure that you keep the “Required” check box checked (it means it is mandatory for the user to include the signature and they cannot proceed further without doing the digital signature.
Now we are done with the creation of Service Agreement which also includes Signature field which is mandatory. Now we will go ahead and work on the configuration of Form’s settings.
Step 4: Configure the Form’s Settings
Now that we are done with the setup of the form its time to configure the form settings.
When you click on the WPForms –> Settings option then you will come across the settings option
Let’s have a look at the settings section one by one
1. Form Notifications : Whenever someone fills out and submits the form present on your website you get a notification in the form of Email so that you will get an idea that the user filled out your form. In addition to this you can also send out an Email to the user that they have filled out the form.
2. Form Confirmations:
Form confirmations are messages that are shown to the site visitors when they fill out the online contract form. WPForms has 3 types of confirmations that are sent out. You can choose one of the the 3 types of confirmation messages.
– You can either show them a message on the same page
– You can redirect them to a separate page (e.g Thank you page)
– Show page
3. General Settings
In the general settings section you can make changes like changing the Form name, the text associated with the Submit button, description
You can choose whichever settings you want to change.
4. Connecting to Email Marketing Service (Optional)
This step is applicable only if you are planning to include a Subscribe option on your website (e.g Users signing up to your newsletter)
WPForms supports the following Email service providers
3. Campaign Monitor
5. Constant Contact
Once you are done with all the setup process then it’s time to Save and Publish your form
5. Save and Publish your Form
In order to publish your contract agreement form on your website follow the below given process
Add a New Page to your WordPress website
Navigate to your WordPress dashboard –> Pages –> Add New
Once you click on Add New a new blank page will appear, now give a suitable name to your page something like Contract or Service Agreement
If you are using a Block editor then click on the + sign (Refer to the screenshot shown below)
Now in the search box search for “WPforms” you will immediately see the WPForms element pop-up (Refer to the below screenshot)
Once you click on WPForms as shown in the above screenshot, you will be presented with a Drop down option (as shown below). Choose the appropriate page which you have created from the Drop down section
Once you have chosen the appropriate page then click on Publish in order to make the page live on your website.
So what are you waiting for? Get ready to create a signature form using WPForms Pro plan
We hope you enjoyed this step by step tutorial on how to create a signature form in WordPress site so as to accept online signature