Skip to main content
All CollectionsDiviTheme Customizer
Using The Divi Mobile Customizer Settings
Using The Divi Mobile Customizer Settings

Adjust sizes and margins for specific devices, such as tablets and smartphones.

Updated over a week ago

Adjust The Layout For Mobile Devices

One of the Theme Customizer's great features is that it allows you to adjust font sizes and spacing specifically for different mobile devices.

You can assign unique text sizes and spacing values for smartphones and tablets, adjusting these settings independently from the general settings applied to desktop viewers.

To customize your mobile styles, you must first enter the Theme Customizer by clicking the Divi โ†’ Theme Customizer link within your WordPress Dashboard.

Next, look for the Mobile Styles panel and open it to reveal the mobile styling options. You will notice 3 sections within the Mobile Styles panel:

  • Tablet

  • Phone

  • Mobile Menu

docs image

Tablet

Here, you can adjust the styles seen by viewers on tablet-sized screens.

You can adjust your font sizes, including body and header fonts, and your website spacing, such as the spacing between rows and sections.

docs image

Phone

Here, you can adjust the styles seen by viewers on phone-sized screens.

You can adjust your font sizes, including body and header fonts, and your website spacing, such as the spacing between rows and sections.

docs image

Mobile Menu

When the main mobile breakpoint is reached, the navigation menu appears in a more standard mobile style.

Viewers on phones and tablets see this menu. Here, you can adjust the appearance of this mobile menu, overriding the general styles chosen for your Primary Navigation bar within the Header and Navigation panel of the Theme Customizer.

docs image
Did this answer your question?