Layer header and footer options

The Layers theme options include multiple layout and layout options for headers and footers.

Headers

From the WordPress Customizer, select Header.

Styling

1. Header layout- Choose to display logo position in Logo Left, Logo Right, Logo Top Center, Logo Top, Logo Center, or Header Sidebar
2. Header width- Select this option to display the header as Boxed or Full Width
3. Fixed header: Slide to make the header sticky and to make the sticky header transparent
4. Look for: Swipe to show search in header. If enabled, enter a search tag

Header style

Control the visual style of title elements

1. Header padding: Adjusts the top and bottom padding of the header
2. Background color: Choose the color of the header background
3. Background image: Select an image for the header background
4. Fixed breakpoint (px): Sets the number of pixels, when the user scrolls, that the fixed menu displays

Page title style

Page titles appear on the list pages, and pages using the "Blank Page" template also include breadcrumb navigation.

1. Title background: Choose the background color of the page title
2. Background image: Select an image for the page title background
3. Title: Choose the color of the title text
4. Abstract: Choose the color of the page extract
5. Title height: Adjusts the height of the page title
6. Title below space (px): Adjusts the amount of space under the page title

Menu style

This will affect the menus displayed in the header.

1. Text color: Choose the color of the menu text
2. Text shadow: Select None, Lower Shadow, or Upper Shadow
3. Text transformation: Select None, Uppercase, Uppercase, Lowercase
4. Link spacing: Slide to set the amount of space between each menu item
5. Enable scroll style: Slide to enable scroll style detailed below

Header Menu Scroll Style

This will affect the header menu items when hovering over or active

1. Text color: Choose active / floating text color from menu items
2. Text shadow: Select None, Bottom Shadow, or Top Shadow for the active / floating state
3. Background color: Choose active / floating background color from menu item
4. Rounded corner size: Sets the amount of corner rounding in the active / active state of a menu item
5. Border width: Sets the border width of the menu item in the active / active state
6. Border color: Choose the border color of the menu item in the active / floating state

Submenu style

This will affect the drop down menus

1. Text color: Choose the color of the items from the drop-down menu
2. Text shadow: Select None, Lower Shadow, or Upper Shadow
3. Text transformation: Select None, Uppercase, Uppercase, Lowercase
4. Background color: Choose the background color of the item from the drop-down menu
5. Border width: Sets the border width of the dropdown menu item
6. Border color: Choose the border color of the item from the drop-down menu
7. Separator border color: Choose the color of the border that separates each item from a drop-down menu

Footers

Additionally, the Layers theme includes several layout and footer layout options in the WordPress Customizer. From the WordPress Customizer, select Footer.

1. Footer width: Choose from Box or Full Width
2. Widget areas: Choose the number of widget areas to appear in the footer
3. Copyright text: Enter your copyright text

Styling

1. Footer background: Choose the background color of the footer
2. Footer padding: Sets the top and bottom padding of the footer

Elementor Pro Header & Footer Generator

If you need more complex header layout customization, Elementor Pro allows you to fully design your headers and footers visually. You don't need to settle for limited options. You can drag and drop Elementor widgets onto your header and footer templates, and design the entire layout in any way you choose. Do you need different headers or footers to display based on multiple conditions? Elementor Pro simplifies that process.

More information about Elementor Pro Header and footer generator

Look these 5 inspiring headline tutorials