Back to Support Content and Media Blocks Navigation Block

Navigation Block

The Navigation block displays a menu of links to help your visitors navigate around your website. This guide will show you how to use it.

Add a Navigation Block

To add the Navigation block, click on the + Block Inserter icon and search for “navigation”. Click to add the block to the post or page.


Using your keyboard, you can also type /navigation on a new line and press enter to quickly add a new Navigation block.

A forward slash followed by the text "navigation" in a blank space in the editor brings up the matching block types to be added.
The Navigation block can be added by typing /navigation in the editor.

For more information, visit our detailed instructions on adding blocks.

Add Content to the Block

When you first add the Navigation block into your post or page, it may be empty or show links to pages already published on your site. Click the + Block Inserter icon to add links to your menu, choosing from the following options:

  • Search for pages, posts, categories, products, and other content published on your site. Private or draft content will not appear here.
  • Type a URL to add a link to any page.
  • Recently updated pages or posts on your site.
  • Site Logo block – your site’s logo.
  • Social Icons block – logos linking to your social media profiles.
  • Page List – a list of all of your published pages.
  • Search block – visitors can search your website to find pages they’re looking for.
  • Buttons block – add a button-style link.

View our dedicated guides to learn how to:

Block Toolbar

When you click on the block, a toolbar of options will appear above it:

The toolbar that appears above the block with icons for options like changing the block type, dragging the block's location and more.

The Navigation block has the following options in its toolbar:

Each individual link in the Navigation block also has a toolbar above it:

The toolbar that appears for a single link within the Navigation block with options to select the parent block, change the type of link and more.

Block Settings Sidebar

If you do not see the sidebar on the right, click the Settings icon in the top right corner to bring up the settings. This icon looks like a square with two uneven columns:

The Settings icon at the top of the WordPress Editor highlighted.
The settings icon in the top right corner

The Navigation block settings contain three tabs:

  • List View
  • Settings
  • Styles

These settings are described below.

List View

Use the list view to control the items in the menu. You can:

Click the three dots to select a different menu for the Navigation block, or create a new menu.

If you have classic menus, you can import them here. Classic menus will display “Classic menu:” before the menu’s name.

The Navigation block sidebar settings with the option to add items to the menu or select a different menu.

Block Settings

Click on the cog/gear icon to access additional settings for the Navigation block.


Choose the justification between the menu links, from justify left, center, right, or evenly spaced between the items.

Set the menu’s orientation. The default is horizontal, but you can also choose vertical to display the menu items one underneath the other.

Turn Allow to wrap multiple lines off if you want the navigation to appear on a single line.


Control how the navigation displays on mobile devices, or if you prefer a minimal menu. Click the gray box to reveal the following settings:

  • Show icon button: Toggle on to show the universally-recognized “hamburger” icon of horizontal lines. Toggle off to display the word “Menu”.
  • Icon: Choose the style of the icon.
  • Overlay Menu collapses the navigation into a menu icon that opens as an overlay when tapped/clicked. Enable this behavior Always or for Mobile visitors only, or turn it Off to never collapse the menu.

If you have created submenus, you will see these additional options:

  • Open on click: The submenu dropdown opens only when you click it. If this option is turned off, the dropdown will open when you hover on the menu item with the submenus.
  • Show arrow: Choose whether you’d like to show an arrow used to indicate a submenu item or not. The actual icons used are determined by your theme.
The block settings sidebar with an arrow pointing to the Settings icon, providing the Layout and Display options for the Navigation block.


Change the name of the current menu used when editing your site (the name is not public.) Click Delete menu to delete the menu from your available menu list. Click Manage menus to manage all of your existing menus.

You can also add an HTML anchor and additional CSS classes to the block here.

Block Styles

In the block settings sidebar, click on the Styles icon to access the design settings for the block. The Styles icon is in the shape of a circle with half of the circle filled in:

An arrow points to the Styles icon that you can click to open up the block styles section.

Adjust your menu’s appearance with the following settings:

Each individual link within the Navigation block has additional customization options. Click on a link you want to customize, and you’ll see Link Settings in the sidebar.


The label is the text that appears in the navigation menu.


The URL is the link or page the menu item leads your visitor to.


If you use a theme supporting link descriptions, the text added here will appear in the menu.

Link Title

A link title is a tooltip that appears when a visitor hovers over a link. It is also useful for screen readers.

Link Rel

This tells the browser the relationship between the page the visitor is on and the link they’re clicking. This is helpful if you want to include nofollow so that search engines don’t index or give ranking credit to the link.

The block settings sidebar with the specific settings for Links, including the label, url, description and more.

Was this guide helpful for you?

Not quite what you're looking for? Get Help!

Copied to clipboard!