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:

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/f6db657c-1389-4d26-8c92-45fc69453e71/wpcf7_formsetup.png

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.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/61fa401e-6d04-4d22-b929-7fd805a883e4/form_id.png

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:

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/ac017363-d1bc-4fb6-9de1-7f13c1d64f83/html-email.png

This is the HTML name of our first name field:

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/55eca66b-41b6-46ba-bdfd-7911c8df8577/html-firstname.png

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:

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/7abdc90b-4092-488a-b53a-b5762a48871b/3rd_party_plugin.png

Open the plugin

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/a83c8c63-b024-4644-b4ea-e8f2a5b069dc/wp3rdparty_link.png

and create a new service.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/da5cd0f9-c0d0-4d4d-a775-ead2fadc97c0/addanotherservice.png

Fill out your Friendly Automate URL and the proper form id.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/048a93dc-26e7-4c73-8795-45b70d5a5909/link_andform.png