Skip to content

This online publication is intellectual property of Apptus Technologies. Its contents can be duplicated in part or whole, provided that a copyright label is visibly located on each copy and the copy is used in conjunction with the product described within this document.

All information found in these documents has been compiled with utmost attention to detail. However, this does not guarantee complete accuracy. Neither Apptus Technologies nor the authors shall be held liable for possible errors or the consequences thereof.

Software and hardware descriptions cited in these documents might be registered trademarks. All trade names are subject to copyright restrictions and may be registered trademarks. Apptus Technologies essentially adheres to the manufacturer’s spelling. Names of products and trademarks appearing in this document, with or without specific notation, are likewise subject to trademark and trade protection laws and may thus fall under copyright restrictions.


Category Page Integration

The Navigation page component is used to enable category pages with product listing and filtering. The component must be present on all category pages including any category sub-pages.

Navigation structure

A navigation structure must be defined in the Experience app to use the Navigation page component. The initial set-up of a navigation structure is performed by Apptus personnel.

All category pages share a root URL. The root URL could be the site domain, e.g., or a specific path on the domain, e.g. The path on the domain, e.g. /products, must be provided as the variable navigationPagePathPrefix in the Script Initialisation.

It is highly recommended to include the Category navigation component on category pages. For more information, see Navigation Integration.


The Navigation page component emits an event, esales-active-category, whenever a category is selected. This event can be used to implement changes to the <title> element of a category page or to change banners on a page.


Category mapping

The URL of a page with the Navigation page component is used to automatically determine what content to present. Content includes page breadcrumbs, titles, selected category nodes, and products.

An identifier of the category is determined by subtracting the domain and the path specified in navigationPagePathPrefix from the current URL. For example, a category page with the URL would by default consider the path /products/ladies/jeans as the identifier. Providing a navigationPagePathPrefix with the value /products would result in that /ladies/jeans is considered as the identifier.

Each category in the navigation structure is connected to at least one identifier. The identifier is by default a natural path mapping of the navigation structure. It is possible to change the path mapping using the Experience app.

Ensuring that the initial category mapping is correct is a part of the navigation structure set-up, which Apptus personnel will assist with.

Last update: February 13, 2020