Decrease size of Mailchimp Mailing List

Hi I have a mailchimp signup form at the bottom of my one page website. I wanted to make it a little smaller however. Can you tell me a way I can do this please?

Thank you
Jamie

My website is jamieharrisonmusic.com and the form is at the bottom

Hello @jamie2364,

Thanks for asking. :slight_smile:

You can add following CSS to adjust the spacing of Mailchimp form:

#mc_embed_signup .mc-field-group {padding-bottom: 0;}

div#mc_embed_signup br {display: none;}

#mc_embed_signup form {margin-bottom: 0;}

Thanks.

hmmm… that didn’t seem to do anything. I added this in the edit global CSS section, is that correct?

Ok, so I have put some padding either side of the mailing list column and it’s worked to make it narrower. Now, I would just like to reduce the vertical gaps between the text fields and the ‘email’, ‘first name’ and ‘city’. Any thoughts?

Thanks
J

Hi,

I checked but didn’t see the code getting added in Global CSS.

Plesae add it in X > Theme Options > CSS

I deleted it as it didnt do anything

I just put it back in if you want to check.

Hi,

Would you mind providing us with login credentials so we can take a closer look? Please provide following information:

Set it as Secure Note

  • Link to your site
  • WordPress Admin username / password

All the best!

Hi Im sending a secure note

Hello @jamie2364,

I added !important in above shared codes and now it’s working fine. Vertical gaps between text fields have reduced. Please see screenshot.

https://screencast.com/t/7wNUTzox

Thanks.

Thank you so much for your help, that did the trick!

Glad to hear it.

Cheers!

Hey, I tried to add the mailing list to another page:

jamieharrisonmusic.com/bold-as-love-lesson

But the edits we made didnt apply to this page? Can you suggest how to do it so that the changes apply to every mailing list across the website?
Thanks
Jamie

Hi Jamie,

Please add the following CSS in order to make this form to look like your home page form.

#mc_embed_signup form {
    max-width: 900px !important;
    margin: auto !important;
}

Hope it helps

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.