CTA: Text with Image

This component is useful for introducing topics or providing supplementary information, with an option for users to navigate deeper into content.

Usage Criteria

This component is flexible and can be used for introducing larger topics or sections with a link so users can dive deeper into the content. It can also be used to display supplementary content in a way that looks more visually appealing. This wide range of uses are made possible by the many configurable sizes and shapes this component offers.

Do's and Don'ts

• To maintain consistency, avoid mixing different shapes when more than one of this component is present on a page (ie. using circles and squares interchangably). Using both types can still work, but have dividing content in between to separate them. 

Design Notes

This component, similar to CTA: Full Width Image, can be good for highlighting brief information. Decide which component is better to use based on the structure of the page (if more visuals are required) or the content (if it is the main content of the page). In both these cases the CTA: Text with Image is more suitable. 

Configurable Options

This component must be configured with a Target URL. For the layout, the Image Position, Image Size, and Image Shape can be configured.

Developer Notes

Designer Notes