Skip to content
Help Center
  • Pricing
  • ProductsExpand
    • Premium PlansGet all the tools you need in one plan
    • Kadence ThemeLightning-fast performance theme for modern websites
    • Kadence BlocksDrop in ready designs with advanced controls for pixel perfect websites
    • Kadence Shop KitCreate a more effective WooCommerce shopping experience
    • Kadence ConversionsBoost sales and build engaged audiences with popups and banners
    • Kadence InsightsEasily create A/B tests. Optimize your pages to drive higher conversions.
    • View All Products
    • Get Kadence + Hosting
      In One Place

      Enjoy faster setup, top-tier performance, and worry-free WordPress hosting – Kadence Theme, Kadence Blocks, and Solid Security all pre-installed.

      Learn More

  • Kadence AI
  • Starter Templates
  • Blog
  • SupportExpand
    • Resource HubStart here for guides, Product docs, FAQs, and Troubleshooting tips, all in one place.
    • Contact SupportStuck on something? We’re here to help! Open a ticket for top-notch support.
    • Contact Our TeamGot pre-sales questions or need help choosing a plan? Open a ticket and our team will guide you.
    • About usCrafted with love in Missoula, Montana. Meet the team behind the mission.
Account Account
Get Kadence
Kadence Blocks
  • Features
  • Pro
  • Blocks
  • HelpExpand
    • Documentation
    • Submit a Ticket
    • Facebook Group
    • Feature Requests
    • Roadmap
    • Changelog
Help Center
Kadence Blocks

Kadence Blocks

  • Row Layout Block
  • Text (Adv) Block
  • Buttons (Adv) Block
  • Image (Adv) Block
  • Gallery (Adv) Block
  • Section Block
  • Testimonial Block
  • Table of Contents Block
  • Form Block
  • Form (Adv) Block
  • Table (Adv) Block
  • Accordion Block
  • Tabs Block
  • Info Box Block
  • Google Maps Block
  • Show More Block
  • Icon Block
  • Icon List Block
  • Progress Bar Block
  • Posts Block
  • Count Up Block
  • Countdown Block
  • Vector Graphic Block
  • Lottie Animations Block
  • Repeater Block
  • Spacer/Divider Block
  • The Kadence Header (Adv) Block
  • The Kadence Navigation (Adv) Block
  • The Kadence Navigation Link Block
  • Search (Adv) Block
  • Site Identity Block
  • Kadence Blocks Default Icon Selections

Getting Started

  • Installing Kadence Blocks
  • Getting Started with Kadence Performance
  • Kadence AI-Powered Design Library
  • Setting custom widths in multi-column Row Layout Blocks
  • How to define a color Palette with Kadence Blocks
  • How to delete/remove a Block
  • How to Duplicate and Copy/Paste Block Styles
  • Setting Block Defaults
  • Kadence Blocks Pexels Integration

Block Tutorials

  • How to Import and Export Blocks or Sections Between Websites
  • How to Use Flexbox Layouts with Section Blocks
  • How to Make a Top Section Sticky with Kadence Blocks
  • Using Padding and Margin in Kadence Blocks
  • Responsive Breakpoints in Kadence
  • Using GIFS and Lottie Animations with Kadence Blocks
  • Adding a Full-width Row
  • Modal Block Quick Start Guide
  • Image Overlay Quick Start Guide
  • How to hide Kadence blocks via WordPress Gutenberg Preferences
  • How To Add Animate on Scroll Effects To Your Page
  • How to add Custom CSS Classes and HTML IDs to Kadence Blocks
  • How to Show Events Using the Kadence Post Grid/Carousel Block
  • How to use Popup Modal Filters with Advanced Query Loops
  • Create a Full Screen Landing Page
  • Displaying Shortcodes in the WordPress Editor
  • Advanced Navigation Sub Menus and Mega Menus
  • Creating Sticky and Transparent Advanced Headers
  • Getting started with Advanced Header/Navigations
  • Building Headers and Footers in Full Site Editing with Kadence Blocks
  • Split Content Quick Start Guide
  • Applying Block-Level Custom CSS in Kadence Blocks
  • How to Access the Kadence Design Library
  • Adding Video Backgrounds to Row Layout
  • Pexels Picker
  • Adding Classic Wireframes, Starter Packs, and Sections to the New Design Library
  • How to customize the design library color palette
  • Adding Privacy Policy link to Kadence Form
  • Set Equal Column Heights with the Row Layout Block
  • How to Control the Hero or Title Section Sitewide and Per Page in Kadence
  • How to Change the Query Loop (Adv) “All” Button Text

Kadence Blocks Pro

  • Kadence Blocks Pro Plugin
  • Product Carousel Block
  • User Info Block
  • Portfolio Grid/Carousel Block
  • Query Loop (Adv) Block
  • Post Grid/Carousel Block
  • The Kadence Block Controls
  • Dynamic Content
  • Display Blocks Conditionally (Conditional Display)
  • Advanced Slider
  • Video Popup Block
  • Image Overlay Block
  • Split Content Block
  • Modal Block
  • Using a Dynamic List Block
  • Dynamic Content: Custom Input and Showing Fields from all Post Types
  • Dynamic HTML Block
  • Using Custom SVG Icons with Kadence Blocks Pro
  • Kadence Custom Fonts
  • Post Grid/Carousel Block – Configure a Blog List

Troubleshooting Blocks

  • Troubleshooting the “Error, Unable to access library database, please try re-syncing” error on the Kadence Blocks Design Library
  • Troubleshooting Query Loop (Adv) Blocks, Filters, and Search issues
  • Kadence Blocks Errors when SCRIPT_DEBUG is Enabled
  • Troubleshooting White/Blank Screens in the Editor or Customizer
  • How to Force Reindex Advanced Queries
  • How to Download Previous Versions of the Kadence Theme and Plugins
  • Resolving Autoplay Problems in Advanced Slider/Gallery Blocks
  • Recommended Server Resources
  • Troubleshooting Kadence Form (Adv) Email Delivery
  • How to Recover a Broken Block

Advanced

  • How to Modify SVG Dividers in Kadence Row Layout Blocks
  • How to Override the Kadence Forms Email Template
  • Prebuilt Layouts
  • How To Set Your Own Conditions for Successful Form (Adv) Submissions
  • How to Block Form (Adv) Spam Using WordPress Disallowed Comment Keys
  • Custom Queries for the Portfolio Grid/Carousel Block (Filter)
  • Customizing the Kadence Blocks Pro Post Grid/Carousel block’s Query to show multiple post types
  • Custom Queries for the Posts Block (Filter)
  • How to Set a Gradient Border for the Section block
  • Run JavaScript when Query Loop (Adv) Updates
  • Custom Upload Directory in Kadence Form (Adv) Block
  • Populate Select, Checkbox, and Radio field option values programmatically in Form (Adv)
  • Query Loop (Adv) Block: Split Character Filter
  • How to add Multiple Markers in the Kadence Google Maps Block
  • Custom Queries for the Post Grid/Carousel Block (Filter)
  • How to Run JavaScript After a Kadence Form is Successfully Submitted (On Event)
  • Dynamically Displaying ACF or Metabox Relationships in Query Loop (Adv) blocks
  • How to Customize the Kadence Blocks Variable Font Sizes (SM, MD, LG, XL, 2XL, and 3XL)
  • Using Tooltips with Kadence Blocks
  • Custom Queries for the Advanced Query Loop Block (Filter)
  • Adding a Custom Font to Kadence Blocks

Advanced Headers

  • How to use Advanced Headers Globally and Conditionally in Kadence
  • The Kadence Header (Adv) Block
  • Using Advanced Header / Navigation Blocks vs Kadence Theme Header Builder
  • Advanced Header Best Practices
  • Getting the most out of Navigation Link Blocks
  • Creating Sticky and Transparent Advanced Headers
  • Advanced Navigation Sub Menus and Mega Menus
  • The Kadence Navigation Builder
  • The Kadence Visual Builder & Off Canvas Settings
  • Importing & Exporting Advanced Headers & Navigations

Kadence Form Integrations

  • How to Modify the Form (Adv) Submit Actions using a Filter
  • How to integrate hCaptcha with Kadence Form (Adv) Blocks
  • How to Integrate Kadence Forms with Cloudflare Turnstile
  • How to Integrate Google reCAPTCHA with Kadence Forms
  • How to Integrate Google Analytics with Kadence Forms
  • Integrating Kadence Forms with FluentCRM
  • Integrating Kadence Forms with Kit (ConvertKit)
  • Kadence Forms and Database Entries
  • Kadence Forms and Auto Respond Emails
  • Integrating Kadence Forms with Webhooks
  • Integrating Kadence Forms with Mailchimp
  • Integrating Kadence Forms with Brevo
  • Integrating Kadence Forms with ActiveCampaign
  • Integrating Kadence Forms with Mailerlite
  • Home
  • Knowledge Base
  • Kadence Blocks
  • Kadence Blocks
  • Advanced Headers

Using Advanced Header / Navigation Blocks vs Kadence Theme Header Builder

The Kadence Advanced Header offers comprehensive control over your WordPress header, making it an excellent choice for both Classic WordPress and Full Site Editing (FSE) websites. With Advanced Headers, you can integrate Advanced Navigation Blocks to customize and display navigation menus within your header. The Visual Builder allows for easy drag-and-drop placement of blocks into various header sections, alongside access to numerous header and block settings for enhanced customization.

In contrast, the Kadence Theme Header is a built-in feature exclusive to the Kadence Theme. It provides a user-friendly interface for adding navigational elements and other header items, such as social icons, through the Visual Header Builder in the Customizer. While the Kadence Theme Header includes a Widget Area Header Item to display certain blocks, it is primarily constructed using predefined Kadence Header Items rather than flexible blocks.

This document will explore the differences between using Advanced Header/Navigation Blocks and the Kadence Theme Header Builder, highlighting their unique features and benefits to assist you in choosing the best option for your website.

Table of Contents
  • Advanced Headers
    • Visual Builder
    • Navigations and the Navigation Builder
    • Advantages of the Advanced Header/Navigation Blocks
  • The Kadence Theme Header Builder
    • Classic Navigation Menus
    • Advantages of the Kadence Theme Header Builder
  • Using Advanced Navigations with the Kadence Theme
    • What not to do with Advanced Navigations

Advanced Headers

Advanced Headers are Custom Post Types that can be created from the Dashboard -> Kadence -> Headers page. This will create a new Header Post Type and allow you to edit it using the WordPress Editor.

Headers Page

Advanced Headers can be created or added to Pages, Posts, Elements, and anywhere the Block Editor is available.

Visual Builder

When using Advanced Headers, the Visual Builder can be used to customize the Header directly from within the Block Editor. The Visual Builder offers multiple Rows and Placement options for placing Blocks directly within the Header. There are no limits to the blocks you add or how you decide to use them, be sure to check out our best practices guide to ensure your header is optimal.

Adding Blocks to the Visual Builder.

Adding Blocks

Moving Blocks inside the Visual Builder.

Moving Blocks

You have three Header Rows available: Top, Middle, and Bottom. Each Header Row contains a Left Section, Center Section, and Right Section.

Row Sections
Header Rows and Sections

The Advanced Header and Header Rows have available Block Settings for customizing them respectively.

Block Settings
Header Row Settings

Additionally, as you add Blocks to the Advanced Header, you can use the respective Block Settings to customize the Blocks individually.

Blocks Settings

For a complete overview of the Visual Builder, how it works, and how to use it, click here.

Navigations and the Navigation Builder

Advanced Headers utilize Advanced Navigation Blocks to incorporate menus into your header. You can create Advanced Navigations either from the Dashboard -> Kadence -> Navigations page, directly from the Page Editor, or within an Advanced Header itself.

Kadence Navigations
Adding Navigation outside of Header

When creating Advanced Navigations, use the Navigation Builder to build complete Navigations directly from within the WordPress Editor.

Navigation Builder Sample

For a complete overview of the Navigation Builder, how it works, and how to use it, click here.



Additionally, you can customize Advanced Navigation Blocks by utilizing the Navigation (Adv) Block Settings and the Navigation Link Block Settings to adjust individual navigation menu items.

Navigation Settings

For a complete understanding of Advanced Headers and Advanced Navigations, please also refer to the resources below.
-Getting Started With Advanced Headers / Navigations
-Header (Adv) Block
-Navigation (Adv) Block
-Navigation Link Block

Advantages of the Advanced Header/Navigation Blocks

The Advanced Header Block is very versatile, as you can add any Block to the Header directly from the Editor. Here are a few Advantages of using an Advanced Header over the Kadence Theme Header.

-To access the Premium Features of the Advanced Header and Navigations Blocks, the Kadence Blocks Pro plugin is required.

  • Adding Blocks: The Advanced Header Block allows you to insert blocks into any section of the header, providing flexibility for both simple and complex customizations. You can add as many blocks as necessary and customize them to your needs, including adding additional Row Layout Blocks to design intricate and detailed headers.
Adding Blocks
  • (The Kadence Theme Header also allows blocks to be added to it, but it’s limited to the Widget Area or by using a Hooked Element within the HTML Widget. Additionally, the Kadence Theme Header offers Header Items/Widgets to add items to the Header. Once you use a widget, it cannot be added again in the same header. For instance, if you use a Button Widget, you won’t be able to add the same Button Widget to the header again.)
Adding Blocks to the Kadence Theme Header
Adding Header Items to the Kadence Theme Header
Adding Blocks to Advanced Headers
Adding Blocks to Advanced Headers
  • Full Site Editing (FSE) Support: The Advanced Header and Navigation Blocks fully support FSE, making them ideal for creating headers, footers, and navigations in FSE environments.
  • (In contrast, the Kadence Theme Header Builder does not support FSE, as the Kadence Theme itself is not yet compatible with FSE.)
  • Customize Navigations: Advanced Headers offer the Advanced Navigation Block. Advanced Navigation blocks can be used inside and outside of Advanced Headers, giving you the ability to add Navigations easily to things like Sidebars and the Footer. This block also offers a comprehensive range of settings that allow you to fully customize your navigation from every angle directly in the editor. Moreover, the Navigation Link Block can be used to modify individual links within the navigation, providing an even greater level of customization for each link in your menu.
  • (In contrast, the Kadence Theme Header Builder includes Primary and Secondary Navigations that can also be added to the Header and customized. However, these options are more limited and do not offer as many settings as the Advanced Navigation.)
  • Pre-Built Templates: The Advanced Header Block offers a selection of header templates designed for both desktop and tablet/mobile views. You’ll find basic and multi-row header options, each pre-populated with blocks, enabling quick and efficient setup. Additionally, Mega Menu templates are also available and include pre-made layouts for them.
  • (The Kadence Theme Header Builder doesn’t offer pre-built templates. However, the Kadence Starter Templates plugin imports customizer settings that include the Header design/layout. Additionally, the Kadence Theme Header Builder also offers pre-built widgets that can be used in the header.)

Basic Desktop Layout Examples:

Desktop Templates

Multi-Row Desktop Layout Examples:

Multi Columns

Tablet/Mobile Layout Examples
Mobile Templates

Mega Menu Examples

Mega Menu Layouts

The Kadence Theme Header Builder

The Kadence Theme Header Builder can be accessed by navigating to Customizer -> Header settings when using the Kadence Theme. The Header Builder offers a list of Available Items that can be added to the header and customized using their respective settings.

Kadence Theme Header Builder
The Kadence Theme Header Builder

When utilizing Kadence Theme Kit Pro, you gain access to additional valuable header items. These include features like the My Account item, Shopping Cart item, and various other widgets that are ready to use. These items are feature-rich and may not be easily replicable with the Advanced Headers functionality.

Pro Widgets

Kadence Theme Kit Pro also features Conditional Headers, allowing you to display Headers Conditionally. This makes it easy to create different Headers based on conditions, such as if a user is logged in or logged out.

Conditional Headers

Each Header Row in the Kadence Theme Header Builder can be customized by clicking the Settings Icon located on the far left of the Row, enabling you to modify each Row according to your requirements.

Moreover, each Header Item or Widget can also be customized by selecting the Settings Icon next to the specific Header Item.

Settings in the Customizer

Classic Navigation Menus

The Kadence Theme Header uses Classic Navigations. These can be primarily created and modified from the Dashboard -> Appearance -> Menus page.

Classic Menus

The Customizer can also be used to create and modify Classic Navigations. This can be done from the Customizer -> Menus settings.

Customizer Menus

The Kadence Theme Header enables you to utilize both Primary and Secondary Navigation menus. You can design these menus using the Primary/Secondary Navigation Customizer settings.

Adding Classic Navigations

Advantages of the Kadence Theme Header Builder

The Kadence Theme comes equipped with the Kadence Theme Header Builder, accessible through the WordPress Customizer under the Header Settings. This tool provides a straightforward way to build and customize your site’s header, automatically applying the header across all pages on your website.

-To access the Pro Features of the Kadence Theme Header Builder, the Kadence Theme Kit Pro plugin is required.

  • Easy Application: The Kadence Theme Header Builder automatically applies the Theme Header to all pages on your website, making it a convenient option if you need a quick, basic header with minimal setup.
  • (Advanced Headers, on the other hand, must be manually created and configured for use with the Kadence Theme. While they provide more flexibility due to their block-based design, they may require additional customization. However, you can simplify the process by using templates, which make setting up Advanced Headers easier. Click here to explore the available Advanced Header and Mega Menu templates.)
  • Prebuilt Widgets: The Kadence Theme Header Builder includes various Header Items in the Header Customizer Settings. These are pre-built widgets that can be easily customized and added to your header. The General and Design settings within the Customizer can be used to customize each Header Item. This offers a quick and efficient way to enhance your header with essential elements ready to be used.
  • (In contrast, when using Advanced Headers, similar elements must be manually created using blocks, offering more flexibility but requiring additional setup. )
Adding Widgets
Adding Widgets to the Kadence Theme Header
  • Conditional Headers (Kadence Theme Kit Pro): The Kadence Theme Header Builder allows you to create Conditional Headers directly within the Customizer. These conditionals enable you to display different headers on different pages based on specific conditions, such as user roles, device types, or page templates.
  • (The Advanced Headers Block doesn’t have a built-in way to conditionally display itself. However, Hooked Elements (Theme Kit Pro) can be used to conditionally display Advanced Header Blocks on websites. Full Site Editing websites can also display Advanced Headers conditionally using the templating system.)
Conditional Headers
The Kadence Theme Conditional Headers Settings

Using Advanced Navigations with the Kadence Theme

Advanced Navigation Blocks are versatile and can enhance the display of navigations in multiple ways using the Kadence Theme. They can be seamlessly integrated into the Header Area Widget (Theme Kit Pro), Footer, Sidebar Widgets, and even within Mega Menu Element Content (Theme Kit Pro). This versatility makes Advanced Navigation Blocks valuable beyond just the Advanced Header, offering significant flexibility and customization options.

Advanced Navigation Blocks can be utilized in Footer and Sidebar Widgets, allowing you to display navigations throughout your website effectively. This feature enhances user experience by providing easy access to important links from various sections of your site.

Adding a Nav to the Footer Widget
Footer With Nav
Sidebar Widget
Sidebar Nav

Advanced Navigation Blocks can also be used in the Header Area Widget, enabling you to create custom elements like manual icon links, display descriptive texts, and craft unique navigations. (This can also be used for adding a Third Navigation to the Kadence Theme Header.) This flexibility allows for a more personalized and engaging header experience.

Header Area Example

Use Advanced Navigation Blocks with Hooked Elements and Mega Menus to display Customized Advanced Navigation Blocks inside of Mega Menus. (Both of these features require Kadence Theme Kit Pro)

Hooked Elements allow you to display Elements across your website using Theme Action Hooks, ShortCodes, or selecting an Element where applicable to Kadence Products. Mega Menus offer the ability to display Custom Content. The Custom Content Feature of Kadence Theme Menu Items allows you to select and use a Hooked Element for the Mega Menu. This gives you the ability to use the advanced features of Advanced Navigation Blocks to build Mega Menu Contents. (To learn more about building Mega Menus with the Kadence Theme, click here. To learn more about Hooked Elements, click here.)

Example of a Mega Menu using Advanced Navigation Blocks.

Advanced Navigations In Mega Menus

What not to do with Advanced Navigations

When adding an Advanced Navigation outside of an Advanced Header Block, it’s not recommended to use Dropdown Sub Menus or Mega Menus. For instance, these features are not designed for areas like a Sidebar or Footer. Implementing Mega Menus or Sub Menus in these locations can lead to a less optimal user experience.

Do you feel this document was helpful?
The Kadence Header (Adv) BlockAdvanced Header Best Practices
The Kadence WP Logo
Crafted in Missoula, Montana
  • Follow Kadence on Facebook
  • Follow Kadence on Youtube
  • X
  • Follow Kadence on Instagram
Trustpilot
Products
  • Kadence Plans
  • Kadence Theme
  • Kadence Blocks
  • Kadence AI
  • Kadence Starter Templates
  • Kadence Shop Kit
  • Kadence Conversions
  • Kadence Pattern Hub
  • View All
Resources
  • Blog
  • Podcast
  • Knowledgebase
  • Support ticket
  • Feature Requests
  • FAQ
  • WordPress Hosting Services
About Us
  • About Kadence
  • Become an affiliate
  • Contact us
  • Terms
  • Privacy Policy
  • Security
Our Partner Brands
  • SolidWP
  • LearnDash
  • The Events Calendar
  • GiveWP
  • MemberDash
Kadence Community
  • Kadence Marketplace
  • Join the Facebook Group
  • Subscribe to our YouTube Channel
© 2024 Kadence WP | All prices are in USD
Logo for StellarWP an umbrella brand of Premium WordPress plugins
  • Pricing
  • Products
    • Premium PlansGet all the tools you need in one plan
    • Kadence ThemeLightning-fast performance theme for modern websites
    • Kadence BlocksDrop in ready designs with advanced controls for pixel perfect websites
    • Kadence Shop KitCreate a more effective WooCommerce shopping experience
    • Kadence ConversionsBoost sales and build engaged audiences with popups and banners
    • Kadence InsightsEasily create A/B tests. Optimize your pages to drive higher conversions.
    • View All Products
    • Get Kadence + Hosting
      In One Place

      Enjoy faster setup, top-tier performance, and worry-free WordPress hosting – Kadence Theme, Kadence Blocks, and Solid Security all pre-installed.

      Learn More

  • Kadence AI
  • Starter Templates
  • Blog
  • Support
    • Resource HubStart here for guides, Product docs, FAQs, and Troubleshooting tips, all in one place.
    • Contact SupportStuck on something? We’re here to help! Open a ticket for top-notch support.
    • Contact Our TeamGot pre-sales questions or need help choosing a plan? Open a ticket and our team will guide you.
    • About usCrafted with love in Missoula, Montana. Meet the team behind the mission.
Account Login
  • Features
  • Pro
  • Blocks
  • HelpExpand
    • Documentation
    • Submit a Ticket
    • Facebook Group
    • Feature Requests
    • Roadmap
    • Changelog