The Ultimate Toolbox for creating
amazing web sites!

Adding a Navigation Bar to your web site

One of the exciting features of WYSIWYG Web Builder is the ability to add advanced navigation elements to your web page with only a few mouse clicks. The Navigation Bar is one of those elements.
To insert a Navigation Bar select Insert -> Navigation -> Navigation Bar.
A Navigation Bar is a group of buttons, where each button is linked to a different page.
You can add, edit or remove buttons at any time using the properties. Select Add to insert a new button or Edit to modify the properties of an existing button. To remove a button from the Navigation Bar select Remove. You can rearrange the button order by using Move Up and Move Down.

Synchronize with Site Manager

To change the style of a Navigation Bar switch to the Style properties.
When this option is enabled, Web Builder automatically synchronizes the Buttons with the content of the Site Manager, so you do not have to add all your internal links manually.
The level parameter specifies which level of the Site Manager will be used to create the buttons.
First Level: Creates buttons that will link to the children of the root level.
Parent Level: Creates buttons that will link to all pages in the level above the current page in the Site Manager.
Current Level: Creates buttons that will link to the current page and all other pages that share the same parent page.
Child Level: Create buttons that will link to the children of the current page.

The Navigation Bar can be either Vertical or Horizontal. The Layout Space settings specifies the space between 2 buttons.


In this window you set things like font type, style, size and color.
To change the look of the button select one of the button image from the dropdown list. You can select a different image for when the mouse hovers over a navigationbar button. To select your own images, please select the first item in the list
(Use Custom Image), then you will be able to specify the location of an image on your computer.
WYSIWYG Web Builder includes a collection of example styles, but you can easily add your own styles:
Copy your own button images (gif, jpg or bmp) to this folder
C:\Users\YourName\Documents\WYSIWYG Web Builder\system\navbar
where YourName is the name of your Windows user account.

Extra button images are available in the download section:

Adding more button styles

Related tutorials

Linking your pages together (Creating links)
Adding a Menu Bar to your web site
Navigation tools