About The Theme Customizer
The Theme Customizers allow you to set up the basic styles of a Divi website, such as:
Website's Background Color
Website's Identity:
Favicon
Name
Tag line
Menu and Logo size
The default sizes of Sections and Rows
Basic Typography for Headings and body text
Note: Using the Divi Builder, many styles can be overridden for each page individually.
Accessing The Theme Customizer
Go to WordPress Dashboard
From the Dashboard Sidebar → Divi → Theme Customizer
Exploring The Theme Customizer
There are hundreds of options here, separated into different categories. When you first open up the customizer, you will see several panels, such as:
General Settings
Header & Navigation
Footer
Buttons
Blog
Mobile Styles
Color Scheme
Menus
Widgets
Homepage Settings
Additional CSS
General Settings
Site Identity - Defines the entire website identity, such as:
Site Title
Site Tag Line
Site Favicon
Layout Settings - Defines the basic layout of any Divi website, such as the Section's default top and bottom padding, the Row's default top and bottom padding, the Row's column gutter, and much more.
Typography: Defines the basic typography of the entire website, such as:
Body text's default font size
Body text's line-height
Header's Text size
Header and Body font family and text color, and more.
Pro Tip: The Header Text Size value set will be applied to all H1 Heading levels. Also, based on that value and the columns' layout, all the font sizes for the other heading levels will be calculated.
Background: Defines the website's background color and background image.
Note: Check the Divi Layout & Typography Customizer Settings article for more information.
Header & Navigation
Header Format: Defines the styles of Divi's Header. It can also Enable vertical Navigation or Hide the Navigation until scrolling the page.
Primary Menu Bar: Customize the Primary menu layout by changing the Height, the Logo's max height, Text size, and Letter Spacing, choosing the Menu's font family and color, changing the default background color and much more.
Secondary Menu Bar: Customize the Secondary menu layout by changing the font size and letter Spacing, choosing Menu's font family and color, changing the default background color and much more.
Fixed Navigation Settings: Customize the appearance of the Primary Menu when in a fixed state.
Header Elements: Choose to show the Social Icons the Search Icon and configure the Phone number and email address - which will appear at the top of Divi's Header.
Note: Check The Divi Header & Navigation Theme Customizer Settings article for more information.
Footer
Layout: Customize the Footer column's layout - by default, 4 columns layout is being used
Widgets: Customize the appearance of the Widget's text, such as the Widget's title text, body text, links color, etc.
Footer Elements: Display or Hide the Footer Social Icons
Footer Menu: Defines the styles applied for the Menu assigned as Footer Menu in WordPress Dashboard Appearance → Menus
Bottom Bar: Customize the styles of the Footer bottom bar and customize the default Copyright text.
Buttons
Buttons Style: Customize the default appearance of all buttons.
Buttons Hover Style: Customize the button's Hover state appearance of all buttons.
Note: Check the Adjusting Divi Button Styles In The Theme Customizer article for more information.
Blog
Post: defines the default text styles for the post's Meta information and Header text.
Mobile Styles
Tablet: Customize the default Sections and rows' top and bottom padding and the body and header text size for tablet devices.
Phone: Customize the default Sections and rows' top and bottom padding and the body and header text size for phone devices.
Mobile menu: Customize the mobile menu displayed on Tablets and Phones.
Note: Check the Using The Divi Mobile Customizer Settings article for more information.
Color Schemes
Color Schemes: Set one of the available color schemes for the entire website.
Menus
Menus: Create WordPress Menus.
Menu Location: set the Location where each WordPress menu should be displayed, such as Primary, Secondary or Footer.
Widgets
Sidebar: Place WordPress widgets in the default Divi Sidebar area
Footer Area #1...#6: Place WordPress widgets into any of the Footer's Columns.
Homepage Settings
Your Homepage Display: Allows you to choose what the website's homepage will display:
Your latest posts: A list of the most recent published posts
A static Page (recommended): where Divi Builder can be used to build an awesome layout
Additional CSS
Add your custom CSS Code, which will be applied site-wide.
Note: The CSS code placed in the Additional CSS area will also be displayed in Divi → Theme Options → General Tab → Custom CSS and vice-versa.