A contact form is essential for keeping up with your clientele. There are quite a few different plugins out there that allow you to build custom contact forms on your site, but most do have a bit of a learning curve.
WPForms plugin is actually quite simple, and if you need a contact form built quickly, the plugin is highly recommended. In this tutorial I’ll show you how to build a simple custom contact form.
1. Download the plugin from here:
Name the field and drag and drop it to place it in the desired area:
5. To ensure that potential clients aren’t put off by receiving a call at the wrong time, it’s a good idea add a form for best time to call. To do so, click the “Checkboxes” option:
Name the field and add the choices:
Since there are 3 choices, it may be desirable to set the columns to 3. To do so, open the advanced options and select the 3 column option:
6. If the contact form has anymore requirements, use the editor to add as many custom fields as needed. If a needed feature isn’t available, it’s possible that it exists in the options for the premium version of the plugin.
By default, the only security available for the free version of the plugin is reCAPTCHA and a simply honeypot. The honeypot option doesn’t require any additional configuration, but since it’s not the most reliable form of security, configuring reCAPTCHA is probably a good idea.
1. To setup reCAPTCHA, first visit this link and sign up with Google. : https://www.google.com/recaptcha/intro/v3beta.html
Register your site and select the type of recaptcha you’d like to implement:
2. Once the re-captcha is configured, return to the plugin settings. Copy your site key and secret key:
Then, navigate to WpForms> Settings> reCAPTCHA in your admin, and paste the keys:
3. Return to the form, and go to Settings> General to activate the Re-Captcha. Also in settings, you may want to set your notifications and confirmation message.
4. Copy the form shortcode and determine where the form should be placed:
5. Here I’ll place the shortcode within my contact page:
6. Save the changes, and view the page to confirm that the contact form is correct: