-
Posts
-
On my product page, the images are too big and changed settings via customizer does not work.
Additionally, I want to have all pictures in square mode, so if the picture is portrait format it should be provided with a square white background via css.Any ideas how to manage this?
Login credentials and link via private content.
Many thanks in advance!
OK, got it.
/*Bildergalerie Hauptbild auf 500px begrenzen*/
#motif_main_image {
object-fit: contain;
width:500px;
height:500px;
background-color: #ffffff;
}
/*unnötiges CSS deaktivieren*/
.single-product-main-image {display: none;}But why do I need to deactivate the style single-product-main-image?
And how can I disable the lightbox functionality?Hi,
Thank you for the link to your site, I see that you are using the plugin Motif Product Image Zoom which replaces the standard gallery with a “zoom-gallary” nonetheless, by default the gallery lightbox can be removed by changing the Product gallery to WooCommerce 3.0 product gallery instead of Default enfold product gallery at Enfold Theme Options ▸ Shop Options ▸ Product gallery
Please give this a try.Best regards,
MikeHi Mike,
yes the theme options worked for me.
Second question: I´d want to get the product images in the category view as square too without cropping the images. How can I manage this?
Hi,
Glad that this helped, as I pointed out above the zoom-gallary thumbnail container has replaced the standard woo thumbnail container, so while we could try stabbing at it, I would recommend asking the plugin author for their recommended solution as they probably had to correct this for other customers.
I would point out that your images are not square, so while that may look good when it’s the featured image as the thumbnail it’s not square. Also note that the “thumbnail” is actually the full-size image, just shown smaller, so there is not a “cropped” thumbnail.Best regards,
MikeNext question regarding the category page:
https://v2.gmc-instruments.it/produkt-kategorie/metrologia-industriale/power-quality/How do I get the images centered in the div container? At the moment the main product image is cropped and it should be minimized in the div container.
Hi,
Since your image is a portrait layout and looks like it is twice as tall as it is wide, I believe you will find your best results will be if you make your original image square and then upload it, your new thumbnails will then show the full product. Woocommerce images work better if they are square since the div is also square.Best regards,
MikeHi,
Unfortunately not with your current thumbnails because they are cropped, the thumbnail image you see is the whole image.
Please see the direct image link to the thumbnail below, you will see what I mean.
I don’t see any other solution but to create square new images.Best regards,
MikeAh got it, thats a wordpress feature.
I think the plugin Smamrt Image resize fits my needs: https://wordpress.org/plugins/smart-image-resize/Now I need only to center the image and give the container a white background.
Hi,
Glad to see that you found a plugin for this, to center the thumbnails try this css:#top #main .thumbnail_container img { margin: auto; }the expected results:
Best regards,
MikeHi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.Best regards,
Mike
- The topic ‘Enfold / Woocommerce: square images and image size’ is closed to new replies.