Archived topic
Amount of woocommerce thumbnails
9 replies · Started by Alberto on July 31, 2020
Hi. I have several photos to show for each woocommerce product and I need the gallery to show me more than 4 thumbnails.
If I configure more than 4 images, I get 4 to be shown in a row and the others in a row below, even though there is space to show a fifth thumbnail in the first row.
How can I show 5 thumbnails instead of 4 for each row in the gallery?
Thank you.
Hi there,
try adding this CSS:
.woocommerce div.product div.images .flex-control-thumbs li {
width: 20%;
}
.woocommerce div.product .woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n+1) {
clear: none;
}
.woocommerce div.product .woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(5n+1) {
clear: left;
}David,
Unfortunately it doesn't work ...
Any chance you can remove the coming soon so i can take a look?
David.
You can use these access data:
User: generatepress
Pass: generatepress
Try the updated CSS here
David.
It worked perfectly, thanks!
One last question: will there be any way to focus the gallery? It is currently aligned to the left ...
Thank you in advance.
Hmmm... you can try this CSS to push the thumbs apart:
.woocommerce div.product div.images .flex-control-thumbs {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}Unfortunately woo fixed the thumbs to 100px in size, so if we increase the image size to fill the space the images become blurry.
This post was very usefull for me also. Incredible support. Thanks!
Glad to hear that you found it of use!
