Berlin - Components | Highlight

Last modified:

"Highlight" allows us to create and highlight content to make it aesthetically different from the rest of contents displaying on the screen.

Highlighted text is added within the screens by default (See here) and pop-ups (See here), but it can also be added inside other components (for example, a Highlight, an Accordion, a Row, etc.).

This component is included in the group of "Text" components.

Image 6988

Setup process

1.When we add a Highlight, a "Text" component is inserted inside by default. Then we can add more components if we want. Access the "Add" tab and you will see that you can "Insert inside" the panel many other components like images, audios, videos, rows, etc.). It is important to make sure we have selected the Highlight component because we can insert components inside, but we have also the "Insert after" option.

2.  This property allows changing the type of panel:

  • Slanted to the left
  • Slanted to the right
  • Standard. It does not have any slanted side
Show headline

It allows to show or hide the default headline of the highlighted content.

Background colourThis property allows adding a background colour for the highlighted content.
WidthThis property allows changing the space occupied by a component inside a central column of contents. This component occupies 100% of the space by default. Text size can be reduced to other preset percentages or can
be displayed in full-size. For some quote styles, "Full" width makes quotes lay over the central column.
AlignThis property allows placing the component on the right, on the left or on the centre of the central column where contents are shown. It can only be used when applied"Width" is less than 100%.

3. Set up Highlight contents like the headline, texts, and other components.

4. Optionally, you can add an upper icon to the highlighted content. In order to do so, select Highlight, go to the “add” tab, “Insert inside”, and select “Highlight icon”.

Image 6989

5. After adding the icon, click on it, go to properties, and you will be able to choose some preset icon or add a customised icon (if preferred). Icon size should not exceed 125x125px.

Image 6990

Is this article helpful for you?
© 2023 Netex Knowledge Factory. All Rights Reserved. Disclaimer | Privacy policy | Cookie Policy.