Go to the new documentation
EN IT

Add more levels to the department menu

In the Respy Wide template, departments are shown in the left menu with two levels, top-level departments and their sub-departments. Below is how to show more levels.

Before you continue

Changes to template source code require some knowledge of HTML and CSS.

Note

The changes indicated here refer to the original Respy Wide template. If you have a modified Respy template or use another custom template, the instructions may be slightly different.

Add one or more levels to the department menu

  1. Go to the Website section in the admin.
  2. Go to the Design subsection.
  3. Click Customize on the template to modify. The template editor will open.
  4. Click HTML and CSS.
  5. Click includes and then navigation.html. The file source will open in the middle of the page.
  6. Find the following line: 
    <li><!-- .show name --> Televisions <!-- .end --></li>

    and replace it with the following:

    <li>
  <!-- .if not childDepartments --> <!-- .show name --> Electronics <!-- .end --> <!-- .end if -->
  <!-- .if childDepartments -->
  <a href="[% name.href %]" data-design-open>[% name %]</a>
  <ul class="children">
    <!-- .for childDepartments -->
    <li><!-- .show name --> Televisions <!-- .end --></li>
    <!-- .end for -->
  </ul>
  <!-- .end if -->
</li>
  7. If you want to add more levels, repeat from step 6.
  8. In the Save... menu at the top, select Save to save the file.
  9. Click the monitor icon at the top left to see the changes. If it looks good, then click Save at the bottom left.