Code by Day | Explore By Weekend
Hide A Divi Background Image On Mobile

How To Hide A Divi Background Image On Mobile

Pee-Aye Creative Website Design
In this tutorial, I'm going to show you how to hide a Divi background image on mobile.

A Common Problem

How To Hide A Divi Background Image on Mobile

I see the question of how to hide a Divi background image on mobile over and over in the Divi Facebook groups. Some wonderful helpful folks offer solutions, but many times it is difficult for less experienced users to understand. NOTE: adding two sections and hiding/showing one of them on desktop / tablet / mobile is not a best practice. To make matters worse, there are zero answers on Google (until now) for this question. I decided to give you the combined solutions here for both regular and parallax section background images. If you like this, maybe you could check out my child themes for sale to show some support 🙂

Step 1

Add Custom CSS Classes To Section

Be sure to add your background image to the section. Then go to the Section Settings>Advanced>CSS Class and type or paste “pa-hide-background-image-mobile” into the field.

Step 2

Add The Custom CSS Code

In your Dashboard, go to Divi>Theme Options>Custom CSS and add the following code and hit save. This code has the solution for both regular and parallax sections all in one!

Live Examples

This SECTION has a REGULAR background image that shows up on desktop, but does not show on tablet or mobile.

This SECTION has a PARALLAX background image that shows up on desktop, but does not show on tablet or mobile.

Yay! 🎉 Now you know how to hide a Divi background image on mobile!

Bonus! Row Background Images

Add This Snippet For Rows

In your Dashboard, go to Divi>Theme Options>Custom CSS and add the following code and save. This code has the solution for both regular and parallax ROWS all in one!

This ROW has a REGULAR background image that shows up on desktop, but does not show on tablet or mobile.

This ROW has a PARALLAX background image that shows up on desktop, but does not show on tablet or mobile.

Please share this post!

FacebookTwitterPinterestEmailShare

Nelson Lee Miller

Nelson is the owner of Pee-Aye Creative Co in the beautiful state of Pennsylvania. He loves helping small businesses, exploring, and building websites with Divi.

You Might Also Like:

Custom Divi Header 03 – Free Download

how to right align the divi blurb module image and icon

Right Align the Divi Blurb Module Image/Icon

Google Style Clickable Divi Blurbs #1

Send us a message!