In-page navigation for information pages

This manual is no longer in use. Instead, you can find guidelines and instructions for working on gu.se, the Student Portal, and the Hotel Portal in Redaktörsmanual Drupal.

Description

An information page should be the final destination of a visitor, which means it can be long. This means the visitor may need to scroll a lot. You can help the visitor by grouping the content and creating an in-page navigation, or anchor links.

The links are to the left of the text but do not follow when the visitor scrolls to the page as it was originally intended. This has changed as there is a problem with accessibility because in some cases the menu runs on top of the content of the page.

The in-page navigation gives the visitor the opportunity to click on the link of interest so that the visitor jumps further down the page. In-page navigation is automatically generated when there are five or more H2 headers. In layout builder you can get H2 headers by choosing formatting "Heading 2". This formatting can be found in the "editor" component of the "information" section for information pages and in the "text box" component of other sections (1-column, 2-column, etc.).

Do as follows:

In this example, we describe how to add five H2 headings to an existing information page.

When you have an information page open, within the text editor you need to be in the “Body text” field.
1. Group the content and create a heading for each section.
2. Format each heading with the “Heading 2” text format from the “Text format” drop-down list.
3. Keep in mind that the heading should describe the subject of the text and not be too long, as this can make it difficult to read the links in the in-page navigation.
Once you’ve formatted your headings, save the page as a draft and check its appearance in the Display tab.
Here’s an example of a page with in-page navigation where the H2 headings can be seen to the left of the text.

Drupal, instruktioner för redaktörer

In-page navigation for information pages

Do as follows:

Related content