Change text and color Add to Cart button on shop page only.

Hiya, as title. I need help to change the default color for my add to cart button on the shop page. The hover of the button is fine. Also if possible this only affects the shop page, and not in the product page.

Also I would like to change the text of the button as well.

Off-topic: There was another thread regarding the same topic, but hidden in private content.

Regards

Attachments:

You must be logged in to view attached files.

Hello,

Please add this CSS to Theme Settings > Custom CSS:

.basel-hover-base .hover-mask {
    background-color: red;
}

If the code does not work please provide your site admin access.

You can rewrite all theme and plugin texts via PO file in WordPress. Here is a video tutorial that should help you translate your website texts with a Loco Translate plugin https://www.youtube.com/watch?v=D3NsDdMzsls&list=PLMw6W4rAaOgKKv0oexGHzpWBg1imvrval&index=3

Best Regards

Tested the code, but it didnt work.

Hello,

First of all please try to change colors in Theme Settings > Styles and colors > Shop buttons color http://prntscr.com/jghzoh

Best Regards

Hi,

Okay, but doing this would also change all other button overall the site.
I would like to only change the Add to Cart button color on the Shop page.

Default button color site wide: Pink 1, Pink 2 for hover.
On Shop page: Black, Pink 2 for hover.

Regards

Hello,

Please add this code:

.post-type-archive-product .basel-hover-quick .quick-shop-btn > a,
.tax-product_cat .basel-hover-quick .quick-shop-btn > a {
    background-color: black;
}

Best Regards

Hey, thanks. That worked!

I do have a question though. I wasnt able to find the part .post-type-archive-product and .tax-product_cat through browser F12.

Could you guide me through ?
I would like to apply the same thing to product on the home page as well.

Hello,

Please add this CSS code to change it also on homepage:

.basel-hover-quick .quick-shop-btn > a {
    background-color: yellow!important;
}

Best Regards

Awesome. Thanks for the help!

You are welcome! If you have any questions feel free to contact us.

Best Regards

[Author]

Posts