Kadence Theme – Display 2 Different Menus On Different Pages Using Element Hook, PHP & Plugins

Show Widget Area Using Hooked Element In Kadence

Create a PHP function that adds a Widget area to the Kadence “Above All Content” Hook.

  • Step-by-step instructions to register a custom [widget_area] shortcode so it can be used anywhere shortcodes are accepted in WordPress including in Kadence Elements.
  • Add the PHP to site via Code Snippets WordPress plugin

Kadence Element (Kadence Pro Premium Addon):

  • Shortcode Block: added the following shortcode: [widget_area name=”Sidebar 2″]
  • Element Type: Content Section
  • Placement: Above All Content (this is the Kadence Hook where menu will be displayed)
  • Display Settings: Show On: Single Pages
  • Select Page By: Individually (click Select Items button to add Pages)
  • User Settings: Visible To: All Users
  • Device Settings: Show on Device: Mobile (so Sidebar above all content that holds menu widget only displays on mobile)

Create Menu(s)

Appearance > Menus; Click “create a new menu” link; add Pages and sub-Pages

Custom Sidebar(s)

Create custom sidebar(s) with the Content Aware Sidebars plugin so the menu(s) will be displayed on only the Pages we want.

  • Conditions tab: Where to display > Click New Condition Group button > Scroll down to “Post Types: Pages”; Add Pages
  • Action tab: How to display > Action: Replace; Target Sidebar: Sidebar 2; Merge Position: Bottom

Add Menu(s) to Widget(s)

Appearance > Widgets > Locate new Widget area > Add Menu Block (I added Navigation Menu as Dropdown Widget > Menu to use: (choose Menu created from the Create Menu step, above)

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top