Hide images on mobile devices

paulawood

Hi

I would like to hide certain images on mobile devices. Could you please tell me how to do this.

Thanks

Bryan

Hello,

there is an option only to hide whole sections. If you edit a section, then you will need to scroll down until you see visibility option.

If you need to hide certain elements on mobile, then you can use very basic css.

Example:

You have an image in the muffin builder, edit it and add a custom class: hide-mobile-now

Then go to theme options>custom css&js>css

@media (max-width:780px) {.hide-mobile-now {display:none !important;}}

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

paulawood

Thank you, works perfectly!

paulawood

One more thing, how do I hide the subheader image on mobile devices?

Bryan

Also with custom css, try this:

@media (max-width:780px) {#Subheader {display:none !important;}}

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

paulawood

Thanks, can the actual subheader be removed on mobile? Removing the image leaves a big gap at the top.

Bryan

I have edited the css above, you can use it now to hide it.

thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

paulawood

Thank you so much! Works perfectly.