Connect a Newsletter Form via Webflow Logic (Mailerlite & More)

In this tutorial, I'll show you in detail how to create a newsletter form and connect it to your newsletter service using Webflow Logic. In my example, we're sending new logins to MailerLite via the API interface. This approach presents an efficient alternative to previous methods (variant 1), which you can also look at again below.

Create a Mailerlite newsletter account — up to 1000 subscribers free of charge: https://www.mailerlite.com/a/frbntx2y3olu (affiliate link)

Instructions: Connect MailerLite to Webflow and create a newsletter form

initiation

Today I'll show you step-by-step how to connect MailerLite to Webflow and create an effective newsletter form. We use Webflow Logic to seamlessly send the data to MailerLite via an API interface. This approach provides an alternative method compared to a previous tutorial and seems more efficient to me.

Option 1 (more complex): Preparation

Before we start, I recommend that you check out the previous tutorial on this topic. In this video, I've already shown how to connect the two tools together. The process still works, but I prefer the new Webflow Logic method.

Option 2: With Webflow Logic (new)

Step 1: Create the newsletter form in Webflow

Open Webflow and create a new form. Add the required input fields for name and email Make sure the fields have unique names that you'll need for Logic Flow later on. You can also customize the design and add labels.

Step 2: Integrate Webflow Logic

Navigate to Webflow Logic and create a new flow. Name it sensibly, for example “MailerLite Newsletter.” Select “Form Submission” as a trigger. This flow is therefore triggered when the form is submitted.

Step 3: Configuring Logic Flow

In the Logic Flow Editor, we'll add an HTTP request. This request is required to communicate with the MailerLite API. Fill in the required information, such as the URL and header data, in accordance with MailerLite API documentation off.

Step 4: Create the MailerLite API token

Go to your MailerLite account and generate an API token. This token is like a secret key that enables communication between Webflow and MailerLite. Copy and paste the token into Logic Flow.

Step 5: Configuring the API Request for Subscribers

Make sure that the Logic Flow now includes a POST request to create a subscriber. Fill out the required information in the body of the request by filling in the fields according to MailerLite requirements. Be sure to add group information if you want to assign subscribers to specific groups.

Step 6: Test the logic flow

Test Logic Flow using a test email address. Check that the status is 200 and that the data is being sent correctly to MailerLite. Note that MailerLite may send a double opt-in email that needs to be confirmed by the user.

Step 7: Publish and integrate with Webflow

As soon as the test is successful, publish the Logic Flow and integrate it into your live Webflow page. Make sure that all forms are linked correctly and test the final form to ensure that the data is sent smoothly to MailerLite.

conclusion

Linking MailerLite and Webflow via Webflow Logic provides an efficient alternative for integrating newsletter forms. With this tutorial, you should be able to implement the process step by step and create a seamless experience for your users.