Our MailChimp Widget allows for simple integration of one of the most widely used email marketing services on the web: MailChimp. Use this widget to build your audience by effortlessly expanding your newsletter mailing list.
This widget offers styling control options for every possible element of the MailChimp signup form – from fonts, to padding, to custom text and more.
Compatibility: Muse 2017.0
Current Version: 1.0
Supported Devices: Desktop, Mobile, Tablet
1.0: Initial Release
POSITIONING IN MUSE
Drag the widget from the library and drop into your project in Design mode.
The placement of the widget itself determines the positioning of the of the MailChimp form on your site.
Resize the widget container as you like.
Adjust resizing and pinning options as needed to maintain positioning and appropriate responsive behavior.
MAILCHIMP ACCOUNT SETUP
This process is best explained in the tutorial video above.
If you haven't already, create an account at MailChimp.com.
Create a new list
Click "Signup Forms"
Select "Embeddable Forms"
In the box containing the HTML embed code, look for the "form action=..." line. It might help to use the expander tool in the bottom right corner of the box to increase the size of the box.
Copy the URL.
This URL should be pasted into the widget's MailChimp Form URL field in Muse. However, before leaving the MailChimp site, see note below.
Note: There is an important setting on this page. The "Enable double opt-in" checkbox determines whether the user signing up will need to verify their signup by email. With double opt-in enabled, the user will need to open an email and click a verification link to be added to the list. With this option left unchecked, users will be signed up immediately. The reCAPTCHA option is automatically enabled when double opt-in is enabled, though may be disabled if don't want to use it.
STYLING IN MUSE
Once your MailChimp account is linked to the widget in Muse as described above, it's time to style the MailChimp form.
There are 2 main input field options for the form:
Email input only: Leave the "Enable First Name & Last Name" field unchecked.
Email plus first & last name: Check the "Enable First Name & Last Name".
When the name fields are not used, only the user's email address will be captured and added to your MailChimp list.
Enable Labels: This field enables the text field labels above the input boxes. Note that the same text will appear inside the input fields, so there will still be clarity of purpose for the input boxes before text is entered.
The Label Styling section offers control of the label text, font styling, and color. The label text used here applies to both the labels and the input fields. Note that the styling options in this section apply to the labels only (the text above the input fields). This section will be disabled when the "Enable Labels" option is left unchecked.
Input Styling: This section provides styling control of all aspects of the input boxes.
Button Styling: This section offers full styling of the submit button. Control button text, size, shape, color, alignment and more.
This section determines the text that is seen in the pop-up that appears after the form is submitted, as well as color options for the button and link text color.
Confirmation Head Text and Confirmation Body Text: It's important to use a form message that is appropriate for the verification type used in your MailChimp account. For example, if double opt-in is enabled, a confirmation message like "We've sent you a verification email" may be appropriate. If no doublt opt-in is used, the default text "You've been added to the list!" may be ideal. This message text is completely customizable.
Error Head Text: Like the confirmation text, the error text is also customizable. This message will only ever appear when an email address is not entered correctly.
Use the "Edit link styles" button in the Hyperlinks menu to set the visited link text color seen in the pop-up
TESTING YOUR MAILCHIMP FORM
When the above steps are completed, preview or publish your page.
Complete a signup using a valid email address.
Confirm the MailChimp popup message.
If double opt-in is enabled, check your email to find the validation email.
Complete the validation process.
Visit the Lists area at MailChimp.com.
Select the list you've created.
Ensure that test email signups are seen in your list.
If you don't see the new email address in your list, try refreshing the page.
If you still don't see the email, log out then back into MailChimp.com.
It may take up to 24 hours for new signups to be added to your list at MailChimp.com. In our testing, we've noted this type of delay frequently.
While submitting forms that are previewed using the "Preview In Browser" function of Muse generally works fine, try publishing a temporary version of your site if you're having trouble with form submissions.