Removing background image for mobile

[Joanna Pleta]

Hi there,

Would you be able to let me know how to remove the background image from Mobile? They are not showing up properly (the size is not proportional), so I would prefer for them not to show up at all, especially if this will also help with loading time.

Thanks!
Jo

[Bill Robbins]

Good Morning Jo,

You can hide the background images on smaller devices. Here’s how to do that:

1. Go to the Theme Options page and select the Styling tab.
2. Scroll down to the Custom CSS box and paste this:

   
   @media only screen and (max-width: 520px) {
   
   	ul#supersized {
   		display: none;
   	}	
   	
   }
   

3. Update your settings.

That will hide the background images when the browser size is 520 pixels wide or smaller.

There's also a few adjustments in the background section of the Theme Options page. If you'll set fit vertically and fit horizontally to no and also the minimum size both vertically and horizontally to 0 that generally will keep the images from being skewed.

If they are still being skewed, send over a link to your site and I'll be glad to take a look. Something may be overriding how they are resizing.

If you need any help, let me know,
Bill

[Joanna Pleta]

Hi Bill,

Thanks for the quick reply, as always!

I’ve put in the code you provided, as well as made the changes in the Background section, however, the background image is still showing up. Would you be able to provide some help on this?

My site link is congee-wong.com.

Thank you!
Jo

[Bill Robbins]

Jo,

Always glad to help. You may need to clear out your WP Super Cache, cache in order to see the changes. You can do that by going to the Settings section in your WordPress control panel and selecting Super Cache. I believe the delete cache link is on the first tab.

If you have any trouble, let me know. You can also change the 520px in the code snippet above to a larger number if you’d like to catch more devices. Another option might be 767px.

Bill

[Joanna Pleta]

Hi Bill,

Clearing the cache worked! Thanks so much for your help – the website is now more or less finished 🙂

Thanks again!
Joanna

[Bill Robbins]

Congratulations! It’s always such a good feeling to have a project finally finished. If you need anything else, we’re here to help.

[Author]

Posts