Skip to main content

​
Overview

Customize the appearance of your Header Menu by adding a Dropdown Menu to lead page visitors with links to Landing Pages, Offers, and more within a streamlined, dropdown format.
Note: This guide refers to Kajabi Pages Templates. If you are using Premier Legacy Templates, please refer to this guide.

​
How to add a dropdown menu block

  1. Open the Website tab from your Dashboard.
  2. Select either Website Pages or Landing Pages.
  3. Open the page editor for your Page. Learn more
  4. Navigate to the sidebar and open the Header section.
  5. Click Add Content.
  6. Select Dropdown Menu.

​
Customize your Dropdown Menu block

​
Dropdown text color & dropdown background color

Design your Dropdown Menu to complement your branding colors by configuring the dropdown text color and dropdown background color. Click the Color icon to select a color from your site color palette. If you prefer to use a custom color, click the color wheel and then either enter your RGB color code or use the sliders to choose your color.
  • The vertical bar allows you to select the hue.
  • The square box allows you to select the brightness and saturation.
  • The horizontal bar allows you to select the opacity of your color.

​
Dropdown text

Change the text displayed in your Header Section to indicate the Dropdown Menu to your users. Dropdown Text

​
Show icon

Note: This feature is only available with your Website Builder pages. Learn about the Website Builder
Choose to display or hide the down arrow icon for your Dropdown Menu. Show Icon Select the link list (or navigation menu) to use for your Dropdown Menu Block. The Dropdown Menu Block in the Header Editor includes simple settings to help you streamline the build of your page. To create, customize, and change the menu used in your Dropdown Menu Block, learn to customize your Website Navigation Menus.
Note: Quickly navigate to your Website Navigation Menus from the Dropdown Menu Block by clicking Edit your link lists directly below the Menu field in the sidebar editor.

​
Open in new tab

Enable this setting to open the item selected from your menu in a new tab of your page visitor’s browser. Change the alignment of the text displaying each link in your Dropdown Menu (e.g., Left, Center, Right).

​
Stretch block

Enable the Stretch Block setting to fill the remaining space of the Header Section. A good rule for using the Stretch Block feature is to enable the Stretch Block feature for the Block on the far left of your Header Section. For example, if you want to have your Logo on the far left side of your Header and a Menu and User Menu on the far right side, select Stretch Block for your Logo.
Control the alignment and positioning of your Blocks by adjusting the Stretch Block and Block Alignment for the Blocks in your Header.

​
Text alignment

Adjust the horizontal alignment of your Block in the Header to appear more left, centered, or right-aligned. Keep in mind, this setting will be impacted by surrounding Blocks and their positioning and alignment.