Spacing fields Change field length Remove HTML, Mobile, Text fields

Hey there,

A few questions here, so I’ll answer them in order.

Changing the length of the input fields can be done by adding some custom CSS. This can be inserted into an area of your WordPress site like your theme’s stylesheet, which is accessible in your WP-admin area. Here’s the bit of code:

.mc_merge_var input {
width: 500px;
}

And change the width as you desire.

To change the spacing between the fields, it sounds like you may be looking to change the vertical spacing between each field. If this is the case, you may consider changing the height of each field’s area by adding a bit of CSS code like this:

.mc_merge_var {
height: 50px;
}

Finally, to remove the “HTML, Text, Mobile” fields from the bottom of your form, you’ll actually want to disable this option inside of your MailChimp list first. Then, sync your changes to the WordPress plugin by going to the MailChimp plugin’s settings and clicking the “update list” button.

To make these changes in your MailChimp account, you’ll need to edit your list’s settings and disable the option to allow your users to set their preferred format. This article shows how to access those options: How can I change my list name and list defaults?: https://eepurl.com/BQWyz

If you have any questions, let us know!

Hi mc_tak this was super helpful.

Do you know the code that I need to change the height and width of the subscribe button as well?

I want it to be the same size as the name and email fields (which I changed using your code above).

thanks!
Sam

Hey there,

You should be able to target that by using the following code:

.mc_signup_submit input {
height: 300px;
}

This targets all input fields inside of your .mc_signup_submit class, which will be your subscribe button.

If the above doesn’t work, feel free to post a link to your site and I’d be happy to take a closer look.

Hi There,
I am also trying to customize the size of the field boxes. I added the css code

.mc_merge_var input {
width: 100px;
}
as referenced above and have no change

https://www.idodesigns.com

Can you help me figure out why the edits aren’t working for me?

Hey Lory,

It looks like your site has some existing CSS that’s setting the width of the input, which is conflicting with the above code. I’ve modified it so that it should work with your existing styles:

#mc_signup .mc_merge_var input{
width: 100px;
}

-tk