Contact Form 7 is a popular form plugin for WordPress, allowing website owners to create and manage contact forms easily. If you’re looking to take your form submissions a step further and integrate them with ConvertKit, a powerful email marketing platform, you’re in the right place.
This guide will show you how you can send your Contact Form 7 Data to ConvertKit without using any additional plugins.
- Contact Form 7 installed
- A ConvertKit form
Explanation of the snippet:
wpcf7mailsentevent is used which triggers the code when the form is actually submitted and sent. (Reference: https://contactform7.com/dom-events/)
'12345' == event.detail.contactFormIdallows you to target by specific form in Contact Form 7. Be sure to replace 12345 with your Contact Form 7 ID. You can locate it from the shortcode:
- jQuery.post() is used to send the data to ConvertKit form URL:
https://app.ConvertKit.com/forms/12345/subscriptions– You need to replace 12345 with your ConvertKit form ID. You can locate it on the browser URL while editing the form in ConvertKit portal:
- ConvertKit first name field is mapped with the first input field in Contact Form 7 (
first_name: inputs)  indicates first field,  indicates second and so on.
window.location.hrefis used to redirect users to thank you page URL after successful submission. You can omit the line if you do not wish to redirect users.
How to Implement the Code Snippet?
You can install and activate a plugin like Code Snippets and add this snippet globally on all pages or where your Contact Form lives.
Or you can use it on a single page via HTML block in Gutenberg.
Want us to implement this on your site? Contact us to get started →
Leave a Reply