Grid of Cards

Add photos to your links for additional color on your pages.

The Grid of Cards component allows you to place links on a page that appear as a card with a thumbnail and a description of where the card will take you.

This component is particularly good for highlighting and displaying programs and initiatives. These cards can be used to link to external and internal links, as well as documents. This is also an easy way to integrate some visual interest to the page.

Good to know

• These components are best used sparingly as they take up a lot of space on the page, and overuse can lessen their impact. Best practice is to limit the number of cards, 3 is optimal, but 6 is still effective.

• This component is unique in that it gives you the ability to add a "lightbox" link, in addition to external and internal links. A lightbox link essentially pops the link out at the user, keeping them on the page. It's excellent for featuring graphics or videos. You can see examples of lightbox images being used on the site through the links below:

  • Resilient Boston Harbor (images pop out in grid of cards components)

  • Bay Village Neighborhood Park (check the videos section to see the lightbox used with video)

• You can change the color of this component’s background to white, gray, or blue by adjust the "component theme" field.

Have feedback for this page? Let us know!