Cards

What is it?

The Cards widget allows editors to display a responsive grid of equal-height content cards on a page. 

Select your preferred column count and add as many cards as needed. Content automatically wraps into new rows while maintaining consistent card widths throughout the grid.

The Cards widget is available on the following content types:

• Advanced Page
• Feature Story
• News
• Unit Landing Page

How do I use it?

Start by adding a new section to a page or by using an existing section.

1. Click the + button to add a widget to a section
2. In the menu that appears, select Cards
3. Fill out the widget fields:
   1. Intro text: Pptional text displayed directly above the card grid)
   2. Columns: Set the number of display columns (1 to 6). Note: Columns automatically adapt for smaller screens.
   3. Individual cards: Add the content elements for each card:
      1. Image (center cropped to a 3:2 ratio)
      2. Content (body text)
      3. Button Link & Button Style 
4. Click Save

Design considerations

• Bottom-Aligned Buttons: Buttons automatically align to the bottom of each card, maintaining a clean horizontal visual alignment across every row regardless of text length.
• Linked Headings: To use a linked heading (similar to standard Folwell callouts), add your heading text and hyperlink it directly inside the Content text field.

Example pages

• Give to the Max Day | CSE Student Teams & Hands-On Learning

Feature Comparison: Cards vs. Folwell Equal Height Callouts