Navigation Bar Block
After you selected the navigation format in the Navigation Selector, a sample navigation appeared on the page where you dragged the block.
If you selected the Horizontal orientation, a horizontal menu appeared in the header of the page (or wherever else you dragged the block).
If you selected the Vertical orientation, a vertical NavBar appeared in the Nav Column of the page (or wherever else you dragged the block).
Depending on how you designed your horizontal navigation, you may find it difficult to see it on your header image. For example, if you created it with a transparent background and white text to sit on a dark background, it may appear on the header as white text on a white or very light background.
Do a preview of the page to see what it will look like live on your pages.
This activated the Navigation Bar Block's toolbar. There are 1-3 tools in the toolbar (one if you're using vertical navigation; two if you're using horizontal navigation; three if you're using a responsive design from the gallery).
The first is a "change your mind" tool where you can switch the navigation to the other orientation.
The second lets you change the alignment of the horizontal menu. You'll see this option only if you selected the horizontal menu from the selector (or if you click on a horizontal menu that's already on the page.
The third is the edit option for the hamburger menu label, which displays on any mobile device with a viewport width of 768px or narrower.
The hamburger menu button is the three short horizontal lines that replace all of the navigation when viewed on a small device. Since many people don't know what the hamburger menu icon represents, we let you use text instead for the button.
Note that some site designs have a vertical NavBar in place in the Nav Column by default. If you want to use a horizontal menu in one of those designs, remove the NavBar from the NavBar Sitewide Dot.
Orientation
- Click on the menu and select horizontal to switch to a horizontal orientation.
- Click on the menu and select vertical to switch to a vertical orientation.
If you made a mistake in your Navigation Bar selection, or later change your mind about the type of navigation orientation you want on your site, instead of deleting the block and starting over, simply choose the other option from the Orientation menu.
If you decide to use a Vertical navigation, remember to drag the block to the NavBar Sitewide Dot in the Nav Column.
Alignment
- Click on the menu and select left to align the horizontal menu to the left.
- Click on the menu and select center to center the horizontal menu.
- Click on the menu and select right to align the horizontal menu to the right.
If you selected the horizontal orientation, then you have three Alignment options. You can left-align the menu, center it, or right-align it.
Choose the one you want to use. The default is Left.
Note that the alignment is affected by some Position decisions you may have made in Site Designer.
If you clicked on the Left or Right + button, then the alignment on your pages will be offset to the right (for the Left button) or to the left (for the Right button) by the number of clicks on that button.
To remove any alignment offset, return to Site Designer's Position tool and click on the – for the same option (Left or Right) that you used during the menu customization.
Hamburger Label
- Click on the word "Menu."
- In the overlay, replace the word with whatever short text you want to use instead of "Menu."
- Click on Edit Hamburger Label Text to save your new text.
As noted above, the hamburger menu is the small button mobile phone users will see in place of your site's horizontal navigation.
The default text is "Menu." This tool lets you change that text. You'll want to do this if your site is in another language.
If your site is in English, "Menu" is the best label for this button.
To edit the label text, click on the word "Menu" in the toolbar. An overlay will open.
Replace the existing text with whatever short text you want to use. Ignore the mention of a 200 character max. You don't want your menu label's text to be longer than 10 characters.
Click on Edit Hamburger Label Text to save your new text.