OrganicWeb

Mailchimp Training & Consulting

You are here: Home / WordPress / How to make the Mailchimp WordPress Plugin look better

How to make the Mailchimp WordPress Plugin look better

I love the Mailchimp newsletter service and set up alot of Mailchimp sign-up forms on WordPress Websites. I also help a lot of people to automatically have their Blog Posts/Articles sent as newsletters (all totally automated and saves a tonne of time). Mailchimp is the best newsletter service not only because it’s free for most users, but also because it’s reliable, has so many features and has much help available.

How to add a Mailchimp subscribe form to WordPress

Setting up a Mailchimp sign-up form on a WordPress Website or Blog is as simple as installing and activating the Mailchimp List Subscribe Form WordPress Plugin, changing a few settings and adding the form into a widget area.

Once installed and active in a widget area, the layout of the form doesn’t look great, the field labels are to the left of the input field meaning that alignment of the fields doesn’t look professional.

How to make your WordPress Mailchimp form look better

Luckily this is really easily fixed by inserting the following css into the active Theme style.css file

.mc_var_label {display:block;clear:both;}
#mc-indicates-required {font-size:10px;padding-bottom:10px;}
.mc_interest{padding-bottom:10px;}

Your Mailchimp subscribe form should now look alot better 🙂

Watch Gary in action

Gary frequently adds Mailchimp instructional videos to his YouTube channel. Subscribe to keep updated.

→  Subscribe   ←

How to create a lead-capture form with file download.

How to target your most engaged Mailchimp contacts.

Reader Interactions

Comments

  1. Marina (@daily_pa) says

    Thanks Gary, but what do you mean by ‘insert’ into the CSS/

    I just did that … right at the end of the file just before: /* Always remember to compress your live stylesheet and keep an uncompressed backup */ … and it made no difference at all. Do I need to place your code somewhere specific within the CSS.

    Also, I would love to hear more about how you automate blog posts into Mail Chimp newsletters.

    Thanks so much for your very useful blog.

    Cheers

    Reply

  2. Mark Botter says

    Hey Gary, thanks for the tips!
    I styled my form to my commands but i get the “Preferred Format” tags underneed it. Do you know how to remove those?

    Thanks Gery, you have nice tuts!

    Reply

      • Mark Botter says

        Hey Gary, Thanks! I havent managed all of my prolblems just jet. I’m talking about this part:

        Preferred Format:
        – HTML
        – Text
        – Mobile

        Do you know how to delete those from my mailchimp form?

        Thanks!

        Reply

        • Gary says

          Hi Mark,
          I know that within Mailchimp itself you may choose to enable just HTML or else HTML & Text etc. Perhaps make the change in Mailchimp?

          Reply

  4. Sunil says

    Hi,
    I want to use a query in salesforce which will select only those leads or contacts which are modified today. Can you please tell me How to accomplish this?

    Reply

  5. Elizabeth says

    I am unsure as to how adding this code will affect the appearance of the optin box.
    I added it as you explained. and no change. cleared my cache thinking it might be that but still looks the same.

    Am I missing the point. Not a coder nor a developer … I’m just wingin’ it here.

    thanks for any help

    Reply

    • Gary says

      @Elizabeth, it seems like the IDs have changed in the HTML. Let me know what areas you want changed and the form URL and I’ll try to help.

      Reply

Leave a Reply