A Call to Action (CTA) provides a small amount of text information, formatted as a link to influence users to interact with it.
Block setup
Elements to consider when building a Call to action:
Single CTA
Single CTAs can be added to a page.
Group of CTAs
Groups of CTAs can be added to a page. Only one theme (colour) can be chosen for all CTAs in a group.
Multiple CTAs
Multiple CTAs can be added to a page. It is recommended that they are added as a group within the same Block to keep sizing consistent. All CTAs can have individually chosen themes (colours).
Requirements
CTA supports both internal and external links, web and email links
- One link and at least one font type must be used:
- Small type: white, thin, capitalized
- Medium type: white, bold, capitalized
- Big type: yellow, regular, sentence case by default but can manually capitalize; colour is dependent on chosen theme
Section layout
CTAs can be added in any section width and the CTA will automatically be adjusted to fit the width of the section.
Block examples
Single CTA
- The CTA is placed within an Extra Wide width section
- White text is using Medium type; Yellow text is using Big type
- The default Black and gold (UWaterloo) colour theme has been used
Group of CTAs
- Three CTAs grouped together in a single Block within an Extra Wide width section
- a group of three renders as three across on a wide screen
- An example of Small, Medium and Large type, respectively
- The Grey (neutral) colour theme has been used
- Multiple CTAs placed within one Block in an Extra Wide width section
- Faculty colour themes will display when Big type is used, as well as when hovering over the CTA