CSS Button & Text Class Name Help

[MonteCristo]

Hi,

I have the subscribe aux turned on and I’ve pasted the following code into the settings:

<div class=”clearfix” id=”header-subscribe”>
<!– Begin MailChimp Signup Form –>
<div id=”mc_embed_signup”>
<form novalidate=”” target=”_blank” class=”validate” name=”mc-embedded-subscribe-form” id=”mc-embedded-subscribe-form” method=”post” action=”http://www….”>
<label for=”mce-EMAIL”>Subscribe to our mailing list</label>
<input type=”email” required=”” placeholder=”email address” id=”mce-EMAIL” class=”email” name=”EMAIL” value=””>
<div class=”clear”><input type=”submit” class=”sf-button accent slightlyrounded” id=”mc-embedded-subscribe” name=”subscribe” value=”Subscribe”></div>
</form>
</div>
<!–End mc_embed_signup–>
</div>

I was hoping someone could please tell me the CSS class names so I can make the font and button within the subscriber drop down the same as the shopping bag.

Thanks

[Swift Ideas – Ed]

Do you have the MailChimp css included? If so, remove it.

Let us have a link so that we can check it for you?

– Ed

[RaHimself]

I would love to know this too!
I have removed the MailChimp css but can’t even get the rounded butten like in first screenshot from OP

this is the code I used
<div id=”mc_embed_signup”>
<form action=”http:// …” method=”post” id=”mc-embedded-subscribe-form” name=”mc-embedded-subscribe-form” class=”validate” target=”_blank” novalidate>
<input type=”email” value=”” name=”EMAIL” class=”email” id=”mce-EMAIL” placeholder=”Enter your email address here” style=”margin-bottom: 0;” required>
<div class=”clear”><input type=”submit” value=”Subscribe” name=”subscribe” id=”mc-embedded-subscribe” class=”button”></div>
</form>

Thanks!

[MonteCristo]

Hi Ed,

Thanks for your reply.

I removed the CSS link from mailchimp, I copied the above from an earlier post you made in this forum.

The address is http://www.royalbermuda.com.au – welcome your thoughts.

Thanks

[Melanie – SUPPORT]

I’ll ask Ed to check back with you!

[Swift Ideas – Ed]

Make sure that your submit button line is the same as the following:

<div class="clear"><input type="submit" class="sf-button accent" id="mc-embedded-subscribe" name="subscribe" value="Subscribe"></div>

Then add the following to the custom css box within theme options:

#header-subscribe .sf-button {
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
padding: 10px 12px;
margin-top: 20px;
}

Hope that helps!

– Ed

[MonteCristo]

Hi Ed,

Thanks, updated the class name in the code and added the additional CSS.

Button now looks same in colour, is there a way to set it the same max available width like in the cart view? Also I was looking for the text class to give it the same look as cart where it says “0 items in cart…”.

Thanks

[MonteCristo]

Sorry to bump

[Melanie – SUPPORT]

I bet you’re sorry, because everytime you bump your own thread you will receive a response later – too bad 😀

You can modify the width with this custom css:

#header-subscribe .sf-button {
width: 200px;
}

Cheers!

[MonteCristo]

Great works, I increased it to 220px to make it fit.

[Melanie – SUPPORT]

Fantastic 🙂 Glad I could help!