New Landing › How can we help? › Themeforest Theme Support › Neighborhood › Color of the "add to cart" button

Viewing 10 posts - 1 through 10 (of 10 total)
  • Back to forum
    Posted in: Neighborhood
  • September 20, 2014 at 1:26 pm #112909
    librairiesel
    Member
    Post count: 45

    Hi,

    I would like to custom the color of the “add to cart” button (and its hover), but I can’t find a way in the admin to do it, and my custom CSS didn’t work.

    Any idea ?

    September 21, 2014 at 10:39 pm #113093
    laranz – SUPPORT
    Member
    Post count: 3186

    Hi,

    The “add to cart” button background is taken from “Secondary Accent Color” in Color Accent in Theme Customizer. Hover color of the text are accent color. You can change those there, if you want to do that via Custom CSS let me know. If you think your Custom CSS didn’t work, you can try add a !important to force it.

    Let us know,

    Thanks,
    laranz.

    September 23, 2014 at 5:06 pm #113840
    librairiesel
    Member
    Post count: 45

    Hi,

    Thank you, it worked but it affects the whole site and change a lot of things.
    So I prefer to do this with Custom CSS.

    September 23, 2014 at 11:19 pm #113885
    laranz – SUPPORT
    Member
    Post count: 3186

    Hi,

    Sure, use this Custom CSS.

    button.single_add_to_cart_button { background-color: #ff0000; }

    if that didn’t work, try this.

    button.single_add_to_cart_button { background-color: #ff0000 !important; }

    Let us know,

    Thanks,
    laranz.

    September 24, 2014 at 5:47 pm #114178
    librairiesel
    Member
    Post count: 45

    Thanks but it didn’t work as the woocommerce styles are placed directly in the <style> of the head, so it always overrides my CSS.

    September 25, 2014 at 12:53 am #114263
    laranz – SUPPORT
    Member
    Post count: 3186

    Hi,

    If you put this, it will override.

    button.single_add_to_cart_button { background-color: #ff0000 !important; }

    or pass me the WP login details in a private reply, I will take a look at it.

    Let us know,

    Thanks,
    laranz.

    September 25, 2014 at 9:18 am #114361
    librairiesel
    Member
    Post count: 45

    Sorry, I can’t – for privacy reasons – give you the WP login, but here’s what I put in my custom css :
    .woocommerce form.cart button.single_add_to_cart_button {background: #07C1B6!important;color:#FFF!important;}
    And it still doesn’t work. The reason is that the style.css is included at the line 140, whereas the <style> with woocommerce css is at the line 373.
    So I could add as !important as I want, it won’t change anything (because the woocommerce css has also an !important).

    I don’t know if it comes from the woocommerce plugin or the neighborhood theme, but I think it’s stupid to add woocommerce styles in a <style> tag AFTER the custom css file. Is there a way for the developer to fix this in the next update of the theme ?

    Also, is it necessary to include all the theme styles in the <head> ? Because it makes the page much heavier (328 lines added !) and could be included with a simple <link>.

    September 25, 2014 at 10:06 am #114389
    Rui Guerreiro – SUPPORT
    Keymaster
    Post count: 25779

    Hi,

    Please replace the previous code by the one below. In this case we will have to use the same css rule that is providing the background and text color.

    
.woocommerce form.cart button.single_add_to_cart_button, .woocommerce p.cart a.single_add_to_cart_button, ul.products li.product a.quick-view-button {
background: #07C1B6!important;
color:#FFF!important;
}

    The styles you see on the header are the dynamic styles generate with the options that are chosen in the color customizer. That can’t be done with a css file.

    -Rui

    September 25, 2014 at 6:54 pm #114640
    librairiesel
    Member
    Post count: 45

    Hi,

    Your code didn’t work 🙁
    But I added body before .woocommerce and it worked :
    body.woocommerce form.cart button.single_add_to_cart_button {background: #07C1B6!important;color:#FFF!important;}

    Ok for the styles in the header, I didn’t know.

    Resolved !

    September 25, 2014 at 7:28 pm #114645
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,
    I’m glad that issue resolved.
    Thanks 🙂
    With Best Regards
    Mohammad

  • Back to forum
    Posted in: Neighborhood
Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in and have valid license to reply to this topic.

License required for one of the following items
Login and Registration Log in · Register