Skip to content
Component Guide

The Row of CTAs component allows administrators to add multiple call-to-action (CTA) buttons side-by-side. This component is useful for cases where multiple links are needed beneath a block of text or any other component within the system.

This component offers a variety of configuration options, divided into the following categories:

Settings This section contains general settings applicable across all components within the system:

  • Hide on Mobile/Tablet/Desktop: Pick whether to hide, or show this component independently on mobile, tablet, and desktop resolutions via a set of three checkboxes.
  • Desktop/Mobile Padding: Adjust the top and bottom padding for both desktop and mobile views.
  • Section Background Colour: Choose a background colour from a pre-configured list of brand colours.
  • Section Width: Set the width of the section.
  • Section Alignment: Control whether the CTAs are aligned left, right, or centred within the section.
Animation Administrators can select from seven entrance animation options for the component:

  • None
  • Slide in from the top
  • Slide in from the bottom
  • Slide in from the left
  • Slide in from the right
  • Fade in
  • Grow in
Content Contains a single repeater field within which, any number of CTA rows may be introduced. Within each row, administrators may configure the button’s colour, style, and populate a link field where details such as button label, and url may be set, as well as determining whether to open the resultant link within a new tab, or within the tab being browsed.

 

You can view examples of the Row of CTAs component in various styles and with different entry animations here.