Product variants below the image of the main product

Solved
New Member
6 0 0

Hi everyone, I'm using the Fashe theme and in the product page the images of the variants are all in a column on the left and this makes the page scrolling annoying. I wish I could put them like in the image below:

Cattura.PNG

Thank you all for your help.

0 Likes
Shopify Partner
1517 267 323

Hi @iTsChronus 

Send me your store url

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
0 Likes
New Member
6 0 0

www.next.midnight.com

(currently I have the variants as in the picture, but only because I'm using an app. I would like to put some code that allows me to modify the variants without using apps)

0 Likes
Shopify Partner
1517 267 323

May be this tore is not on shopify, is that you sent wrong url? 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
0 Likes
New Member
6 0 0

@Jasoliya wrote:

May be this tore is not on shopify, is that you sent wrong url? 


Sorry,wrong url. Here is the right one: https://www.next-midnight.com/

0 Likes
Highlighted
Shopify Partner
1517 267 323

I think image already at bottom of main image.

 

product_page.png

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
0 Likes
New Member
6 0 0

@Jasoliya wrote:

I think image already at bottom of main image.

 

product_page.png


yes, because I'm using an app but I'd like to know if there was a code to do it without an app

0 Likes
Shopify Partner
1517 267 323

For that you have to disable app so i can check and code for that 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
0 Likes
New Member
6 0 0

@Jasoliya wrote:

For that you have to disable app so i can check and code for that 


Ok i disabled the app. For example now on this product on the left I have a column with all the product images.

https://www.next-midnight.com/products/ancient-roman-wolf-bracelet-with-beads

0 Likes

Success.

Shopify Partner
1517 267 323

Hi, You have to change some code for that you need code knowledge

follow this:

1. section->product-template.liquid->find product-image-carousel and wrap-slick3-dots then replace both div by each other so wrap-slick3-dots will show after product-image-carousel. like show in image:

2. then add this css in asset->theme.scss->at bottom of file

#product-image-carousel{width: 100% !important; }
.wrap-slick3-dots{ width: 100%; }
.slick3-dots{display: flex;flex-wrap: wrap;}
.slick3-dots li{width: 14%; }

product.png

 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
0 Likes