Product Pictures and Cloud Zoom

6 posts from 4 voices

• Started 10 months ago by MikeHonzik
• Latest reply from Dude
• This topic is not a support question

Tags:

• Abundance

1. 

   MikeHonzik
   Member

   Hi,

   Is it possible to remove the grey border from the product images/thumbnails in the shop, category, and product pages?

   I would also like to remove the border from the main cloud zoom (but not the section over the product image, just the zoomed section on the right).

   Thanks

   M

   Posted 10 months ago #
2. 

   Ismael
   Moderator

   Hi,

   Actually, it is not a border, it is the background color of the container. Just add this on your custom.css

   .thumbnail_container {
   background: none;
   }

   Regards,
   Ismael

   Posted 10 months ago #
3. 

   MikeHonzik
   Member

   Great thanks! Is it possible to have the same appearance for the image on product page, and also the cloud zoom function (both without grey border)

   Thanks Again

   M

   Posted 10 months ago #
4. 

   Devin
   Moderator

   Hi M,

   Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:
   

   .template-shop .images a {
   background: none;
   }
   
   .cloud-zoom-big {
   border: none;
   }

   That should do it.

   Regards,

   Devin

   Posted 10 months ago #
5. 

   MikeHonzik
   Member

   Thanks! Appearance is now exactly what I was looking for, but using the above has made both the shop images, and single product images, approx 10px smaller (throwing out all the text alignment). Is it possible to increase the size of them? Would it be through functions.php?

   Thanks

   Posted 10 months ago #
6. 

   Dude
   Dude

   Hey!

   You can change the thumbnail size on the Catalog Settings page (WooCommerce > Settings > Catalog).

   Best regards,
   Peter

   Posted 10 months ago #

RSS feed for this topic

Reply

You must log in to post.