Are you looking for an easy way to integrate ConvertKit à Elementor ?

Do you use ConvertKit and do you want create a website with Elementor? If so, you're in luck because Elementor supports integration with ConvertKit. This integration allows you to collect subscriber emails via a online form Elementor. 

No need to install any additional plugin. You just need a ConvertKit API key to connect your ConvertKit account to Elementor.

In order to be able to integrate Elementor with ConvertKit, you need to use Elementor Pro because the integration of Elementor with third-party services is only available in the pro version (read: Elementor Free vs. Elementor Pro).

Follow the steps below to integrate Elementor with ConvertKit.

Step 1: Obtain a ConvertKit API Key

To get a ConvertKit API key, visit ConvertKit website and log into your account. Once logged in, click on your username in the top right corner and select Settings.

How to Integrate ConvertKit with Elementor

In the vertical menu, click on Advanced. In the API section, copy the API key.

Step 2: Integrate Elementor with ConvertKit

Once the API key has been copied, log in to WordPress and navigate to Elementor -> Settings to open the Elementor settings page. Click on integrations, scroll down and paste the API key you just copied into the section ConvertKit.

Click on the button Validate API Key to verify API key validation. Once the validation is successful, click on the button Save Changes below.

How to Integrate ConvertKit with Elementor

Step 3: create a form

Once Elementor and ConvertKit are successfully integrated, you can create a new online form to collect email subscribers to your ConverKit account. To do this, create a new page, post or template and edit it with Elementor. Or, you can also modify an existing one.

Create a new online form by dragging the Form widget into the editing area.

Insert a form in Elementor

Define the fields you need on the block Form fields. When done, open the block Actions after submission and select ConvertKit.

How to Integrate ConvertKit with Elementor

The above step would create a new block called ConvertKit. Open this block and select an existing form you have on your ConvertKit account.

On option API key, Select Custom and in the Custom API Key field paste your API Key.

Select your form and also set the field mapping based on the form fields you selected. You can also enter a label on the field Labels.

How to Integrate ConvertKit with Elementor

To customize the appearance of your form, you can go to the tab Style. There you will find four blocks that you can open and each block offers different style options.

Form block

This block allows you to set the gap between columns and rows of your form, shape label typography (font size, font family, font style), text color, and HTML field typography and text color.

Field block

This block allows you to customize the appearance of form fields. Text color, typography, background color, border color and border radius.

button block

This block allows you to customize the appearance of the form button. Background color, text color, typography, border color, border radius, hover color, text color.

How to Integrate ConvertKit with Elementor

Message Block

This block allows you to customize the typography as well as the text color of the success message, error message and inline message.

How to Integrate ConvertKit with Elementor

Click on the button PUBLISH / UPDATE once you are done editing your page.

Get Elementor Pro Now!!!

Conclusion

So! We have just introduced you how to integrate ConvertKit with Elementor. If you have any concerns about how to get there let us know within Comments.

However, you can also consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on the WordPress blog creation or the one on Divi: the best WordPress theme of all time.

But meanwhile, share this article on your different social networks.

...