How to add a MailChimp signup form to your WordPress website

If you have a mailing list then you probably want to add a signup form to your website.

Adding signup forms for your mailing list around your website can be a great way of getting users on your list. Personally, I like to add my form to the end of every blog post I write to encourage readers to signup and get access to more helpful content. But you might want to add your signup form to your homepage or your sidebar or your footer.

The good news is it is incredibly simple to embed a MailChimp signup form on your WordPress website. You don’t even need to use a plugin!

In this post, I am going to show you how to add a MailChimp signup form to your WordPress website without the need for a plugin.

---

How to get your MailChimp signup form code

To add a MailChimp signup form to your WordPress website, you first need to obtain the code from MailChimp that allows you to embed the form. So head over to MailChimp and log into your account.

Once you have logged in, click on Lists at the top of the website.

Now, MailChimp is currently trialling some updates to their website. So at the top of the screen, you might not see the Lists link. Instead, you might see Audience link, like this:

If you do see the Audience link, click on this instead.

If you click on Lists then you will be taken to a page where you view all of the lists within your Mailchimp account.

Next to each list, you will see a button that says Stats and next to this button is a down arrow. Click on the down arrow next to the list that you want to obtain the signup form code for, and then click on Signup forms.

However, if you clicked on Audience you will be taken to a page that contains a variety of details about your most recently used mailing list. If the list that you see here isn’t the list you want to create a signup form for, click on the Switch Audience link that you will see under the page title and select the list that you do want to create a signup form for.

Once you are viewing the correct list, click on the Manage Audience button and then click on Signup forms.

Whether you clicked on Lists or Audience, you should eventually come to the signup forms options page that looks like this:

If you haven’t already designed your form yet, then you need to do this first. To do this, click on Select next to the Form builder option.

However, I’m going to assume that you have already designed your form and you are ready to embed it on to your website. So, instead, click on Select next to the Embedded forms option.

This will take you to the embedded forms page. Here you will see that you have the ability to further customise the form you are about to embed on your website.

At the top of this page, you will see some tabs; Classic, Condensed, Horizontal and Unstyled. These are all the different styles of forms that you can embed. If you click on the tabs you will be able to preview your form in these different styles.

Once you have chosen the style of form you want to use on your website you can then customise the form options. The options for the form will vary from one form style to another.

For each form style you will see a piece of code. This is the code that powers your form. You will need to copy and paste this on to your website. Don’t worry; I’ll show you where you need to paste this code in a moment.

I recommend keeping this page open in a tab and then opening up your WordPress admin area in a new tab.

How to add your Mailchimp signup form to a post or page (WordPress 5.0)

Now you have your signup form embed code, it’s time to add it to your website.

You may want to add your signup form to a post or a page on your WordPress website. If you are using the “new” editor that comes WordPress 5.0 then you can do this using the Custom HTML block.

To do this, click on the plus icon in the top left-hand corner of the screen, open the Formatting tab and select Custom HTML.

The Custom HTML block looks a little something like this:

This is where you should paste your signup form code, like so:

You can then preview the form in the editor by clicking Preview.

One of the great things about the block editor is that once you create a block you can save it so that you can reuse it again within another post or page. To turn your signup for into a reusable block, click on the three dots next to the Preview button and then click Add to Reusable Blocks.

Then given your reusable block an appropriate name and click Save when you’re done.

To use your block again, click on the plus icon in the top left-hand corner of the screen, then open the Reusable tab and here you will see the reusable block you have created.

How to add your Mailchimp signup form to a post or page (Classic Editor)

If you haven’t yet updated to WordPress 5.0 or you are using the Classic Editor plugin because you’re struggling to let go (that’s me!) then don’t worry! I’ve got your back.

Firstly, select the post or page that you want to add the code to. Once you are on this post or page you need to switch from the visual editor to the text editor. To do this, simply click on the Text tab as highlighted below.

Then all you need to do is paste your embed code into the content area. And that’s it! Don’t forget to preview your post or page to make sure your form looks as you expect it to.

How to add your Mailchimp signup form to a widgetised area

You may or may not know that you can also add Mailchimp signup forms to any widgetised areas (i.e. an area that you can add widgets to) on your WordPress website.

To add your signup form via a widget, hover over Appearance in the left-hand menu of WordPress and click Widgets.

On the widgets page, you need to select the Custom HTML widget (this is one of the default widgets that comes with WordPress) and add it to to a widgetised area.

Then, all you need to do is paste your Mailchimp signup form code into the content area of this widget, then click Save when you’re done.