Infographics component

The component is available in most content types: Programmes and Programme subpages, Hubs, Articles, Study options, Open university and Summer courses, Services, News and Events.

The image below shows the basic fields for the component. Use the Theme field to select the colour for the component, and select which variant you want to create. 

Two variants of the same component

Creating the component, it was clear there are different use case to the same kind of information. It was decided to create two variants. Both use the same fields, but they look a little bit different.

Note that the variant show the fields differently!

Component variant 1: Curriculum

This variant is specifically designed for visualizing degree structure. See the example below for the fields available for the component and and example of them in use. Remember that you can leave some fields empty, and they will not be shown in the final component layout.

• Only the Curriculum variant shows additional Info text field below the infographic table cells.
• Use the link field to direct the visitor lower on the page using anchor links.
• Use blue background colour for the component for degree structure visualization (Select Brand 2 in the Theme field)
• Note that the cells change size responsively, i.e. the width of the cells scales up or down according to the device and screen or the visitor.

Component variant 2: Ranking

The other variant of for showcasing important numbers such as rankings. It can of course be used for other figures as well. This variant is taking a wider space on a page than the curriculum variant.

• You can use the component with or without the first cell separated to look different. Below the example has the field "Use first value as a "total" sum" selected
• Do NOT use the Info text field as it is not designed to use with this variant
• You may add links or leave the link field empty. The example below has both versions, some fields without link, some with.