There are several reasons for incorporating contact forms into your site: reduce spam emails by having a form instead of freely adding your email to the site; collect user information; generate leads by tracking site visitors and creating ways to analyze target audiences; allow users to leave a message directly from your site which keeps the user engaged; building out an email list; and keeping track of user inquiries.
The simplest solution to the points above is to use Contact Form 7 in conjunction with Flamingo. Contact Form 7 allows developers to create contact forms with ease, manage multiple forms in one place, and easily implement them into new or existing pages. Flamingo then solves the issue of keeping all the information in one spot to be easily analyzed.
Getting Started
This tutorial will require the following two plugins: Contact Form 7 and Flamingo.
Contact Form 7 is the main plugin and Flamingo is a recommended supplement plugin. Since Contact Form 7 sends an email with the submitted message details by default, Flamingo can be used to store these messages locally on the WordPress site.
To get started, download and install Contact Form 7.
Begin by navigating to Plugins on the dashboard and click Add New. From here, there are two options for installation.
Option 1: Search for Contact Form 7. Click Install Now and Activate.
Option 2: Go to the plugin page, download the zip file, and upload into the designated section under Upload Plugin.
Repeat the same steps above to install Flamingo.
**Check if the plugins were successfully installed and activated under Installed Plugins.
Create Form
To create a form, hover over Contact on the side bar and click Add New.
You will be taken to the following screen – Add a title for your form and within the “form” tab, edit the existing form template.
There is a resource https://contactform7.com/tag-syntax/ that explains all the different syntax available for Contact Form 7 forms. However, you do not need to memorize all the syntax because the blue outlined buttons generate the necessary syntax.
We will add a drop-down menu to our form for this example after the “subject” field.
Add drop-down
Click the “drop-down menu” button. The following screen will appear.
Field type: makes the field required when checked
Name: name of the drop-down menu
Options: fill this out with options you want displayed; write one option per line
- There is an option to allow multiple selections/options
- Another option is to insert a blank item as the first option – this will be the default that is shown
At the bottom of the window, you will see the generated syntax.
Click Insert Tag.
The syntax will be inserted without label tags.
If you wish to have a name displayed next to the field, open a label tag, create a name, and then close the label tag after the syntax.
<label> Tech[select* Tech "WordPress" "Drupal"]</label>
Once you are satisfied with your form, click Save at the bottom.
A blue highlighted line will appear at the top with shortcode for your form.
You can copy this to be inserted into a post or page, but it is not necessary as you can add a form using blocks.
Add Form using Blocks
Create or edit an existing Post/Page. You will need to add a Contact Form 7 block within your Post.
Option 1: Begin typing “/Contact Form 7”
Option 2: Click the + and search for Contact Form 7
Once the block is added, a drop-down menu will appear with all existing contact forms on your site. Click on the form you wish to add then click Update at the top of the page.
This is how your form will appear on the front end of the site.
Submitting Email
If you see the following error message, email is likely not set up on the site.
As a workaround, edit the contact form. Click Additional Settings and enter the following code: skip_mail:on
Modify Mail template
To modify the mail setup, go into the Mail tab.
Options will include a To and From; Subject; Additional headers; Message body; File attachments; and Mail (2)
Modify Messages
To modify the messages for specific instances, go into the Messages tab.
There are a total of 22 form messages that can be personalized.
View Message in Flamingo
Once a form is submitted, the information can be seen in the Flamingo Address Book. Navigate to Flamingo on the sidebar to see the messages’ information (email, name, tags, and history).
All messages that were submitted will be displayed in a table format. This table can be exported to a csv file. It is also possible to sort by each column.
Email: who the sender is
Name: type of user (in this example we see admin and commenter)
History: Displays all information/inbound messages – what plugin and contact form was used
*When clicking into the information (Contact Form 7/Guest Post) – You will see further information about the fields submitted.
- The subject and form will include information from the contact form.
- The Channel is what plugin/ contact form was used
*Clicking on the subject will return all Fields information as well as metadata about the user
Summary
There are many reasons to incorporate a contact form into a site and the simplest solution is to use the Contact Form 7 plugin. While it is a popular plugin, many still struggle with setting it up. Contact Form 7 allows the simple creation of forms through buttons that generate syntax, customization of settings for each form, an all in one view to manage contact forms on the site, and simple integration through the use of blocks. The Flamingo plugin then saves and compiles all the information to be analyzed in an address book.
