Audrey - Set up navigation menus

For detailed instructions on how to create and use menus in WordPress, click here.

Navigation menu locations

The Audrey theme has 6 areas where navigation menus can be displayed:

  • Header Right Navigation Menu = Menu to the right of your site title or logo
  • Top Left Navigation Menu = Menu at the top left of the page (not shown in demo)
  • Below Header Navigation Menu = Menu centered underneath your site title or logo (not shown in demo)
  • Split Navigation - Left = Menu that displays to the left of the header (not shown in demo)
  • Split Navigation - Right = Menu that display to the right of the header (not shown in demo)
  • Mobile Navigation Menu = Menu that displays on mobile devices

Some of these menus can be combined with one another to create unique menu configurations (for example, you could have the Split Navigation Menu + Top Left Navigation menus display together). For more details on combining menus, click here.

Header Right Navigation

This is the menu shown in the demo. Please note that when using this configuration, you should not have a menu set for any of the following locations: Below Header Navigation Menu, Split Navigation - Left, or Split Navigation - Right.
  1. In your WordPress dashboard, go to Appearance > Menus.
  2. Give your menu a name (such as "Header Navigation") and click Create Menu.
  3. Add the pages/categories you want to have in your header right menu. Save Menu.
  4. Go to Appearance > Widgets. Drag a Navigation Menu widget into the Header Right widget area.
  5. Select the menu you just created. Save.

Top Left Navigation

  1. In your WordPress dashboard, go to Appearance > Menus.
  2. Give your menu a name (such as "Top Navigation") and click Create Menu.
  3. Add the pages/categories you want to have in your top navigation menu.
  4. At the bottom of the page, under Menu Settings, select Top Left Navigation Menu. Save Menu.

Split Navigation

Before you begin, make sure your Header Right widget area at Appearance > Widgets is empty (no widgets).
  1. In your WordPress dashboard, go to Appearance > Menus.
  2. Click Create a New Menu. Give your menu a name (like "Split Left"), and then click Create Menu.
  3. Add the pages/categories you want to display to the left of your header.
  4. At the bottom of the page, under Menu Settings, select Split Navigation - Left. Save Menu.
  5. Create another new menu the same way. Assign it to the Split Navigation - Right menu location. Save Menu.

Below header navigation (header centered)

Before you begin, make sure your Header Right widget area at Appearance > Widgets is empty (no widgets).
  1. In your WordPress dashboard, go to Appearance > Menus.
  2. Give your menu a name (such as "Secondary Navigation") and click Create Menu.
  3. Add the pages/categories you want to have in your top navigation menu.
  4. At the bottom of the page, under Menu Settings, select Below Header Navigation Menu. Save Menu.

Combining menus

You can combine the following menus with the Top Left Navigation:

  • Header Right Navigation
  • Split Navigation
  • Below Header Navigation

Simply follow the instructions above for whichever two menus you'd like to combine.

Scrolling Navigation/Header

Audrey features a scrolling navigation menu that sticks to the top of the page as you scroll down. If you would like to disable this feature, click here and copy the code. Go to Appearance > Customize > Additional CSS and paste the code in the box. Click Publish to save your changes.

Scrolling Navigation When Top Left Navigation is Active

If you are using the Top Left Navigation menu, you may want to change the point at which the scrolling navigation menu is triggered.

To do that, go to Appearance > Theme Editor. On the right, click the js folder and then open the global.js file. Scroll to the bottom of the file and locate this line:

if ( $( document ).scrollTop() > 200 ){

Change 200 to 100, and then click Update File. This should resolve any undesirable behavior of the navigation as you scroll, when the Top Left Navigation Menu is active.