You are currently viewing Adding a MailChimp PopUp Form to your WordPress Site
MailChimp Test

Adding a MailChimp PopUp Form to your WordPress Site

I have a WordPress client that uses MailChimp for emailing updates to their customers, so they wanted an easy way to prompt web visitors to join their email list. We already had a MailChimp form on their WordPress site, but the client wanted to have a PopUp appear after 5 seconds on their Home page that would invite visitors to opt in. After spending a few minutes doing a Google search I found several methods that simply didn’t work, then finally hit the one that did work, so here’s what you need to make this happen:

  1. WordPress web site
  2. MailChimp account
  3. JetPack Plugin for your WordPress site

Let’s start off with what you need to do in MailChimp, login to your account then click Audience> View Contacts. Select and click your desired List, then click the link for Signup forms. Finally, click the icon: Subscriber pop-up

Subscriber pop-up
Subscriber pop-up

In MailChimp select the Format, I chose Modal which means that the pop-up appears in the middle of the web page. Under Display I selected 5 seconds. I added an Image to the pop-up, then changed my Text.

pop-up design in MailChimp
Pop-up Design in MailChimp

Everything looked OK, so I was ready to create the code for this pop-up form, click the button: View Code

copy mailchimp code
Copy MailChimp Code

Select this code, then Copy it to your clipboard, Control+C on Windows (Command+C on Mac).

We want to Paste this MailChimp code into a widget area in WordPress, so login to your WordPress site and click on: Appearance> Widgets

From the list of Available Widgets find and click on: MailChimp Subscriber Popup (Jetpack)

I added this widget to the Header area of my Theme, so your Theme would probably have different sidebar names, choose your theme-specific sidebar.

Header Sidebar
Header Sidebar

Here are the details of my sidebar after I pasted in my MailChimp code:

paste MailChimp code
Paste MailChimp code

Notice how WordPress will alter your pasted code from MailChimp after you Save the form. I setup a condition to Show the pop-up on the Home page only, remember that in MailChimp is where I defined that the pop-up appears after 5 seconds.

I then browsed the Home page and waited 5 seconds, sure enough there appeared my pop-up MailChimp form:

MailChimp test
MailChimp Test

To complete the test I entered my email address and clicked the Subscribe button.

Back in MailChimp I viewed my List and searched for my newly added email name:

new mailchimp email
New MailChimp email

There you have it, we just added a MailChimp pop-up to our WordPress site using the Jetpack Plugin with some Copy/Paste and logo customization. Now the client can attract even more web visitors to receive email updates which will save them both time and money, a win for everyone.

This Post Has 12 Comments

  1. Mary Ann

    Thank you for sharing this. Will it work for free Mail Chimp accounts or paid only?

    1. Daniel Payne

      Not sure about free MailChimp accounts, this was a paid account.

  2. Greg

    Thanks. I needed this today.

    1. Daniel Payne

      Greg, thanks. You have a very nice looking real estate site at livingchandler.com, well done.

  3. Skyler

    How did you add the condition of what pages you would like the pop up to be on? I can’t seem to figure that one out.

    1. Daniel Payne

      Sklyer, The client wanted the pop-up on every page of the site, so that’s why I added the short code to the Header widget. Many sites have pop-ups, and I’m becoming more annoyed by having to click the Close button so often.

  4. Lena Dee

    Ahhhh I’ve been trying to get my pop up to show and barely stumbled upon this page…it was oh so helpful! Thank You 😀

    1. Daniel Payne

      Lena, glad to help out, and let me know if you ever want to customize something on your WordPress site.

  5. Justina

    I only see “mailchimp sign up form” widget (and it’s not a popup) and I don’t understand why 🙁 I’m using the free version of mailchimp. I created the popup in my mailchimp account and clicked “publish” and I’m not sure what I did wrong. If it wasn’t a part of their free plan, surely they would have notified me somewhere or just not allowed me to access it and design it. I have jetpack and I also tried to log in and out to refresh everything.

    1. Daniel Payne

      Justina, I’m not sure that the free MailChimp account support the pop-up code, sorry, I only have a paid account for this client. It’s hard for me to debug it for you unless I have access to your site credentials.

  6. Tiffany

    Hello,
    Im having the same problem as Justina above, however we do have a paid Mailchimp account. I have activated the Jetpack plugin, and when I search for widgets there is no ¨Mailchimp Subscriber Popup¨ , only ¨Mailchimp sign up form¨. And actually since I activated Jetpack even THAT form won’t show up as it was earlier today. Any idea why this widget won’t how up?

    1. Daniel Payne

      Login to your WordPress site and then click on: Jetpack> Settings> Writing. Scroll down a bit and find the section called Widgets. Make sure that both options are turned On:

      • Make extra widgets available
      • Enable widget visibility controls

Leave a Reply