15 Embed a Mailchimp form on a web page

Last updated on October 30th, 2020 at 03:42 pm.

Watch Full MailChimp Course  here >>

Video Transcript:

Hi guys . Welcome back . In this section we’ll be covering embedded forms . So we are done with the general forms . Let’s go back to the list of the forms. Click on “Signup forms” here.

We are done with this. So let’s take a look at embedded forms. Just click on it. There are different options here as well, so you can have the classic form. ’Includes all Visible fields for this list’ .

Include Field title here…so the form options…You’ll edit the form options and you can preview all the changes you make right here. SO you can choose to show only the required fields. You can edit the required fields in the form builder. So, if you click on this, it will take you to the form builder. I want to change this to subscribe to stay…so once I click out here you will see it will change .

So, you can set a form width here. If you leave it blank, it will take the width of the location it will be embedded.

You can choose to disable JavaScript. That’s what to expect.

We also have the SuperSlim form which only takes the email field and only needs the email field to be the required Field .

So as you can read here, superslim forms include email Address only. Then we have the naked form which has no styling. If you are creating this and you want it to look in a certain way, you would copy the code from here , embed it on your website and style the form yourself . You’ll write all the CSS that you’ll need to make the form look good.

Then we have the advanced options here. So, the advanced option has custom CSS, you can write the Custom CSS yourself. Hidden fields… You can add hidden fields, this one may be to store certain information or for some authentication .

Then the API. This is advanced, for Power Users . If you want to create plugins , if you want to create forms that uses some of MailChimp API to achieve certain functionality on your application. It has the documentation here. You can take a look at the documentation if you are interested in more advanced functionality.

But , for now, we don’t care about all of these. All we want is the classic form. So if you come to the classic form. I will just take it the way it is, I won’t change anything .Then I’ll click to copy the code.

I have this template that I created to demonstrate how you can add it . So I want to add it here .

So it is open here in PHPStorm… SO I want to add it…I want to add it here . SO I’ll just CTRL V to paste the code in. Then I’ll save and take a look at it on the browser. So, as you can see , here is the embedded form. Well if you want to style this, you can, If you have knowledge of CSS you can style this.

In the next video , I want to …I want to show you how you can style this. SO, if you want to embed a form on a Landing page, You want people to signup , you can just do it as simple as such , as simple as this. You just go to MailChimp, here , Come down here, select , Copy .Paste the code in the location you want it . And that will give you this.

So, as you can see , the required fields all have this . At least the user will know…so they’ll know they need to input their email address , they need to put a first Name .

Okay guys, that’s it for this video . Keep watching the videos , and watch the entire MailChimp Course on the MailChimp Course Playlist. Subscribe, Like. Thanks guys .Till next time.

Comment Here