[Résolu] Changing the Woocommerce add to cart button colour within a view
Ce fil est résolu. Voici une description du problème et la solution proposée.
Problem:
The issue here is that the user wanted to change their Woocommerce Add to Cart button color.
Solution:
This can be done by using the CSS below.
.woocommerce form.cart button.button {
background-color: #000;
}
To change the hover color you will need the following
.woocommerce form.cart button.button:hover {
background-color: #fe5252;
}
This support ticket is created Il y a 2 années et 7 mois. There's a good chance that you are reading advice that it now obsolete.
This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.
Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.
No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.
Tell us what you are trying to do?
I have created a set of views for displaying Woocommerce products with a query set to show only products with a custom post type relationship. I’m very happy with how things look but I’ve just had to add a WooCommerce Rental plug in and when products are set to ‘Rental Only’ within WooCommerce, the code for the add to cart button changes. I used the following toolset field for the button: [wpv-woo-buy-or-select add_to_cart_text="Add”]. I used view page source to see the class of the original button (when all products were not rentals) and it is as follows:
<span class='bgpcCart'><a href="?add-to-cart=11025" data-quantity="1" class="button product_type_simple add_to_cart_button ajax_add_to_cart " data-product_id="11025" data-product_sku="" aria-label="Add “Canon EOS-R5 sales” to your cart" rel="nofollow">Add</a></span>
To make the button background a black colour I used the following in my theme’s Custom CSS section:
This doesn’t work with the rental only products though. They still show as the default blue colour.
This is the add to cart button code when products are set to rental only:
<span class='bgpcCart'><a href="hidden link" class="button product_type_simple">Dates</a></span> (I changed the button text from Add to Dates but nothing else).
Therefore I tried adding this to css within the view and alternatively in the theme’s Custom CSS section but nothing changes:
.button.product_type_simple{background-color:black;}
Can you help. Is there something I can write within the view code itself to force the button to change colour or is there anything else you can think of?
The non rental page that shows the button colour correctly is:
hidden link
And the incorrect blue button for rental only products is here (currently set to home page):
hidden link
Many thanks,
Barry.
Is there any documentation that you are following? No
Thank you so much for doing this so quickly. I'm annoyed I had to bother you with it as now I can see the answer I think I could have tried it myself but I wouldn't have known to add the !important; bit.
Many thanks,
Barry.
This ticket is now closed. If you're a WPML client and need related help, please open a new support ticket.
