button weird

[F]

Hi,

I want to Customize the button on the shop page, but it seems weird.
1) Can I change the button which appears on the product picture from top left to middle of bottom part?
2) How do I make the words like “select options”, “add to cart”, “view product” from vertical to horizontal?

[Spiracle Themes]

Hi F,

Try this CSS

.woocommerce ul.products li.product .product_type_external, .woocommerce ul.products li.product .product_type_grouped, .woocommerce ul.products li.product .product_type_simple, .woocommerce ul.products li.product .product_type_variable, .woocommerce-page ul.products li.product .product_type_external, .woocommerce-page ul.products li.product .product_type_grouped, .woocommerce-page ul.products li.product .product_type_simple, .woocommerce-page ul.products li.product .product_type_variable {
   
    height: 50px;
    width: 150px;
    line-height: 4;
}

.woocommerce ul.products li.product:hover .button.add_to_cart_button {
    left: 10px;
}

body.wcz-btns.wcz-woocommerce ul.products li.product a.button, body.wcz-btns.wcz-woocommerce .related.products ul.products li.product a.button, body.wcz-btns.wcz-woocommerce.single-product div.product form.cart .button, body.wcz-btns.wcz-woocommerce.wcz-wooblocks ul.wc-block-grid__products li.wc-block-grid__product .add_to_cart_button {
    border-radius: 0;
    background-color: white;
    color: #000;
}

Copy and paste it in Appearance -> Customize -> Additional CSS

Let us know if you have any questions

Best Regards

[F]

Tried. It’s still the same.

[Spiracle Themes]

Hi F,

I can’t find the above CSS on the page when checked with the page inspector. Make sure you have pasted the code correctly and cleared all the cache
if you’re using any plugin

Let us know if this works out

Best Regards

[F]

This reply has been marked as private.

[Spiracle Themes]

Yup, mail us at [email protected]
Did you clear the cache. I can see you’re using the cache plugin.

Best Regards

[Author]

Posts