Woocommerce Product Image Shadow

[JackV]

Hi, can you please provide me with the css to remove shadows & borders from the main image on product detail page?

Thanks!

[Ben – SUPPORT]

Can you send me a link to your website an I’d be happy to supply the css

Thanks
Ben

[JackV]

This reply has been marked as private.

[JackV]

Hey, any updates on this?

[JackV]

Got it, thanks.

[Cosmin – SUPPORT]

Hi Jack,

So sorry this got overlooked – apologies for that.

I checked your page and it still has the box shadow on the product image. You can use the following custom CSS in the General theme options, to remove it:

.woocommerce div.product div.images img, .woocommerce-page div.product div.images img, .woocommerce #content div.product div.images img, .woocommerce-page #content div.product div.images img {
  box-shadow: none !important;
}

Regards,

————————————————————————————————————

Cosmin
Support Assistant

[ehandelsfabriken]

Have tried your code but the shadow is still there.

[Cosmin – SUPPORT]

Nope, it’s gone: http://easycaptures.com/fs/uploaded/703/0374118605.jpg

Might want to clear your browser’s cache 🙂

Regards,
————————————————————————————————————

Cosmin – Support

[ehandelsfabriken]

Can you take a look at my website http://www.aljosmide.se. You can clearly see that the dropshadow on all product images are still there. No matter what device used, its still there. Cache is cleared as well. Also, this is what the css field in the admin says. https://dl.dropboxusercontent.com/u/22182623/Sk%C3%A4rmavbild%202013-07-22%20kl.%2018.47.35.png

[arjanv]

I use this in custom css

#product-img-slider{
box-shadow: none !important;
}

#product-img-nav li{
box-shadow: none !important;
}

[Melanie – SUPPORT]

Thanks arjanv!

[juancamilodd]

I want to remove all shadows, but with the following code found here only the thumbnails from the gallery are working.

http://ezenciel.com/w/product/haiyan_justincase/

Thanks

/* Shadow on Product Images */
#product-img-slider{
box-shadow: none !important;
}
#product-img-nav li{
box-shadow: none !important;
}
.bag-product figure {
box-shadow: none;
}
.woocommerce div.product div.images img, .woocommerce-page div.product div.images img, .woocommerce #content div.product div.images img, .woocommerce-page #content div.product div.images img {
box-shadow: none !important;
}

[Melanie – SUPPORT]

Hm I cannot find the proper css, I will ask the developer!

[Swift Ideas – Ed]

Hi there,

You just need to add:

#product-img-slider, .woocommerce ul.products li.product figure {
box-shadow: none;
}

Hope that helps.

– Ed

[juancamilodd]

Hi!

All gone except the catalog/shop/related products one

http://ezenciel.com/w/product/haiyan_ourcase/

Thanks!

I’m using:

/* Shadow on Product Images */
#product-img-slider{
box-shadow: none !important;
}
#product-img-nav li{
box-shadow: none !important;
}
.bag-product figure {
box-shadow: none;
}
.woocommerce div.product div.images img, .woocommerce-page div.product div.images img, .woocommerce #content div.product div.images img, .woocommerce-page #content div.product div.images img {
box-shadow: none !important;
}
#product-img-slider, .woocommerce ul.products li.product figure {
box-shadow: none;
}