[root]

Hello,

I want to add a light grey border to the product card, so the whole product card will have border even after hover effect.

Please help with that.

Thank you,

[root]

Hi again 🙂

use the below code and change the color code with your desire color :

.woocommerce div.products div.product.with-border .add_to_cart_btn_wrap {
border: 1px solid #b7b7b7;
}

Add this code :
Wordpress Dashboard -> theme setting -> additional Scripts -> Custom CSS

best Regards

[root]

Hello,

Thank you for your swift response.

I applied the code however, there were no changes on the product card.

Please try from your side, you already have the log in information.

Thank you 🙂

[root]

Hi again,
I just check your website now and seems this code works fine :
https://imgur.com/undefined
https://dukkanalhara.com/shop/

Regards

[root]

Hello 🙂

I am trying to open your screenshot link but it shows 404 error.

could you please share with me anther screenshot.

Thank you,

[root]

Sorry,

I saw now it is ok, but what I want is a border for the whole product card (photo, title, price, buttons) not around the product photo.

Thank you,

[root]

Hello,

I did not get any reply about my request! I was asking to have a boarder around the whole product card and the code you provided did not work.

I used this code and it worked but only on PC and tablet view, it did not work on mobile view.

.woocommerce div.products.buttonsappearunder div.product, .woocommerce.wc-shortcode.carousel:not(.no-gutter) div.products.buttonsappearunder div.product {
margin: -0.5px!important;
border: 1px solid #999999;
}

Kindly help me in how to apply the same boarder on the mobile view.

Thanks,

[root]

I did not get any reply about my request! I was asking to have a boarder around the whole product card and the code you provided did not work.

I used this code and it worked but only on PC and tablet view, it did not work on mobile view.

.woocommerce div.products.buttonsappearunder div.product, .woocommerce.wc-shortcode.carousel:not(.no-gutter) div.products.buttonsappearunder div.product {
margin: -0.5px!important;
border: 1px solid #999999;
}

Kindly help me in how to apply the same boarder on the mobile view.

Thanks,

[root]

morning ahmad

use this code :

.woocommerce div.products.buttonsappearunder div.product, .woocommerce.wc-shortcode.carousel:not(.no-gutter) div.products.buttonsappearunder div.product {
    margin: -0.5px!important;
    border: 1px solid #999999 !important;
}

I edit this code on your website and seems in Desktop and mobile border now shown border

[root]

Thank you so much!

[root]

Your Welcome 🙂

[Author]

Posts