Guide
- Template: Landing page only.
- Section: various depending on the content to be displayed. Note that the size of the ring will decrease in response to the section/container size and the description text.
- Add custom block: Content Statistics Block.
- Type: Ring.
- Colour value: reflected in the ring, the number and % symbol.
Brand Dark (defaults to brand light background)
Brand Light (defaults to brand dark background)
Brand Supplementary (white background)
Brand Accent (white background).
- Item title: Not rendered on page.
- Item value mandatory: Only % values up to 100 may be entered. The number may have 1 decimal point only, for example, 50.9.
- Item description (WYSIWYG): Text displays to the right of the ring on desktop and stacks under the ring on mobile when meeting the breakpoint.
Example #1
Section: Full-width
Colour: Brand dark
By default the % symbol displays.
Example #2
Section: 3/4 centred
Colour: Brand light
Only % values up to 100 may be entered. The number may have 1 decimal point only, for example, 50.9.
Text here to complement the ring
This text can further expand on the key statistic that is being highlighted above. You could include further statistics, reference material or research information that supports or expands on the above statistic.
Example #3
Section: Halves
Colour: Brand supplementary
Compare 2 figures over time.
of people participated in the example project in 2017.
of people participated in the example project in 2023.
Example #4
Section: Thirds - works best without an item description.
Colour: Brand accent / dark / supplementary
Text here in a small container reduces the size of the ring on desktop.