The Preview Cards module presents a group of pages on a shared topic, displayed in a familiar and recognizable style. A preview of page content is shown on each card to ensure that customers can efficiently guide themselves to their page of interest. This module is used to direct customers to content focus pages including specific webinars, case studies, white papers, and events. It should not be used to link to higher-level pages such as an events or brands overview page. Instead, use the Wayfinding Card module for these purposes.
Desktop
Mobile
Desktop
Mobile
Layout options
The Preview Card module consist of the following elements:
- Headline (optional)
- Tabs (optional)
- Image*
- Tags (optional)
- Card Header*
- Preview text (optional)
- Author (optional)
- Reading time (optional)
* required element
As an option, a headline can be displayed which appears as the first element in this module. Tabs can also be added to divide the cards into groups.
There are 2 layout options for this module: stack and carousel. Stack displays the cards in a grid on desktop and tablet, and in a single column on mobile. Carousel displays the cards in a carousel on both desktop and mobile.
Module headline
Character limit: 60
Card copy
All elements within a card (image, text, tags, etc.) are pulled from the content on the target page. Therefore, they are not directly editable within this module. The text should be truncated if they exceed the character limit.
For general copywriting guidelines, please refer to the Writing Rules.
Colorways
This module has six colorways. The colors shown within cards are non-editable to ensure consistency.
Use this module to present a group of pages on a shared topic, and direct customers to content focus pages including specific webinars, case studies, white papers, and events.
It should not be used to link to category pages such as an events or brands overview page. Instead, use the Wayfinding Card module for these purposes.
Examples of use
DO: Follow the character limit guidelines.
DON’T: Use this module to direct users to category pages or products.