Change mobile slideshow image size in debut theme

Solved
chakranutrition
Tourist
4 0 4

Hi there,

Does anyone know how to change the size of the slideshow placeholder on the mobile version of the debut theme? I've made some changes to my code so I can swap out different images for desktop and mobile, and made the slideshow clickable without a button.

This is what it looks like right now:

Screenshot of mobile version.png

 

But I want the full image to display:

Mobile Banner 1500x1500.jpg

Accepted Solution (1)

Accepted Solutions
KetanKumar
Shopify Partner
25049 2508 9067

This is an accepted solution.

@chakranutrition 

thanks for url can you please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.

 

@media (max-width: 749px) {
.slideshow {height: 100vw !important;}
}

 


After code result 

KetanKumar_0-1636046284903.png

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

Replies 7 (7)
KetanKumar
Shopify Partner
25049 2508 9067

@chakranutrition 

yes please try this code

https://www.mojoin.com/show-shopify-banner-image/

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
chakranutrition
Tourist
4 0 4

Thanks for your response Ketan. That link is for images, not for slideshows. Is there a way to change the dimensions for slideshows?

KetanKumar
Shopify Partner
25049 2508 9067

@chakranutrition 

can you please show me your store url soi will check and let you know 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
chakranutrition
Tourist
4 0 4

drinkchakra.com

Password: inproduction

KetanKumar
Shopify Partner
25049 2508 9067

This is an accepted solution.

@chakranutrition 

thanks for url can you please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.

 

@media (max-width: 749px) {
.slideshow {height: 100vw !important;}
}

 


After code result 

KetanKumar_0-1636046284903.png

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

chakranutrition
Tourist
4 0 4

It worked! Thanks so much!

KetanKumar
Shopify Partner
25049 2508 9067

@chakranutrition 

its my pleasure to help us 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing