15. Mailchimp embed forms – on HTML Page

Last updated on October 30th, 2020 at 04:13 pm.

15. Embedded forms in MailChimp - HTML page - Bizanosa MailChimp course

Embedding Mailchimp forms

Hey and Welcome back . In this section we’ll be covering embedded forms . In the previous section we looked at  general forms .

Embedded forms are the forms that you can place on your web page and start collecting emails. The forms can be embedded by taking the embed code from Mailchimp and adding it to our website.

This post plus the video above will walk you through getting the code and pasting it on our web page ( For now a HTML web page). For how to embed a form in WordPress go to this post.

Getting to Embedded forms

  1. On the Mailchimp Menu, click on Lists .
  2. Choose the List for which you would like to create an embedded form. This is the list where your subscribers will be added when they add their details on your form .
  3. Once your list is open , click on Signup Forms .
  4. In the next page, choose Embedded Forms , by clicking on the Select button .

Embed Code options

In the next page that comes up you will see:

  • Form Options ,
  • a Preview for your form and
  • the embed code for the form.

The types of forms you will see are:

  • Classic : This is the default form and takes all the fields that you defined in your Signup forms section. You can also change settings for the fields you need shown to subscribers.
  • Super Slim : This is a smaller form. The super slim form only has an email field and the submit button. You may choose to show the Form Title or not.
  • Horizontal: It has the fields appearing horizontally . The email field and the button right next to each other. You may choose to show the title or not.
  • Naked : This form only contains the HTML . No styling or JavaScript functionality is provided. You may choose this one if you want to style your own form and provide the JavaScript functionality.
  • Advanced : Advanced guide if you want to play with the code and the MailChimp API.

We are interested in the classic form . That’s the one we’ll be looking at and customizing.

Form Options

Under the form options section you may choose to :

  • Include form title .
  • You may also change the title of the Form by typing in your new title in the Form title input box
  • You may choose to show only the required fields or show all fields. The required fields can be edited on the signup form page builder . The link to the signup page is provided under this setting .
  • Show interest group fields for your list
  • Show required field indicators to indicate the mandatory fields.
  • Choose to show Format options (HTML, plain-text, mobile options)
  • You may give your form a fixed width . Giving your form a fixed width will make sure the form is always that width regardless of the screen size. I highly advise against this. Let your form’s width adapt to the width on which it is embedded. And then style it yourself using CSS if necessary.
  • You may also disable Javascript for the embedded form.
  • You may choose to include the archive link to all your recent campaigns
  • You may show the Monkey Rewards Link : The powered by Mailchimp link.

Preview the form . And if you like it the way it is, you may go ahead and copy the embed code. Just click and the code will be selected , then copy.

Take the code and paste it in the location that you want it to be visible.

You can watch the above video to see how I embed the code on a Twitter Bootstrap HTML template.

In the next post / video you will see how to quickly add CSS styles to your form .

Watch Full Mailchimp Video Tutorial

Comment Here

Need WordPress help? Linux Server help? Talk to us.

  • We are your own WordPress customer service.
  • We set up Linux servers and install or migrate WordPress. Learn more here.
  • We support WooCommerce too.
  • Check out our WordPress customer support plans here or contact us below .

If you have any questions regarding WordPress support, Linux server support or any of our services, feel free to reach out or read more on our services page.

Join this free course:

How to host multiple WordPress
websites on a VPS

Close me!