Homepage - hide background image for mobile/hide 'multiple image' for desktop

psenior1

Hi,

I've trying to update my site and I'd like to keep the existing layout when viewed on mobile, but for desktop hide have a full screen background instead.

so...

Mobile - have multiple images displayed (as per the site now)

Desktop - hide the multiple image and use the background image feature instead

Is is possible to have both in the disgnm but just hide one or the other depending on screen size?

Many thank in advance

Website is www.snrmac.com

Hikin' Mike

Yes it's possible.

Hikin' Mike

To make it easier, first move your homepage logo into the header section. Then add this to your Theme's Custom CSS Section. If you don't know how: https://gallery.imagesinthebackcountry.com/Smugmug-customization/Adding-CSS-to-your-SmugMug-Website

This will hide your multiple images on your home page on screens larger than 736px.

@media screen and (min-width: 736px){

  .sm-user-ui .sm-page-layout-region-center {display: none;}

} 

psenior1

@Hikin' Mike said:
To make it easier, first move your homepage logo into the header section. Then add this to your Theme's Custom CSS Section. If you don't know how: https://gallery.imagesinthebackcountry.com/Smugmug-customization/Adding-CSS-to-your-SmugMug-Website

This will hide your multiple images on your home page on screens larger than 736px.

@media screen and (min-width: 736px){
  
  .sm-user-ui .sm-page-layout-region-center {display: none;}

} 

Great thanks for your help Mike. How do I hide the fullscreen background image/slideshow on screens smaller than 736px?

Hikin' Mike

@psenior1 said:
Great thanks for your help Mike. How do I hide the fullscreen background image/slideshow on screens smaller than 736px?

This should work. If it doesn't work, please keep your slideshow running so I can see it. I don't use a full-size slideshow, but I added one to my testing page and it worked fine.

@media screen and (max-width: 736px) {

  .sm-user-ui .sm-slideshow {display: none;}

} 

psenior1

Perfect, thanks for your help