Callout CTA

Callout CTA

You can add this component to bring attention to an important call-to-action (CTA).

It can be used either on a section homepage in the main content or supporting content column, and also the bottom left of a standard content page in the supporting content.

In the following example we're using a Callout CTA to promote a 'Get in touch' option on a section homepage.

The Callout CTA component on a section homepage

Fields to populate

You need to make sure that the following fields are populated when adding this component:

  • Title - you can add the title of the content
  • Text - the description of the CTA and what you would like the user to do
  • Link - the destination of the user when the CTA is pressed. Use the ‘insert link’ option to link another Sitecore page. Do not link to external web pages using this component.
  • Screen reader only description - An optional accessibility field to provide additional descriptive link detail for the reader. For example where links are 'Read more', 'See all' etc.

Component location

By default if used in the supporting content (side navigation) area of a section homepage the Callout CTA component sits at the top of the grey column when viewed on desktop and just above the footer of a page on mobile.

If however you'd prefer to have the Callout CTA viewed near the top of the page (under the Page Title) then you also have the option to add the component/rendering to the main content area of a page rather than place it in the supporting content column.

A callout CTA component used in the main content
Desktop Callout CTA

This particularly applies to mobile visitors whereby the CTA may be less visible at the foot of a page. Having the Callout CTA component in the main content allows you to make the CTA the primary focus on a mobile device.

The Callout CTA when viewed on mobile
Mobile Callout CTA