Navigation

ThemeWare® Knowledge Base

Highlighting a category in the navigation

With ThemeWare® you highlight a single category in the top navigation with colour – for example your sale, new arrivals or promotion category. This way you deliberately draw your customers' attention to the menu item that matters most to you.

Note: A category is only highlighted if the "Highlight category" custom field is set to "yes" for it. The theme configuration only controls the appearance of the highlighting.


Requirements

  • a category you want to highlight in the top navigation
  • the "Top navigation" layout type in the header (the highlighting does not apply to the "Entry point main navigation")

Step 1: Define the appearance of the highlighting

"Theme Manager" => your ThemeWare® theme => "Header" tab => "Top navigation" block => "Link (highlighted)" section

Define here how a highlighted menu item should look – for example via the "Text colour (highlighted)", "Background colour (highlighted)" and "Icon colour (highlighted)" (each also for the @hover and @active state). Save your changes.


Step 2: Highlight the category

"Catalogues" => "Categories" => select category => "Custom fields"

Set the option in the "Highlight category" custom field to "yes" and save the category.

Note: You will find the custom field in the category editor on the "General" tab. Repeat this step for every additional category you want to highlight.


Result

The selected category now appears in the chosen look in the top navigation. If the highlighting does not show up, clear the Shopware cache once.

ThemeWare® Tip: Use the highlighting sparingly – a single highlighted menu item catches the eye far more than several at once.


Further information

You can find all configuration options and the custom field in detail in the ThemeWare® manual:

https://docs.themeware.design/additional-features/extensions/highlight-category

ThemeWare® Manual ⇒ Highlight category

Last updated on

This page online: /en/wiki/knowledge-base/tutorials/header/highlight-category-in-navigation · ThemeWare® Service Portal, service.themeware.design