Landingpage: Sidebar

Each article and most of the landingpages come along with a sidebar. The sidebar shows additional information in the right column of a page.


1 Creating the sidebar in the process of creating and designing the landingpage
2 Creating the sidebar separately, by clicking on Content - Add Content
3 Filling in contents
4 Publishing


The sidebars shown alongside with articles are always those which are assigned to the respective menu item. So if an article is "haven-categorized "Ecology" and therefore appears under the Ecology menu, the ecology sidebar will be shown with the article.

Whilst you don't have to do anything in order to assign a sidebar to an article, you will have to create new sidebars or assign existing ones to the landingpages you create.

There are two ways of creating sidebars:

  1. In the process of creating and designing the landingpage

  2. Separately, by clicking on Content - Add Content


1 Creating the sidebar in the process of creating and designing the landingpage

a) Click on grid, open the container section on the right and choose the sidebar container in the sidebar section. Move it into the landingpage grid on the left and drop it into the last blue line.

The sidebar container will be locked on the right side of the grid. This sidebar container is only a placeholder for the sidebar. That's why it says: Sidebar not found or none set:

b) In the next step you will have to create a new sidebar or to assign an existing one to the landingpage. To do so, hover the mouse over the empty sidebar container and click on Edit.

c) Click on Create Sidebar in the following sidebar dialog window:

Once created, sidebars can be assigned to more than one landingpage. Hence, they are - so to say - reusable.

To assign an existing sidebar, start typing its title into the respective field. The autocomplete will help you find the correct one.

d) If you have chosen Create Sidebar, you can enter the Title, pick the correct language and Save. Choose a very specific title, for instance "sidebar-name of dossier" or "sidebar - category name". The title will not be shown to users, but serves for your orientation. Please note: Sidebars will be published automatically.

The second way of creating a sidebar is:

2 Creating the sidebar separately, by clicking on Content - Add Content

Click on Content - Add Content - Sidebar.


Then execute the operations described in d)

3 Filling in contents

After having saved the sidebar node, click on Grid. As landingpages, sidebars are structured by containers and boxes, too. However, sidebars have only one (one-column) container which is already preset. That's why you will just have to add the desired boxes.

Principly, there are the same boxes as used on landingpages: (Technically) all boxes can be used either in the main content column(s) or in the sidebar though it doesn't make much sense to place, for instance a calendar box, on the left.

4 Publishing

Before you publish, please check and proofread your sidebar. You can preview it by clicking on the eye-symbol. In order to publish, please click on the orange PUBLISH-button.

Afterwards close the browser tab in which your sidebar was opened.

You will be back in the create/edit-sidebar dialog. 

Assign the sidebar to the landingpage by typing its name in the autocomplete line as described here.

Now choose a color for your sidebar by picking one from the boxstyle list. The color you pick should be in accordance with the hbs-styleguide which defines certain colors for associated topics resp. institutions. As a rule, the sidebar color should be the same as the one of the associated menu item. So if the sidebar belongs to an Ecology-landingpage it should be dark-green because dark-green is the color associated with Ecology and dark green is also the color of the Ecology menu.

Please note: All boxes in a sidebar should be the same color.