Cards Panel
Add a panel with up to 3 cards, each card contains text, a link and an image.
How to use
- Add a Heading
- Optionally add Quick-Nav Text to be picked up the Quick Navigation Bar/Progress Navigation Bar
- Choose a Background Colour: Orange, Pink, Purple, Teal, Yellow
- Add 1-3 panels, for each panel:
- Select a suitable image from the Media Library for the Panel Image
Recommend image is at least 840px x 1243px. The image can be any size or aspect ratio, and will be cropped and resized to 840px x 1243px automatically by a service called PXL. Find out how PXL crop and resize works. - Add a Panel Title
- Select a section or content item for the Internal Link (ignore the Use default link text checkbox), or paste the full URL for the External URL (please do not enter both)
- Select a suitable image from the Media Library for the Panel Image
- Optionally add a CTA button. Add CTA Text for the button text and either select a section or content item for the CTA Internal Link (ignore the Use default link text checkbox), or paste the full URL for the CTA External URL (please do not enter both)
Content Type Details
ID: 445
Name: Cards Panels
Description: A panel with up to 3 cards that can output a diverse range of information
Minimum user level: Contributor
Content Type Elements Details
Name | Description | Size | Type | Required |
---|---|---|---|---|
Name | The Name Element | 80 Characters | Plain Text | Yes |
Heading | This is the content title | 150 Characters | Plain Text | Yes |
Quick-Nav Text | This text will be used for the Quick Navigation Bar/Progress Navigation | 24 Characters | Plain Text | No |
Background Colour | Select the background colour for the component | N/A | Select Box (List: Cards Panel Colour) | Yes |
Panel 1 Image | Select an Image from the Media Library | N/A | Media | No |
Panel 1 Title | Add a Title | 50 Characters | Plain Text | No |
Panel 1 Internal Link | Select a section/content for an internal link | N/A | Section/Content Link | No |
Panel 1 External URL | Enter full URL including https:// for external URL, only enter this if you are NOT entering an internal link | 250 Characters | Plain Text | No |
Panel 2 Image | Select an Image from the Media Library | N/A | Media | No |
Panel 2 Title | Add a Title | 50 Characters | Plain Text | No |
Panel 2 Internal Link | Select a section/content for an internal link | N/A | Section/Content Link | No |
Panel 2 External URL | Enter full URL including https:// for external URL, only enter this if you are NOT entering an internal link | 250 Characters | Plain Text | No |
Panel 3 Image | Select an Image from the Media Library | N/A | Media | No |
Panel 3 Title | Add a Title | 50 Characters | Plain Text | No |
Panel 3 Internal Link | Select a section/content for an internal link | N/A | Section/Content Link | No |
Panel 3 External URL | Enter full URL including https:// for external URL, only enter this if you are NOT entering an internal link | 250 Characters | Plain Text | No |
CTA Text | Add text for a CTA under the Left Panel | 50 Characters | Plain Text | No |
CTA Internal Link | Select a section/content for an internal link | N/A | Section/Content Link | No |
CTA External URL | Enter full URL including https:// for external URL, only enter this if you are NOT entering an internal link | 250 Characters | Plain Text | No |