Home Forums WoodMart support forum Product Gallery Size, Thumbnails Reply To: Product Gallery Size, Thumbnails

#425408

Melonda
Participant

Hello Aizaz,
After a lot of work, I just fixed #2 and #4 as below:

#2. I used bellow codes in “Custom CSS for desktop” to adjust the Thumbnails size and expand the slick slider height to show more Thumbnails.. and Its working for me and showing as many thumbnails as i want deppending of the main image heigh:

* Code A: Change Thumbnails Size:
.woocommerce-product-gallery .thumbnails img{
width: 50px;
height: 50px;
object-fit: contain;
border-width: 1px;
border-style: solid;
border-color: #000;
border-radius: 5px;}

* Code B: expand the slick slider height
.woocommerce-product-gallery .slick-slider .slick-list{
height: 300px !important;}

#4. I adjusted the Thumbnail Images padding in Mobile view using this code in “Custom CSS for tablet, Mobile “section:

.woocommerce-product-gallery .thumbnails.owl-carousel .owl-item{
width: 80px !important;
}
so that disabled the padding that genrated automaticly between Thumbnails in mobile View..

*** Now, I need your help to fix

#5: the auto scrolling in the thumbnails slider, Check this video for more..
https://www.awesomescreenshot.com/video/12934702?key=6cb471d254c051cd6f3de373c26bed0f

I think it causing by my Css, I just tried to disable the transform and transition, but its affect the whole products carousels slider in the them, SO it need some special class or something else to call the function, or by doing something else..

#6: Adjust the navigation arrows location in the top and buttom insted of inline!
check this screenshot: https://prnt.sc/ZAWetbmYx7d9

Finally, I would love to see these changes in your next update, because It took a lot of work with me.

Thanks.