Florence - Navigation menus

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

Navigation menu locations

The Florence theme has 4 navigation menu locations:

  • Primary = Menu to the left of your site title/logo
  • Secondary = Menu to the right of your site title/logo
  • Mobile = Menu that displays on mobile devices only
  • Footer = Menu at the bottom left corner of your website

Primary Navigation

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

Secondary Navigation

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

Mobile Navigation

  1. In your WordPress dashboard, go to Appearance > Menus.
  2. Click Create a New Menu. Give your menu a name (such as "Mobile Menu") and click Create Menu.
  3. Add the pages/categories you want to have in your mobile navigation menu.
  4. At the bottom of the page, under Menu Settings, select Mobile. Save Menu.
The content of the mobile menu "off canvas" area can also be fully customized! Click here for instructions.

Footer Navigation

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

Optional: Top Bar

Want to add an announcement message or social icons above your header menus?

  1. Go to Appearance > Customize > Header.
  2. Locate the Header Builder at the bottom of your screen. 
  3. In the Top Row, click the + icon to add a new element. For a announcement text, use the HTML element. You can also add elements like social icons, a search icon, a custom button, and more!

To customize the Top Row (background color, height, padding, etc), click on the Design tab in the settings panel.

To customize individual elements — such as the font of the HTML announcement — click on the element you want to customize and then go to the Design tab in the settings panel.