Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #339236

    Hello!

    I would like to make my newsletter signup box look like this example: Sample of woo subscribe widget

    I uploaded the Subscribe & Connect Plugin and am trying to customize the code to match the above style.

    Here is the widget/plugin code for my version:

    <section class="widget clearfix widget_subscribe_and_connect_items" id="subscribe-and-connect-2"><h3 class="widgettitle">Get free health tips in your inbox!</h3><div class="subscribe-and-connect-connect">Receive practical tips on how to increase energy, feel better, and love who you see in the mirror every day!<form method="post" action="http://us1.list-manage.com/subscribe/post?u=XXXXXXXXXdccb&id=XXXXXXXXX" class="newsletter-form">
    <input type="text" name="EMAIL" placeholder="Your Email Address">
    <input type="submit" value="Subscribe" name="submit" class="submit">
    </form>
    </div><!--/.subscribe-and-connect-connect--><span class="seperator extralight-border"></span></section>

    How can I change the button color (and rollover effect), change the h3 title to be larger font, and add the line as per above example?

    So far I have:

    `.subscribe-and-connect-connect {
    background: none repeat scroll 0 0 #009eca;
    color: white;
    padding: 10px 10px 1px;
    }’

    But I’m not quite there yet! Please see link below (private). Thank you!

    #340997

    Hi!

    Try with this code:

    .newsletter-form input.submit {
        background: red;
        text-transform: uppercase;
        border-radius: 3px;
    }
    
    .newsletter-form input.submit:hover {
        background: blue !important;
        font-weight: normal;
    }

    Adjust as needed.

    Best regards,
    Josue

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.