How can I add product thumbnail slider to my product page?

[Hasansaleem1997]

Hey there,

Im using Colors theme and I wanted to add product image sliders to my product page, I’ve attached a reference image of what I want. can somebody share coding snippets that I need to paste?
Store link: www.plantpot.pk

[Zworthkey]

@Hasansaleem1997

.product .item>.left .product-media .gallery .thumb.col-0 {
    /* clear: left; */
}
.product .item>.left .product-media .gallery .thumb {
    width: 20% !important;
}

Search this code in colors.css
and replace it. or add it on the top of the file.

Thank you

[Hasansaleem1997]

@Zworthkey It has messed up the current layout. I want slider arrows, not stacking of images brother

[Zworthkey]

.product .item>.left .product-media .gallery .thumb {
    width: 20%!important;
    display: inline-block;
}

Add this code in codes.css

Thank you.

[Hasansaleem1997]

@Zworthkey really appreciate your help, it still didnt add arrows or slide, it stacked the images below: