The Website Menu is a crucial element to any website structure. The right menu facilitates user navigation between different sections or pages of your website. Poorly constructed menus can leave your visitors stranded and disoriented, struggling to find the page or information they seek.
WebManager provides you with an intuitive Website Menu tool to help you effectively create and manage your website pages. Ultimately, well-designed menus lead to a seamless navigation, delightful user experiences, increased traffic, and enhanced conversions.
This article will be broken up into the following sections:
How to Find Menu Settings
First click the Settings cogwheel located at the bottom of the leftmost sidebar. Under the Website category, select Menu.
The Website Menu Settings page will appear on your screen. You have total control over how your menu looks and functions. Below are a few features that impact your website menu's display, navigation, and feel.
Menu Bar
The Menu Bar section lets you determine your website's layout and how your menu headings are displayed.
The Layout section allows you to select either Centered or Wide. Centered will have the menu elements closer to the center whereas Wide will push them out to the edges of the screen.
The Headings section allows you to determine the justification of your menu headings. Left-aligned aligns the menus to the left, Centered aligns them to the center, and Right-aligned aligns them to the right.
Checking the Positioning checkbox will keep your menu section anchored to the top when scrolling down your pages. Unchecking this checkbox will allow you to scroll down your pages without the menu at the top.
Menu Logo
With Menu Logo, you can easily add your own logo to your website. If you want transparency in your logo your image must be .PNG format to support transparency and alpha blending. If there is no need for transparency it can be in .PNG or .JPG format.
Checking the Show Home menu button with Logo checkbox will show the Home button in addition to the custom logo.
Once a logo has been added it will display in your menu. To remove the logo click the Delete Image button.
Menu Headings
You can rearrange the order the menu headings are displayed in. You can do this by dragging the headings to a new position. Once you are satisfied with the new arrangement, you can check the box next to a heading to enable the new order or uncheck it to disable it.
Menu headings will only appear on the website if the a) have pages under that menu or b) have an External URL entered.
Menu Label lets you override menu headings by adding a specific label for it. For instance, to display Vehicles instead of Inventory, you can create a specific label for Vehicles.
External URL allows you to change the target page of a menu heading. Instead of taking you to an internal WebManager page, clicking on the heading instead takes you to a specific URL.
The Target column dictates whether clicking on that menu will open in your same browser tab or a new browser tab. Note that this setting only applies to menus that have an External URL.
Custom Menu
In addition to using the settings provided above, you can create your own personalized menu. You can enable up to 6 additional custom menu headings, however, be cautious about entering long Menu Labels, as there may be display issues if you have too many menu headings enabled with long labels.
To enable the custom menu, check the Enable Custom Menu checkbox.
Choose the position of your custom menu, either above the default menu or below the default menu.
Be sure to save your changes prior to customizing your custom menu, otherwise you'll need to come back to this page to enable the custom menu after designing it.
Click Design Custom Menu to customize your custom menu.
Note that you can preview your menu at any time during configuration by clicking the Preview Page Design button.
You can click Undo Changes at any time to revert any changes you've made as long as you haven't saved the changes.
Clicking Reset Page Design will revert your custom menu to the default.
The system automatically saves up to ten revisions to your custom menu, which can be accessed by clicking the Page Revisions button.
You can also manually save a revision by entering a Revision Name and clicking the Save button.
Clicking Preview will allow you to see that specific revision.
Clicking Revert will revert your menu back to that specific revision.
Clicking Delete will remove that specific revision.
Clicking Custom HTML Elements will allow you to see any custom HTML elements you may have had and allows you to copy the HTML code from them.
Clicking the History button will show you a history for the past 90 days for who edited your custom menu.
Your custom menu design is made up of any number of Content Rows which can contain from 1 to 4 columns, each of which can contain any number of content elements.
To change the number or spacing of columns, click Row Settings.
In the Layout & Columns section, you can choose the best layout for your website and select from various column options.
In the Container Settings, you can select from either the Accordion, Tabs, or Stacked display format. Accordion is a vertical stack of collapsible sections. Tabs are a horizontal alignment of panels with labels, allowing visitors to your website to switch between them. Stacked displays a vertical arrangement of content sections, often requiring scrolling to navigate.
Under Row Background, you have the option to personalize the appearance of each individual row by uploading a custom image of your choosing.
Under Position, you may choose between Parallax or Cover positioning. Parallax is a scrolling technique where the background of a website moves at a different speed than the foreground as the user scrolls down or up the page. Cover ensures that the background image covers the entire container, scaling it proportionally and potentially cropping parts of the image to maintain the aspect ratio.
Finally you can choose if your Attachment is a Fixed image or a Scrolling image.
Be sure to click Save when you've made your desired changes.
Click the Settings button for any column to customize that individual column.
Choose a column background image.
Under Position, you may choose between Parallax, Cover, or Contain positioning.
You can choose if your Attachment is a Fixed image or a Scrolling image.
Select your desired background color and opacity. Higher opacity is more opaque and less transparent, while lower opacity is more transparent.
In the Container Display, you can select from either the Accordion, Tabs, or Stacked display format.
Be sure to click Save when you've made your desired changes.
To add additional content to a row, click the Add button for the desired row.
Click the name of the element you would like to add.
Each element has different settings that can be customized. Click the Settings button for any element you would like to customize.
Elements can be dragged and dropped wherever you'd like them.
Elements and entire content rows can be deleted by clicking their respective Delete buttons.
Be sure to save your changes when you're satisfied with your customization.
Comments
0 comments
Article is closed for comments.