Help with Slideshow Gallery for mobile

Hi @tuanphan

I have tried to do all the aforementioned solutions you have written - but my slideshow on the homepage still wont fit properly. I use Slideshow: Full and when I'm looking on a phone, the images are not resized properly - can you please help me. I have now turned off auto-play.

https://www.smusicsupervision.com/

It worked! Thanks so much, @tuanphan!

13 hours ago, Feldborg said:

Hi @tuanphan

I have tried to do all the aforementioned solutions you have written - but my slideshow on the homepage still wont fit properly. I use Slideshow: Full and when I'm looking on a phone, the images are not resized properly - can you please help me. I have now turned off auto-play.

https://www.smusicsupervision.com/

Add to Design > Custom CSS

@media screen and (max-width:767px) {
body.homepage .gallery-fullscreen-slideshow {
    height: 30vh !important;
}
}

Thank You so much for the information but i am getting a problem when i add slide show to my home page my page speed decreases badly can any one help me in that Site URL: https://www.startmyhouse.com

I'm trying to do the same thing as the OP if anyone can help - would love the slideshow gallery on this page to fill the screen vertically when viewed on mobile.

https://beccagleason.co/weddings

Also is the code for that kind of thing something I can just copy for different galleries or is it specific for each slideshow? 

On 2/17/2021 at 9:02 PM, Elena2004 said:

Thank You so much for the information but i am getting a problem when i add slide show to my home page my page speed decreases badly can any one help me in that Site URL: https://www.startmyhouse.com

Can you check url again? It is WordPress site.

On 2/20/2021 at 3:20 AM, rebeccagleasonphotography said:

I'm trying to do the same thing as the OP if anyone can help - would love the slideshow gallery on this page to fill the screen vertically when viewed on mobile.

https://beccagleason.co/weddings

Also is the code for that kind of thing something I can just copy for different galleries or is it specific for each slideshow? 

Looks fine here. Did you solve this?

On 2/16/2021 at 9:52 AM, tuanphan said:

Add to Design > Custom CSS

@media screen and (max-width:767px) {
body.homepage .gallery-fullscreen-slideshow {
    height: 30vh !important;
}
}

 

Thanks you so much! 🙏

On 2/21/2021 at 4:47 AM, tuanphan said:

Can you check url again? It is WordPress site.

Looks fine here. Did you solve this?

I didn't, it's this slideshow - I'm trying to get it to fill up the screen vertically on mobile like the banner does

Hi, 

I am currently having trouble with the spacing between this slideshow and the next section as its too big. as shown by the picture below. I also can't get the "shop now" button to move down in the mobile view and is covering the image. do you think you could help me?

On 3/6/2021 at 8:35 AM, snuggs said:

Hi, 

I am currently having trouble with the spacing between this slideshow and the next section as its too big. as shown by the picture below. I also can't get the "shop now" button to move down in the mobile view and is covering the image. do you think you could help me?

Can you share site url?

Hi @tuanphan

I have tried to apply the codes you've written above but still, the slideshow on our website still being cropped severely on the mobile... How can we make it fit properly to show images in full width on mobile? I guess our problem is similar to the one you've solved above in October 2, 2020 (below screenshot)

Our website: https://www.modernfanasia.com/

Please help, thank you in advance!

On 3/15/2021 at 10:39 AM, TWII529 said:

Hi @tuanphan

I have tried to apply the codes you've written above but still, the slideshow on our website still being cropped severely on the mobile... How can we make it fit properly to show images in full width on mobile? I guess our problem is similar to the one you've solved above in October 2, 2020 (below screenshot)

Our website: https://www.modernfanasia.com/

Please help, thank you in advance!

Hi. Can you share link to your site?

Hi @tuanphan

Our site: https://www.modernfanasia.com/

Thanks!

On 3/29/2021 at 11:40 AM, TWII529 said:

Hi @tuanphan

Our site: https://www.modernfanasia.com/

Thanks!

Hi. Add to Design > Custom CSS

/* resize mobile slideshow */
@media screen and (max-width:640px) {
section#home-banner img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
}
section#home-banner {
    min-height: unset !important;
    height: 200px !important;
}
}

Hi @tuanphan I have similar problem, tried suggested code here it didn't work.

My website: https://www.sonaskids.com/

Thank you!

12 hours ago, Klaudia said:

Hi @tuanphan I have similar problem, tried suggested code here it didn't work.

 

My website: https://www.sonaskids.com/

Thank you!

Add to Design > Custom CSS

/* resize mobile slideshow */
@media screen and (max-width:767px) {
.gallery-fullscreen-slideshow {
    height: 35vh !important;
}
}

On 4/17/2021 at 5:06 PM, tuanphan said:

Hi. Add to Design > Custom CSS

/* resize mobile slideshow */
@media screen and (max-width:640px) {
section#home-banner img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
}
section#home-banner {
    min-height: unset !important;
    height: 200px !important;
}
}

 

Hi @tuanphan it works, thanks a lot!