Customize Header & Footer
Click the Header tab to expand the Header settings panel. Here you will see Styling which contains the layout, color and menu styling options.
Choose either Boxed or Full Width.
- The Boxed width will restrict the content of the header (the logo and menu links) to a maximum of 1040 pixels centered in the page.
- Full Width will allow the header elements to expand to the width of the browser window (down to mobile screen sizes, where the header will convert into a mobile header)
Choose from one of five layouts by clicking the corresponding icon. Each icon provides a visual clue to what the layout does.
Logo Center Top
The Logo Center option will place the menu assigned to the Header Menu to the left of the logo, and the menu assigned to the Right Header Menu on the right.
Your menus are set under the Menus panel in the main Customizer Menu.
This section presents two options for controlling the behavior of your header bar. Check an option to enable it, or uncheck it to disable it.
Sticky will keep the logo and menu at the top of the browser window while scrolling. The following example shows a sticky header while the site is scrolled down:
Transparent Overlay will allow the header bar to overlap the slider widget or title container on pages, useful when you want a background texture or image to show through.
You may check both boxes for a combination.
When using the transparent overlay, it is important your Header background color choice and the background color of widgets at the top of your pages use a similar color scheme, as the links will automatically turn white or black based on the header background color on scroll. To customize link colors or header colors, see How to Customize the Header Menu Style
Available in Layers Pro, this section allows customization of the header background color and height and extra features such as a search bar in the header menu.
Page Title Styling
Page titles appear on list pages and pages using the “Blank Page” template they also include breadcrumb navigation. This section, available in Layers Pro, allows you to customize the title banner color, font color, height and spacing.
Click the back arrow in the Customizer nav bar to return to the main Header panel.
Available in Layers Pro, this section offers complete color customization of the header menu links and sub-menus.
Save your layout any time by clicking Save & Publish. Always save before manually refreshing the page!
Return to the main Customizer menu by clicking the back arrow at the top-left.
Choose a Layout for your site footer.
The Full Width layout will distirbute your footer column(s) across the full width of the viewer’s browser window, and is best used in combination with widget content that can fill out these areas well such as one widget column and a Layers Content Widget(ie not the default WordPress widgets).
The Boxed layout (default) limits the footer to a max of 1040px wide and keeps your content in line and centered with the rest of the layout.
Choose from None to 4 widget areas. Each widget area represents one column in the Footer
- 1 column = 100% width with a 2% margin
- 2 columns = 1/2 width or 50%
- 3 columns = 1/3 width or 33%
- 4 columns = 1/4 with or 25%
Choosing None will display just the copyright/footer menu bar.
Add some custom text to replace our default copyright. You may also add basic HTML here to insert things like links or small images.
Available in Layers Pro, this section offers advanced control of Footer background color and overall height.
Click the back arrow in the Customizer nav bar to return to the main Footer panel.
Return to the main Customizer menu by clicking the back arrow in the top-left.
Learn More about Customizing Your Site
Did you know?
Our friends at Jetpack are doing some incredible work to improve the WordPress experience. Check out Jetpack and improve your site's security, speed and reliability.