Box CTA

The Box CTA component is a text-only call to action box. It has header and sub-header text and a link. It is only used inside a Grid Container component.

A screenshot of a Box CTA component shows a green rectangle with white text. Thin, all caps text at the top reads: — Figure 1: Example of a Box CTA.

Component Information

Benefits

A Box CTA can be used to drive visitors to another webpage or story page.
The Box CTA provides more room for text than the Grid Ad component.
As a text-only component, it provides an option for a CTA when a background image is not appropriate or not available.
The solid color styling provides a way of visually breaking up a webpage design when placed among other components, such as images. It is helpful to give visitors’ eyes a place to rest. The lack of image can sometimes call attention to the content.

Component Options and Limitations

The Box CTA component is used only in a Grid Container component inside a small cell.
Header text displays at the top of the cell. This text is smaller and lighter in color than the subhead text.
The sub-header text displays at the bottom in a larger bold font.
An optional arrow icon may be added that displays to the right of the header text.

Guidelines

The Box CTA is best used when more text is wanted with a call to action, but no background image is needed.
The Box CTA text and link are added and edited directly in the component in Pages.
The Header text may be longer as it displays in a smaller font size, leaving room for additional lines of text.
The Sub-Header text should be short, as it is displayed as a bolder and larger font.
The Display Arrow icon is found in Pages under the Component Options > Advanced Styling panel.
Be sure to check how the Box CTA looks at various screen sizes to make sure the length of text works across all devices and sizes.

Header (single-line text)

Text that displays at the top of the Box CTA

Sub-Header (single-line text)

Text that displays at the bottom of the Box CTA
Sub-Header text is larger and more bold in comparison to Header text

CTA Link (general link)

Adds a link URL to the Box CTA
Description/Link text does not display

Display Arrow Icon (checkbox)

Located under the Design tab in Page Builder.
When checked, the Arrow icon displays to the right of the Sub-Header text.

Related Components

Grid Container — Container with a variety of cell variants
Grid Ad — Allows for calls to action with text and image

Live Example

Demo page: Grid components

Frequently Asked Questions

No, it is a text-only CTA.

It is only used inside a small cell of a Grid Container component.

Instructions for Use

In Page Builder:

Add a Grid Container to the page where the Box CTA component is needed.
Select a Grid Container variation that contains a small cell space.

In Page Builder:

Select a small cell in the Grid Container for the Box CTA.
Click on the placeholder of the cell. Select Box CTA from the Components panel.
In the Assign content item window:
1. To use an existing Box CTA component, choose the desired Box CTA component from the page’s Data folder and click on the Assign button.
2. To create a new Box CTA component, click on the “+” create new icon to the left of the Data folder, select Box CTA, type in the Box CTA name and then click on the Assign button.
Add or edit the text and link details by clicking on the appropriate field in the Box CTA.
To add or remove the Arrow icon, select the Box CTA and then click on the Display Arrow icon checkbox in the Advanced styling area of the design portion of the Component Options panel.

Documentation updated: May 28, 2026

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