Logan Divi Child Theme

Header Style Customization

Logan has a ghost header style on specific pages. When using this style, you have 2 versions of the logo. A light or white logo used in the ghost style and the full color logo for the fixed menu.

Logo

Logo for Ghost Header – Set this logo in the Divi Theme Options

Logo for fixed menu – This has to be changed in the CSS.

The CSS Code can be copied and pasted to the Divi CSS box in the Customize or Divi Options section.

This is the code you need to change the logo:

[code]
.hero-dark .logo_container a::before{
background-image:url("your-logo-file-here";);
	height:90px;
	width:236px;
	background-size:100%;	
    top: -35px;
}
[/code]

Ghost Style for Pages

To create a new page with the Ghost style header, create your page and find the “Classes” box on the lower right side and enter “hero-dark” in the Body Class field.

Menu Hover & Current Menu

Code snippet to change the hover and current menu item color:
[code]
.current-menu-item a,.et_header_style_left #et-top-navigation nav>ul>li>a:hover,.et_header_style_left .et-fixed-header #et-top-navigation nav>ul>li>a:hover,.hero-dark.et_header_style_left #et-top-navigation nav>ul>li>a:hover,.hero-dark.et_header_style_left .et-fixed-header#main-header #et-top-navigation nav>ul>li>a:hover,.page #top-menu ul.sub-menu li.current_page_item a,.et_header_style_left #et-top-navigation #top-menu li.current-menu-ancestor.current-menu-parent>a{
background-color:#1276b1!important;
color:#fff!important;
}
[/code]

Telephone Number

Code snippet to change the telephone number background and hover color:

[code]
#et-info{
	background: #83933d !important;   
	
}
#et-info:hover{
	background: #1276b1;
}

[/code]

Contact Forms

Logan use the Caldera Forms plugin. The form export is included in your child theme package. If your form is missing after you have installed the theme and demo content, you can import the file.

To import the file:
1. Look for Caldera Forms from the links on the left side of the dashboard.
2. Select the “Import” button
3. Upload the contact form .json file the Exports folder in the child theme package.

Category & Single Post Templates

These templates does not install with the content demo. This requires a manual import. We also recommend you have 7 blog posts ready to go to best use the layout.

Import Category and Single Post Template:

1.Find Divi /Theme Builder from the links on the left side of the dashboard.
2. Click the import/export icon (up and down arrows)
3.Upload the Category json file from your Exports folder in the child theme package.
4.Click the import/export icon again to upload the Single Post .json file from your Exports folder in the child theme package.