Components

An accordion is a series of expandable vertical panels, designed to save space on a page by hiding content and revealing it as required.

Allows for important links to be attached below the hero banner

Buttons provide users with the ability to submit an action.

Callouts are a snippet of information that draws attention to important content.

Teaser blocks that link to external or internal content with many variations

Content blocks allow users to select from multiple actions related to a topic or task

Plone is able to embed custom HTML directly into a page including maps, plots and social media feeds

Footer links, sub-menu, AOC and social media links

Easy to use form builder to email or save data collected

Global alerts appear at the top of every page in the site and can be dismissed per user if they acknowledge the message

The grid component allows you to have a collection of related content that is entered by the user, often linking to other content.

A hero banner should appear at the top of page to deliver an important message or call to action. However it shouldn't be used to replace the a title on content pages

In-page alerts are used to contextually inform users of important information or status of an interaction.

Use the in-page navigation to provide quick access to the content within a page.

Use list links to present users with a list of suitable next best actions or content. Link lists can surface related content or options for a user to also explore based on the current context.

Display a list of results to users surfacing key information. Available as both Listing Block and Search Block variations

The listing block allows you to list content from other parts of your site on your Page using pre defined criteria.

How to manage your information architecture of your site

Customisable search pages powered by elastic search

Flexible layout component that groups content and components together providing consistent vertical spacing.

Tables assist users to scan and compare data.

Use tabs to organise content and allow users to move between related content sections or views at the same level of hierarchy. They allow users to focus on specific content whilst remaining clear on the overall context of the screen.

Use tags to help label or categorise content for users using keywords or phrases. They can also be interactive and help users search for and navigate to content quickly and easily.