Displaying subsections in your help center

What's my plan?

Flexible Hierarchies enable you to add subsections (sections in sections) to your help center knowledge base. You can use subsections to create more levels in your knowledge base's hierarchy, up to six levels deep.

Note: If you're using a theme customized before March 29th, 2019, you need to add code to your custom theme to enable subsections before you can add subsections to your help center, see Enabling subsections in your theme.

By default, the standard Copenhagen theme's section page template displays a list of each section's subsections. You can modify the theme's code to display subsections using other page templates or to change the look of the subsections lists.

You can only show the direct subsections of a section. You cannot show multiple levels of subsections.

This article contains the following examples:

• Showing subsections on category pages
• Showing sections and subsections as blocks

Showing subsections on category pages

You can update the template to display subsections below each section's articles.

To customize the category page template

In the category page template, insert the following block after <section class="section">:

{{#if sections}}
  <ul class="section-list">
    {{#each sections}}
      <li class="section-list-item">
        <a href="{{url}}">
          <span>{{name}}</span>
          <svg
            xmlns="http://www.w3.org/2000/svg"
            width="16"
            height="16"
            focusable="false"
            viewBox="0 0 16 16"
            aria-hidden="true"
          >
            <path
              fill="none"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-width="2"
              d="M5 14.5l6.1-6.1c.2-.2.2-.5 0-.7L5 1.5"
            ></path>
          </svg>
        </a>
      </li>
    {{/each}}
  </ul>
{{/if}}

Showing sections and subsections as blocks

You can customize the Copenhagen theme's category page template to display sections as blocks.

Similarly, you can customize the sections page template to display subsections as blocks.

To customize the category page template

In the category page template, replace the <div id="main-content" class="section-tree"> tag and its contents with the following snippet:

<section class="categories blocks">
  <ul class="blocks-list">
      {{#each sections}}
      <li class="blocks-item">
            <a href='{{url}}' class="blocks-item-link">
              <h4 class="blocks-item-title">{{name}}</h4>
              <p class="blocks-item-description">{{excerpt description}}</p>
            </a>
      </li>
      {{/each}}
  </ul>
</section>

To customize the sections template

In the sections page template, replace the {{#if section.sections}}> block and its contents with the following snippet:

{{#if section.sections}}
  <section class="sections blocks">
    <ul class="blocks-list">
      {{#each section.sections}}
        <li class="blocks-item">
          <a href="{{url}}" class="blocks-item-link">
            <h4 class="blocks-item-title">{{name}}</h4>
            <p class="blocks-item-description">{{excerpt description}}</p>
          </a>
        </li>
      {{/each}}
    </ul>
  </section>
{{/if}}