[Resolved] Move product gallery to the left of the main image in vertical style!

[johnaps]

Hello i looked into it and found this in another thread https://generatepress.com/forums/topic/woocommerce-product-gallery-vertical/#post-887137
which only puts them inside main image at the top, but they are still horizontall and iside main image…

And I also found https://businessbloomer.com/woocommerce-display-product-gallery-vertically-single-product/
but his snippet doesnt to anything for me…

Maybe you have any idea why none of them are working 😕

[Leo]

Hi there,

Can you add Tom’s code in so we can take a look?

[johnaps]

Hey Leo!

I added it, you can see it now!

[David]

Tom’s code is correct – just not for what you need.

Try this topic:

https://generatepress.com/forums/topic/woo-single-product-thumbnail-gallery-with-carousel/#post-599314

[johnaps]

David it worked!! But can you checkout https://staging-sofianosorthopedikagr.kinsta.cloud/%CE%BA%CE%B1%CF%84-%CE%BF%CE%AF%CE%BA%CE%BF%CE%BD-%CE%BD%CE%BF%CF%83%CE%B7%CE%BB%CE%B5%CE%AF%CE%B1/%CE%BD%CE%BF%CF%83%CE%BF%CE%BA%CE%BF%CE%BC%CE%B5%CE%B9%CE%B1%CE%BA%CE%AC-%CE%BA%CF%81%CE%B5%CE%B2%CE%AC%CF%84%CE%B9%CE%B1/%CE%BD%CE%BF%CF%83%CE%BF%CE%BA%CE%BF%CE%BC%CE%B5%CE%B9%CE%B1%CE%BA%CE%B7-%CE%BA%CE%BB%CE%B9%CE%BD%CE%B7/%ce%b7%ce%bb%ce%b5%ce%ba%cf%84%cf%81%ce%b9%ce%ba%ce%b1-%ce%ba%cf%81%ce%b5%ce%b2%ce%b1%cf%84%ce%b9%ce%b1-accent-invacare/

There is something wrong right next to the image…
https://imgur.com/a/0wU0RMX

Also is it possible to show the images in the gallery outside of the main image on the left?
Gallery Images | Main Image
Not one over the other i mean…?

[David]

You need to remove this CSS:

.woocommerce div.product div.images .flex-control-thumbs {
    position: absolute;
    z-index: 99;
    width: 100%;
}

[johnaps]

Thank you David!! 🙂

[David]

You’re welcome

[Author]

Posts