Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  1. Navigate to the site setup, following the steps here.
  2. Select the 'Haiku' option from the 'Add-on configuration' options
  3. You will see a screen with two options - 'Navigation limit' and 'Dropdown navigation':

    1. To change the number of items that are shown in the horizontal navigation, update the number in the 'Navigation limit' field and then save the form. This will update the horizontal navigation immediately.
    2. To to enable the dropdown menus for your horizontal navigation, check the box next to the 'Dropdown navigation' field, and then save the form. By saving the form, nothing will happen immediately. You will still need to define the options that are in each of the sections dropdown menus. To do this, follow the steps below once you have enabled the functionality:.

Choosing which items show in the dropdown menus

  1. Navigate to the section that you would like to add a dropdown navigation to, ensuring that you are logged in, and have the relevant edit permissions.
  2. Click on the 'Contents' tab on the left of the edit bar:
    Image Modified
  3. You will see a page that lists all of the content in the section that you are in.
  4. Click the 'Edit' button on the edit bar:
    Image Modified 
  5. When you land on the 'Edit' form, select the 'Settings' tab:
    Image Modified
  6. On the 'Settings' tab, you will see a field 'Dropdown navigation'. Beneath this field will be two boxes that contain the content of the section that you are editing. 
    Image Modified
  7. To add items into the dropdown menu, you will need to highlight the content you wish to show, by highlighting it and using the arrows to move them from the left box to the box on the right. You can reorder the items of the dropdown menu by highlighting an item in the box on the right and using the up and down arrows.
  8. Once you have moved the items that you want to show to the right, save the form. The items will now appear in a dropdown menu when a user hovers over the tab in the horizontal navigation:
    Image Modified

    Info
    titleBest practice suggestion

    For information on best practice when using drop down navigation across your website, please take a moment to read the article here: https://www.nngroup.com/articles/drop-down-menus



Filter by label (Content by label)
showLabelsfalse
max5
spacesHKB
showSpacefalse
sortmodified
reversetrue
typepage
cqllabel in ( "dropdown" , "navigation" , "menu" ) and type = "page" and space = "HKB"
labelsnavigation dropdown menu

...