WordPress.org

Ready to get started?Download WordPress

Forums

MailChimp List Subscribe Form
How do I change color of the subscribe-field? (6 posts)

  1. andreashansen
    Member
    Posted 1 year ago #

    Hi! Love mailchimp and love your mailchimp script. However - there's three issues I just can't seem to resolve:

    1) MOST IMPORTANT: Even though I have custom styling turned on, I just can't change the submit-button to anything but white, which is quite a problem when the background of my webpage is white (http://propr.dk/proprblog/). So no visitor can actually see what button to press...

    2) Would love to get rid of "Preferred Format". How can this be turned off in your script? And if that's impossible, how can I translate the text to Danish ("Preferred Format" to "Foretrukket format", "Text" to "tekst" and "Mobile" to "mobil")?

    3) As you might have discovered already the mail adress field is very long on http://propr.dk/proprblog/. How can this be shorter? And is there any way to insert a line between "...Ć„rligt med tips og nyheder fra propr" and "Mailadresse"?

    http://wordpress.org/extend/plugins/mailchimp/

  2. mc_nate
    Member
    Posted 1 year ago #

    Hey there Andreas!

    Happy to help get this sorted out.

    For the background-color of the submit button, this is generally best handled by adding some custom styling to your sites Style.css file. I typically like to use Firebug (for Firefox) or Chrome's built-in developer tools to find the classes or IDs I need to edit. For the submit button, you'll want to add something like this to your CSS:

    .mc_signup_submit {
    color: _________;
    background-color: ________;
    }

    This will allow you to set a custom font and background color for the submit button in your site. For example:

    Screenshot -- http://cl.ly/image/293f0f43210C

    If you're wanting to get rid of the "Preferred Format" area, there are a couple of options. You can either use CSS to hide the area, or you can remove it entirely by editing the list in MailChimp. Here's the complete rundown, here:

    http://wordpress.org/support/topic/plugin-mailchimp-list-subscribe-form-remove-preferred-format?replies=14

    Last, but certainly not least, you were concerned with the width of the input area for the email address. This is going to be another issue that's best corrected through CSS. You can set up a style in your site's CSS that says MailChimp fields can only be X px or X% wide, like so:

    .mc_input {
    width: _______;
    }

    For my example, I chose 80%, which gives you something like this:

    Screenshot -- http://cl.ly/image/3I1w3C1l1v39

    Let me know if you have any other questions or concerns!

    Cheers

  3. andreashansen
    Member
    Posted 1 year ago #

    Hi mc_nate

    This was VERY helpful! Thank you a lot. That's what I call service. Will recommend this plugin to the ones I know. And so cool to know there's help to find even if you're (or I'm :)) not a css-wizard :)

    Cheers,

    Andreas

  4. mc_nate
    Member
    Posted 1 year ago #

    Awww shucks. :)

    Happy to help!

  5. dc1421
    Member
    Posted 1 year ago #

    I am trying to get my newsletter button to look like the other buttons on my site. Can you help?

    See the button in the footer here: http://www.castlehillretreats.com/

    Thank you.

  6. mc_tak
    Member
    Posted 1 year ago #

    Hey there,

    While this goes a bit outside of our range of support for the plugin (and moreso into a CSS coding question), I'd be happy to get you pointed in the right direction.

    Ultimately, to style your plugin's submit/subscribe button you'll want to use this CSS code:

    .mc_signup_submit input{
         //add css code here
    }

    This makes it so you're styling the input field (in this case the submit button) inside of the .mc_signup_submit class. In order to know what CSS to put in there, you'll have to take a look at your site's stylesheet to reference how your website is styling those other buttons, then try to adapt that here. To find out how your other buttons are getting styled, I'd recommend using a tool like Firebug or the 'inspect element' tool in Chrome to narrow that down.

    Best of luck!

    -tk

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic