Step 3: General Settings

Written by the Divi Engine Documentation Team

Watch This Video

Introduction

Follow this information to use the General Settings of Divi Mobile.

Read First

As you build your mobile menu you need to know two things. Firstly, due to the way WordPress has been built, there may be times that the live preview mode does not load instantly. If you find this happening, please publish and reload until you see your work. Note that you may also have to view your mobile menu from a device that is not logged into the wp-admin dashboard of your Divi website such as your mobile phone. Secondly, Divi Mobile saves the menu you build to your active theme. Therefore if you change your active theme to a new child or parent theme then you will need to rebuild your menu.

Go To The Theme Customizer

Make your way to the Divi customizer by clicking on Appearance > Customize.

Click On Divi Mobile General Settings

Click on Divi Mobile and then on General Settings.

General Settings

The general settings section of Divi Mobile allows you to start building your mobile menu. Here you will select your menu, menu style, menu movement, screen breakpoint, header, and other important elements. While each element is self-explanatory, we do provide information on some of the features below to assist you.

PREMADE MENU STYLES

Select a premade menu style from the list.

PREVIEW MODE

The preview mode option allows you to view your menu in mobile, tablet and desktop view.

MOBILE HEADER STYLE

You have two options for how you want to create your mobile header. Your choices are the Divi Theme Builder or Divi Mobile. Divi Mobile allows you to create your header using the default Divi header or with our custom header builder. If you want to use the Divi Theme Builder then you need to add our shortcode [divi_mobile_tb_menu] into the Theme Builder. In addition, make sure you disable the Divi Mobile custom header.

REMOVE SPACE

Enable this to remove the space that might appear at the top of the page when using the theme builder.

PRIMARY MENU

Select the primary menu that you have created in the WordPress menu section. Assign how you would like this menu to move as well as the movement style when your customer clicks on the menu burger icon. The preview mode option allows you to view your menu in mobile, tablet and desktop view.

SECONDARY MENU

If you would like to have another menu appear at the bottom of the mobile view of your website then assign it here.

BREAKPOINT

Define the device width that you would like your mobile menu to be activated from. This allows you to make your mobile menu appear on desktop, tablet and phone.

FIXED OR NOT FIXED BURGER MENU

If you would like your burger menu to stay fixed to the screen as your customer scrolls then select Fixed.

HIDING YOUR HEADER

If you are using the theme builder to disable your header on specific pages or posts then click the NO button to hide your menu. Click YES to keep it visible.

More Support?

Please email us at [email protected] if you are unable to get Divi Mobile working.