EverWeb Widgets HTML5

Horizontal Navigation Menu

Horizontal Navigation Widget

Navigate Sub Sites
& Directories

Different Languages

Current Page Indicator

Sometimes there is a requirement for a simple horizontal navigation for use on smaller websites, mobile sites, sub sites on large sites and sites which have versions in different languages.
The navigation allows the use of relative file paths for connecting sub sites and thus increases the performance of the website in general.
This widget also allows the current page to have a different background and font color with no rollover so that the visitors knows where they are.
The navigation can have up to eight list items. Add more widgets if that's not enough.
This menu can also be used in conjunction with the vertical navigation widget on sites with directories. Use the horizontal version for the directories and the vertical one for the pages within each directory.
This type of navigation is a lot better than a dropdown for letting visitors see exactly where they are in the website.

Widget Settings

Horizontal navigation menu widget
Horizontal Navigation

Widget Settings

The widget settings are show to the right.
Set the overall font family, size, color and the navigation block background color.
Increase/decrease the width and/or height of each block by adjusting the values for horizontal and vertical padding.
Set the rollover font color and background color.
Set the separator width and color. If the separator isn't required, set its value to zero.
Set the current list item font color and background color. Note that this has no rollover colors.
Enter the link text and the relative path for each item in the menu.
Note that the first two appear by default and the rest need to have the Display box checked before they will appear.
After all the items have been added, check the Current box next to the item which indicates the current page.

Get The Widget