Hide gallery on mobile only

Site URL: https://workoutwithmegan.co.uk/

Hi,

How can I hide the gallery section on my website on mobile only. I just want the gallery to display on desktop.

And also is it possible to set it up so I have a different gallery show on mobile which isn't displayed on desktop?

Thanks

Yes, you can create one section for mobile and a section for desktop and hide the one that shouldn't be showing on desktop and mobile.  It's just a little bit of code.

First, create your section that you want on the desktop and then add a new section for your mobile view.

//VARIABLES//

@mobile: ~"only screen and (max-width: 640px)";

@desktop: ~"only screen and (min-width: 760px)";

//hide mobile section on desktop//

@media @mobile {section[data-section-id="61a03d7xxxxxxxxxxxx"]{display:none!important;}}

//hide desktop section on mobile//

@media @desktop {section[data-section-id="61a03dxxxxxxxxxxxx"]{display:none!important;}}

Thank

13 hours ago, Donna_Vincent said:

Yes, you can create one section for mobile and a section for desktop and hide the one that shouldn't be showing on desktop and mobile.  It's just a little bit of code.

First, create your section that you want on the desktop and then add a new section for your mobile view.

 

//VARIABLES//

@mobile: ~"only screen and (max-width: 640px)";

@desktop: ~"only screen and (min-width: 760px)";

 

//hide mobile section on desktop//

@media @mobile {section[data-section-id="61a03d7xxxxxxxxxxxx"]{display:none!important;}}

//hide desktop section on mobile//

@media @desktop {section[data-section-id="61a03dxxxxxxxxxxxx"]{display:none!important;}}

Thank you this has worked