Update: Elementor Pro forms now integrate seamlessly to:
In this post, we share a useful new plugin for email marketing integration called MailOptin. Elementor Pro’s Form widget already lets you integrate to MailChimp & MailPoet. MailOptin extends Elementor’s form further, allowing you to integrate to AWeber, ConstantContact, CampaignMonitor, MailerLite, ConvertKit, Drip, EmailOctopus and other services.
You might have heard people say a countless number of times that email list building is dead. But the money is still in the list and that’s why large, medium and even small business still build an email list.
Do you know visitors to your site are likely to opt-in to your email list if you offer them something of value and interest?
And if your site happens to be e-commerce, such visitors may not be ready to buy just yet; they probably need more convincing to make a buying decision. If you do not have an opt-in or lead capture form on your site, how then do you capture them for further communicate? Never underestimate the importance of building an email list for your business.
In this tutorial, I will show you how to customize and embed an email opt-in form to WordPress posts and pages using the Form widget in Elementor PRO and afterward, connect the form to your favorite email service provider (ESP) such as AWeber, Campaign Monitor, Sendy and Mailerlite via the free MailOptin plugin.
Note that Elementor PRO has built-in integration with MailChimp and MailPoet email services. MailOptin is required if your email service provider is none of the mentioned two.
Connecting MailOptin to your Email Service Provider
Before I will show you how to customize and embed opt-in forms to your website using Elementor, you need to install and activate MailOptin plugin. Go ahead and do that now.
Next, go to the Connections settings page where you will connect your email service provider(s) by either clicking the sidebar menu link or top menu tabs. Let’s see how to connect to some ESP in MailOptin.
MailChimp Connection
Like I aforementioned, Elementor form element has MailChimp integration. But if you prefer to capture leads via MailOptin, enter your API key in the MailChimp Connection metabox and save.
Sendy Connection
Sendy is a self-hosted email newsletter application that lets you send emails via Amazon Simple Email Service (SES). It is popular among a lot of small businesses and internet marketer because it’s cheaper compare to cloud providers like MailChimp.
To connect Sendy to MailOptin, go to the Sendy Connection section, enter the URL of your Sendy installation URL, your API key which you can get from http://your-installation-domain-name.com/settings, name and ID of your email lists.
Not sure where to find your List ID and name? Log into your Sendy installation and select the brand your email list is in.
Click on “View all lists” sidebar menu to reveal email lists under your selected brand. There you will find your list IDs and name.
ConstantContact Connection
Go to the ConstantContact connection and click the “Authorize” button.
You will then be redirected to log in and allow MailOptin access to your ConstantContact account.
After which, you will then be redirected back to MailOptin settings page with the button color now green indicating successful connection.
AWeber Connection
Similar to ConstantContact, click the “Authorize” button at AWeber connection where you will be redirected to log in and allow MailOptin access to your AWeber account.
After successful authorization, you will be redirected back to MailOptin settings page.
MailerLite Connection
Similar to MailChimp, connecting MailerLite is easy as pasting your account API key to it form text field and save.
If you use Campaign Monitor and others not I didn’t mention, refer to MailOptin documentation.
Having connected your email service provider to MailOptin, up next is building the email opt-in forms with Elementor Form widget.
Building an Email Opt-In Form Connected to Your Email Service Provider
Edit the post, page or custom post type you wish to include an opt-in form to with Elementor.
Drag and drop the Form widget to the section or area of your site you want the opt-in form to be shown.
Remove the default Message text area field leaving just the name and email fields. We don’t need it because we are not building a contact or feedback form.
Your opt-in form should now look similar to the screenshot below.
In order for all captured leads to be sent to your email service provider, go to the Actions After Submit section and select MailOptin.
Select your MailOptin connected email service and list.
Finally, save the changes.
And remember to use the Style and Advanced tabs to customize the opt-in form to your heart content.
Conclusion
The plugin developers stated that they plan to add more integrations in the future, so if you have other email marketing services you can inquire about their plans to integrate with them.
We are happy to see the MailOptin extend the integration options of our form widget beyond MailChimp, MailPoet and Zapier. The fine folks at MailOptin were also kind enough to give our users a 25% discount coupon off their PRO version. Use the coupon ELEMENTOR on check out.
Looking for fresh content?
By entering your email, you agree to receive Elementor emails, including marketing emails,
and agree to our Terms & Conditions and Privacy Policy.
