Card Widget Overview

The Card widget is a core layout component used across the site to present structured content in a consistent, reusable format. It supports multiple template variations while relying on a shared set of fields and behaviours.

This section is intended to help designers understand which card templates are in use, how they differ visually, and which fields drive those differences.

Core Fields

These fields are common across all Card widget templates:

  • Title: The primary text element of the card. Typically used as the visual anchor and often linked.
  • Body / Description: Supporting copy that provides context or additional detail. Length may affect card height and layout consistency.
  • Image: Optional visual element displayed at the top of the card. Aspect ratio and cropping are template-dependent and should be considered when designing variations.
  • CTA Label: The visible call-to-action text (e.g., “Learn More,” “View Details”).
  • CTA Link: Destination for the CTA. Can be internal or external and is a key interaction point.
Sitefinity Card widget edit panel showing fields for heading, text, image selection, and primary action settings including CTA label and link options

Design Notes

  • All Card templates share the same foundational structure, enabling consistency across the site.
  • Visual differentiation between card types is achieved through template styling rather than unique content fields.
  • Legacy templates that replicate card behavior should be phased out in favor of Card widget templates.