[Support request] Amount of woocommerce thumbnails

Home Forums Support Amount of woocommerce thumbnails

  • This topic has 7 replies, 2 voices, and was last updated 2 months ago by David.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1382892
    Alberto

    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.

    #1382905
    David
    Staff
    Customer Support

    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;
    }
    #1382939
    Alberto

    David,

    Unfortunately it doesn’t work …

    #1382942
    David
    Staff
    Customer Support

    Any chance you can remove the coming soon so i can take a look?

    #1383139
    Alberto

    David.

    You can use these access data:

    User: generatepress
    Pass: generatepress

    #1383146
    David
    Staff
    Customer Support
    #1383166
    Alberto

    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.

    #1383176
    David
    Staff
    Customer Support

    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.

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.