In this tutorial you will learn how to easily integrate the popular Contact Form 7 Plugin for Wordpress with Friendly Automate.
Step 1. Set up form in Wordpress and Friendly Automate
To make the tutorial, I created a simple form in Contact Form 7 as follows:
Contact Form 7 works with the field names above. Their names are super important, so let's make a note of them.
Now create the form in Friendly Automate.
As you can see I made a matching form with the same fields. This is my form 4, so the form ID will be 4. By clicking on the edit buttons we can find out the HTML name of the fileds, which is needed for proper mapping.
This is the HTML name of our email field:
This is the HTML name of our first name field:
Step 2: Set up our 3rd Party Form Integration
Let's download the following FREE plugin, that allows the integration between Contact Form 7 and Friendly Automate: Forms: 3rd-Party Integration
Don't forget to activate it:
Open the plugin
and create a new service.
Fill out your Friendly Automate URL and the proper form id.
Once you choose the CF7 Form you'd like to map your Friendly Autome form with, you can continue:
The above settings do the magic.
In the second column you can give any names to your fields. It's just for your convenience.
The third column must be the CF7 form field name.
The forth column is your Friendly Automate Field HTML name. Make sure you use this format: mauticforms[yourfieldname]
Once you are done, you can test it:
By hitting "Send" all the information is transmitted to the proper form in Friendly Automate:
Don’t have time? 👩💻 Contact us and we’ll implement and design for you.