FROM CACHE - en_header

Debut theme product photos question

Solved
Rae_lastingimp
Excursionist
19 0 5

Hi all- I currently use the Debut theme for my online store and recently noticed that alternate photos  for my products are not listed horizontally anymore. Instead they are vertical. Can someone help me figure out why this has changed? 

Accepted Solution (1)

Accepted Solutions
dmwwebartisan
Shopify Partner
11148 2394 3434

This is an accepted solution.

@Rae_lastingimp 

Please add the following code at the bottom of your assets/theme.scss.liquid file

@media only screen and (max-width: 749px){
.thumbnails-wrapper .slick-list {width: 100%;}
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Click here GemPages The most powerful Shopify page builder.

View solution in original post

Replies 9 (9)
dmwwebartisan
Shopify Partner
11148 2394 3434

@Rae_lastingimp 

Please share your website URL and password if any. I will check if this is quickly possible.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Click here GemPages The most powerful Shopify page builder.
Rae_lastingimp
Excursionist
19 0 5

Hi. Thanks for the help. My website is www.LastingImpressionsTexas.com

 

dmwwebartisan
Shopify Partner
11148 2394 3434

Thanks for the url, Please share a screenshot where you need this.

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Click here GemPages The most powerful Shopify page builder.
Rae_lastingimp
Excursionist
19 0 5

Rae_lastingimp_0-1617455091132.png

Here is an example.

dmwwebartisan
Shopify Partner
11148 2394 3434

@Rae_lastingimp 

Please add the following code at the bottom of your assets/theme.scss.liquid file

@media only screen and (max-width: 989px){
.product-single__thumbnails-item { width:65px; float: left;}
.slick-initialized .slick-slide {width: 420px !important;}
}

@media only screen and (min-width: 990px){
.product-single__thumbnails-item--medium {float: left;}
.product-single__thumbnail-image {max-width: 90px !important;}
}

Hope this works.
Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Click here GemPages The most powerful Shopify page builder.
Rae_lastingimp
Excursionist
19 0 5
Yes! That fixed the issue on a desktop, but the images still aren't showing
up on mobile.
Rae_lastingimp
Excursionist
19 0 5

Here is a screen shot of the problem on mobile. 

72E12989-2F04-4140-8F87-E60260B30C95.jpeg

dmwwebartisan
Shopify Partner
11148 2394 3434

This is an accepted solution.

@Rae_lastingimp 

Please add the following code at the bottom of your assets/theme.scss.liquid file

@media only screen and (max-width: 749px){
.thumbnails-wrapper .slick-list {width: 100%;}
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Click here GemPages The most powerful Shopify page builder.