Widget too Wide

  • Resolved smithgt

    (@smithgt)


    10 years, 7 months ago

    I’ve just installed MailChimp and setup my account.

    I’ve added the widget, but my theme is really spacing out the gaps between fields too much.

    I’ve added

    #mc_signup_form .mc_input {width: 160px; }
    #mc_signup_form .widget_mailchimpsf_widget {width: 120px; }
    #mc_signup_form .mc_form_inside {width: 200px; }

    to the styles.css, but don’t know how to set the width of the box, or adjust the row heights.

    https://www.gbstop.co.uk/

    https://www.ads-software.com/plugins/mailchimp/

Viewing 8 replies - 1 through 8 (of 8 total)

  • Hi Smithgt,

    Thanks for hopping in the forum. Looking at your site, I found this page: https://www.gbstop.co.uk/about-us/subscribe-to-our-newsletter/

    That page is using the MailChimp embed code rather then the WordPress plugin. Styling the embed code would be a little different than styling the plugin. This page from the MailChimp knowledge base can help with styling the embed code: https://kb.mailchimp.com/article/embed-code-css-reference/

    If you’re using the plugin on another page, send us the link and we would happy to take a look.

    Let us know if you have any other questions.

    -mc_d

    Thread Starter smithgt

    (@smithgt)

    Sorry I’d been playing with non-widget options.

    I’ve put the widget back so it appears on every page and also on the footer here

    https://www.gbstop.co.uk/our-objections/

    thanks MC_Dominic

    Thanks for adding the form back. The width of the entire form box can be customized by targeting just the #mc_signup_form id. So for example, if you wanted the box to be 200px wide, add this css to your site:

    #mc_signup_form {
  width: 200px;
}

    Let us know if you have any other questions.

    -mc_dominic

    Thread Starter smithgt

    (@smithgt)

    Thanks, can you advise what I’d need to change to remove/adjust the massive white space between fields?

    I’ve used

    #mc_signup_form .mc_var_label {
    display: inline;
    line-height: 1.5em;
    }

    to adjust the labels, can am not sure how to fix/adjust the fields.

    thanks

    Looking at the code on your site, it seems that the input fields have 30px margin on the bottom. This is adding the bottom spacing on the input fields. The css is around line 235 in your style.css You can adjust this in the style.css or add this bit of css to target just the plugin form:

    ‘
    #mc_signup input[type=”text”] {
    margin-bottom: 0;
    }
    ‘

    Let us know if you have any other questions.

    -mc_dominic

    Thread Starter smithgt

    (@smithgt)

    Thanks – very much appreciated.

    I’m having the same problem and would like to know where to edit the code.

    I am doing it under edit plugins, your plugin (obviously), and I have admin.css or ie.css. I have tried both and there is also an (inactive) text next to the titles..

    Thanks.

    Hey ethoms!

    The CSS to be edited in the manner mc_dominic has mentioned would actually be the active WordPress theme’s style.css file. If you go under WordPress to Appearance > Editor, selecting the current theme and finding the Stylesheet (style.css) file will allow you to modify the code and save changes.

    If we can help with anything else, please let us know!
    -Gabe

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Widget too Wide’ is closed to new replies.