Digital Experience Studio > Website Technology > Sitecore CMS > Sitecore Component Guide >

Text CTAs

Text CTAs

The Text CTAs component is used to display one to three links as calls to action. These appear on a full-width gray background in a main body content area of a page.

Screenshot of three text CTAs, including "Learn about MSU," "Explore our Academics," and "Discover our Research"
Figure 1: Example of a Text CTAs component, shown at the bottom of the MSU homepage, above the footer. This component has been styled with bold eyebrows (text that displays over the call to action) and bold link text, with arrows.

Component Information

Benefits

  • The Text CTAs component adds a gray block to a page to highlight one to three links.
  • Text CTAs is a full-width component that is used in a main body area of a page.
  • This block’s gray background works well as a divider between white background components or next to green background components.

Live Example

Template Data

Eyebrow: (single-line text)
  • The eyebrow is text that displays above the CTAs in the left corner.
  • Eyebrows can be edited in Page Builder, Content Editor or Explorer.
  • Eyebrows can be styled in Page Builder. Font options include regular (default, blank choice), bold, italics or bold with italic.
  • Eyebrows are optional.

Design Tab — Page Builder only:

Manage Items
  • Add new CTA
Eyebrow Style (drop-down menu)
  • This setting changes the font styling of the eyebrow text.
  • Options include regular (blank), bold, italics or bold with italics.
Horizontal Line (checkbox)
  • When checked, a small green horizontal line will appear under the eyebrow text.
  • The line will only appear if there is text in the eyebrow field.
Link Style (drop-down menu)
  • This setting changes the font styling of the link text.
  • Options include regular (blank), bold, italics or bold with italics.
Use Green Button for Links (checkbox)
  • When checked, the text links will display as green buttons with white text.
Use Arrow Icon for Links (checkbox)
  • When checked, an arrow icon displays after the CTA link text.
  • The “Use Green Button for Links” option overrides this setting. If the Green Button option is checked, arrow icons will not appear, regardless of the setting for this checkbox.

Frequently Asked Questions

No, Text CTAs only display up to three links.

No, the Text CTAs component is only for displaying CTA links.

Instructions for Use

In Page Builder:

  1. Select the page in the content tree.
  2. Click “+” button in a Placeholder box in the main body area of the page.
  3. Select Text CTAs component from list.

Alternate method:

  1. Click Components tab at top of content tree.
  2. Locate Text CTAs component.
  3. Drag the Text CTAs component to any empty placeholder area in the main body area of the page.

Add an existing or new data source:

  1. To create a new Text CTAs data set:
    1. Select the page’s Data folder.
    2. Use the “+ Create new” link to make a new Text CTAs component.
    3. Type in a name for the Text CTAs component and hit enter.
  2. To use an existing Text CTAs data set:
    1. Select the site’s main Data folder.
    2. Expand the Text CTAs folder.
    3. Select an existing Text CTAs component from the folder.
    4. Click on the Assign button.

In Page Builder:

  1. Select the placed Text CTAs component.
  2. Select the desired component options under the Advanced styling section. Options include:
    1. Eyebrow Style
    2. Horizontal Line
    3. Link Style
    4. Use Green Button for Links
    5. Use Arrow Icon for Links
  1. Navigate to the Manage items section of Component Options.
  2. Click on “+ Add new” to add a CTA to the component.
  3. Optional: Change the CTA name. This does not display but is for system use.
  4. Change the order of the CTAs by clicking on the CTA, holding and dragging it up or down.
Note: If more than three links are added, only the first three will display.

While most work on Text CTAs is best done in Page Builder, these tasks may also be done in Content Editor:

  • Rename the Text CTAs component and CTAs.
  • Edit the Text CTAs Eyebrow text.
  • Add or remove a CTA.
  • Edit the link details on a CTA.
Screenshot of a Text CTAs component on the Admissions website, with CTAs to Request information, Contact your counselor and Learn how to apply
Figure 2: Example of a Text CTAs component, shown at the bottom of the Admissions homepage, above the footer. This component has been styled with no eyebrows and regular link text, with arrows.

 

Screenshot of Text CTAs component on the Brand Studio website, with CTAs to Discover Brand Strategy and Download logos, design elements and templates
Figure 3: Example of a Text CTAs component, shown at the bottom of the MSU Brand Studio homepage, above the footer. This component has been styled with no eyebrow and bold link text, with arrows.

 

Screenshot of Text CTAs component with CTAs to Access additional resources and buttons for MSU Brand Studio and University Communications
Figure 4: Example of a Text CTAs component, shown at the bottom of a Digital Experience Studio homepage, above the footer. This component has been styled with bold eyebrow and bold link text, with green buttons.

Tool Use Guide

 

Documentation updated: June 12, 2026

Is there an issue with this documentation? Report it here.