Insights and Inspiration – The Hostnicker Blog
September 18, 2024
1. Create a Mailchimp account by visiting their website. Sign up using your email, username, and password. Once registered, access your Mailchimp dashboard.
2. Set up a new audience in Mailchimp. After logging in, click on the "Audience" tab on the left sidebar. If this is your first time, follow the prompts to create an audience. Ensure your audience is correctly set up with fields like email address and name.
3. Head over to Webflow's website, sign up, and create a new project if you haven't already. Choose a template or start from scratch, getting acquainted with the Webflow Designer.
4. Design a sign-up form in Webflow using the Designer. Drag and drop a Form Block onto your page, then customize the fields to collect information, such as name and email address.
5. Set the form submission settings by clicking on your form in the designer. In the settings panel, locate the "Action" field under the "Form" section and enter your Mailchimp form submission URL.
6. To get this URL, go back to Mailchimp, click on "Audience," choose your audience, and go to "Signup forms," then "Embedded forms." Copy the action URL from the form code provided and paste it into Webflow's action field.
7. Add hidden fields to your Webflow form. Mailchimp requires these for successful data submission. Include fields named "u" and "id" with their values matching those found in the action URL.
8. Customize a success message within the form settings to improve user experience. Inform users their subscription was successful and include a thank-you note or further instructions.
9. Publish your Webflow site by clicking on the "Publish" button in the upper right corner of the designer, selecting your desired domain.
10. Test the integration by visiting your published site, completing the sign-up form, and submitting it. Check your Mailchimp audience to confirm successful data capture.
11. Design your newsletter in Mailchimp by navigating to the "Campaigns" tab, clicking "Create Campaign," and choosing "Email," followed by "Regular." Use Mailchimp's tools to match your newsletter's design to your Webflow site.
12. Send your newsletter by reviewing the content, adding subject lines and preview text, selecting your audience, and choosing to send immediately or schedule for later.
Integrating Webflow with Mailchimp can enhance your newsletter strategy, offering a seamless way to manage and grow your audience.