Add Custom Sections

You can add your own sections on the home page by using the topicgroup element.

Additional, custom sections can be used to introduce more contextual information about your Heretto Deploy Portal like:

  • your company description

  • the purpose of your Heretto Deploy Portal

  • icons

  • videos

  • div containers that you can use for customizing displayed modules


By applying the outputclass attribute to DITA elements in the topics within the topicgroup, you can style them freely with the CSS code. Each outputclass value is rendered as an HTML class that can be used as a CSS selector. To learn more about Heretto Deploy Portal styling, refer to Customize the Content Portal Style.

Additional sections are rendered below the tiles section and above the footer of your home page.

There are no requirements related to the placement of additional sections. If they do not have to be included in the navigation, you can put them anywhere in the sitemap. However, we recommend putting them either at the beginning or at the end of your sitemap to keep its structure neat and tidy.

  1. Open the sitemap connected to your portal.
  2. Right-click the sitemap element and append it with the sitesection element.
    Figure 1. Appending Operation
    appending sitemap element with sitesection element
  3. Right-click the sitesection element and append it with the topicgroup element.
  4. Hover over the topicgroup element and click the gear icon to open the attributes tab.
    1. To ensure your additional section is not displayed in the search results, set the search attribute to no.
    2. To ensure your additional section is not listed in the navigation, set the toc attribute to no.
    Figure 2. Properly Set Topic Group
    properly set topicgroup element
  5. Right-click the topicgroup element and append it with the data element.
  6. Hover over the data element and click the gear icon to open the attributes pane.
    1. Fill in the name field with the topicgroup-name value.
    2. Fill in the value field with a unique meaningful value that will represent your section. This value will be later used for translation purposes. Do not use spaces or special characters.
      <data name="topicgroup-name" value="about-us"/>

      By default, the title of your section will be displayed on the home page as label.your-value. Our example will be displayed as label.about-us. To change the title of the newly created home page section, see Localize Custom Sections.

  7. Append your topicgroup element with topics that contain contents that you would like to display on the home page.

    If you want to localize your content, add a map reference instead as you can only localize maps. If you do not localize content, it is fine to add topic references instead.

    The example below shows how to add an additional section with contents based on two topics: our-values.dita and see-more.dita. For your implementation, use as many topics as necessary. The example assumes that you already introduced two tiles to the sitemap: “Site Section 1” and “Site Section 2” to show you how additional sections are placed with reference to the tiles. To learn more about adding tiles, see Add Section Tiles.

    <!-- A site section that renders additional blocks of content on the home page -->
        <topicgroup search="no" toc="no">
    	<!-- Introduces a "topicgroup-name" parameter with an ID "about-us" -->
            <data name="topicgroup-name" value="about-us"/>
    	<!-- Topics with content that is going to be displayed on the home page -->
            <topicref href="content/our-values.dita"/>
            <topicref href="content/see-more.dita"/>

Go to the home page of your Heretto Deploy Portal and refresh it to see the newly created section.