Setup

Navigation



To give your customers easier access to particular pages and products catalog, the webstore content should be well organized. This can be done by creating webstore navigation.

In Sana Admin you can create three types of menu: Main, Sitemap and Footer. The main menu is located at the top of your webstore and this is how customers are able to navigate to all areas of the webstore.

To create a webstore navigation in Sana Admin click: Setup > Navigation & search.

The table below provides description of the tabs:

Tab Description
Menus Create webstore navigation. Three types of menu can be created: Main, Sitemap and Footer.
Facetted filters Configure facetted filters. Using facets customers can filter the products catalog, for example by size, color or brand, on the product list and search results pages.
Search & results Configure search settings. Sana Commerce provides search settings that allow searching products by different keywords, phonetic representation of the keywords pronunciation, to narrow or broaden search results, search by a part of the word.

For information about facetted filters and search settings, see 'Search'.

To create webstore navigation:

Step 1: In Sana Admin click: Setup > Navigation & search > Menus.

Under the Menus tab you can create three types of menu: Main, Sitemap and Footer.

Step 2: Expand the necessary menu and click New item to create a new menu item.

Creation of the menus is completely the same, regardless of its type.

The only difference is that in the Main menu section you can also enable/disable the breadcrumb and change the main menu presentation. Main menu is also used for the breadcrumb and on the product pages for linking a product to the related main navigation item.

When the Breadcrumb option is enabled, the path on where a customer navigates within the webstore will be shown under the main menu.

Use the Multi-column presentation option to change the presentation of the main menu in the webstore. If Multi-column presentation is enabled, the main menu of the webstore will be presented in multiple columns, if disabled - in one column.

If you use Multi-column presentation for the main menu, you can also show the View more link in the main menu. It is shown under the navigation items of the third level and refers to the same link which is specified for the navigation item of the second level.

Item (product) categories can be imported from your ERP system into the main menu to automatically build your webstore navigation. For information about how to import item categories from your ERP system, see 'ERP Integration'.

The tables below provide the description of the menu item fields.

Basics

Field  Description
Title  Enter the menu item title. It is shown in the webstore menu.
Link  Link the internal page or external URL. To link the internal page you can search for it by title or URL.
You can also create a blank page that will be automatically linked to the menu item and fill it with content later on.
Select the Open in new tab check box to open the linked internal page/ external URL in a new tab or leave it empty to open the page in the same tab.

Advanced

Field Description
Item visibility Set visibility of a menu item. Enable Item visibility to make the menu item visible in the webstore or disable to hide it. Invisible menu items are of a grey color with the icon .
Image Add an image to a menu item.
When you add an image to a parent menu item and link an internal page or external URL to the image it will be used as navigation item in the main menu if Multi-column presentation is enabled.

When child menu items have images and to the parent menu item the page that contains the Child menu items content element is linked, then these images will be shown on the linked page as blocks by three in a row. A customer can click on the image to open the related page. Image link for the images added to the child menu items in the navigation is not used.
For more information about Child menu items content element, see 'Web Pages'.

Customer segments Using customer segments you can create personalized content. By assigning a customer segment to the menu item you can show any menu item to the target audience. This means that only those customers who are in the customer segment will be able to see the menu item.
For more information, see 'Customer Segments'.
Additional CSS class or space-separated classes You can add additional CSS class or space-separated classes to the menu item. By adding custom CSS classes to the menu items you can change the style of any individual item. For example, you can change the color of the menu item or use different dimensions for the menu item images. To change the style of a certain menu item you can add a custom CSS class and then add the necessary style using HTML injections in Sana Admin, a design pack or Sana Commerce SDK.

You can change the order in which you want menu items to be shown in the menu by dragging and dropping them into the order you want. You can also change the levels of menu items, either make it as a parent item or as a child menu item to the one of the higher level. Main navigation can be of multiple levels. If you need to add a subitem hover over the menu item to which you want to add a subitem and click New subitem .

From the menu items list you can edit or delete any menu item. You can also change the linked page, view it in the webstore or edit the internal linked page (except system pages) directly from the menu items list. Hover over the menu item to see the Link, Edit and Delete buttons.

Translate a menu item

You can translate any existing menu item if your webstore is multi-lingual. Hover over the menu item that you want to translate and click Edit. From the language dropdown select the language you want to translate the menu item to. When the language is selected the menu item page is presented in two columns. The first column holds the menu item content in the default language (English) and it is not editable, while in the second column you can provide translation to the menu item title. For the translated menu item you can also inherit the linked page (internal page or external URL) from the source menu item or redefine it as well as set visibility for the translated menu item and change the image or leave the Image field empty. If the image for the translated menu item is not specified, the default one from the source menu item will be used.