Product variants below the image of the main product

Solved
New Member
15 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
1927 321 406

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
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
New Member
15 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
1927 321 406

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
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
New Member
15 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
Shopify Partner
1927 321 406

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
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
Highlighted
New Member
15 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
1927 321 406

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
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
New Member
15 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
1927 321 406

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
Want to get Free review and advice for sale on store ?? just text me here
0 Likes