Skip to main content

Call to Action Component

This component is used to bring extra attention to certain links on the site through the use of icons, bordered boxes etc.

Example Call-to-Action
This is a sample Default full width Call-to-Action with linked headline.
Side-by-Side CTA One
This is Box 1 of two for the Side-by-Side configuration.
Side-by-Side CTA2
This is Box 2 of two for the Side-by-Side configuration.
Full-Width Dual CTA
CTA #1 CTA #2

Component Configuration Tab

cta component dialog

Layout

This drop-down lets you choose between one CTA that stretches the full width or two that sit side-by-side.

Link Type

There are 2 options for link type:

  • Default - Headline text is linked
  • Dual CTA - Headline is not linked but up to two links are displayed below

Register Style

This option displays an alternate style mainly used for Registration promotions.

No Border

This style renders the CTA without a border, making it look better when placed inside an Accordion.

Back to Top

Layout Options

Default (full width stacked)

Here's how a Call-to-Action renders in full width:

Full Width Call-to-Action
Full width Call-to-Action with "Location" icon and linked headline.

Side-by-side (Two items)

Here is how Side-by-side renders. Note that when choosing this option, you must fill out additional fields in the "Box 2 Content" tab to render the second box.

Box 1 Headline
This one has the "Preferences" icon and local link type.
Box 2 Headline
This one has the "Bank" icon and external link type.
Back to Top

Link Types

Call-to-Action boxes can have two different "Link Types":

  1. Default (linked headline text)
  2. Dual CTA (two links after body)

Default Link Type

Default Link Type
Default link type makes the headline the link.

Dual CTA Link Type

For this option do not fill out Box 1 Headline Link URL or Box 1 Headline Link Title as they are ignored when rendering.

The fields in the section labeled Box 1 CTA Links (dual-cta option only) need to be filled out to create the link or links for this style. You do not need to fill out  CTA 2 link information if both aren't needed.

Dual CTA Link Type
Dual CTA link type adds two text links below the body text.
Dual CTA Link One Dual CTA Link 2

Within the Box 1 CTA Links (dual-cta option only) section are fields related to rendering the extra links.

CTA X New Tab

This option when set to Yes will open a new tab or window (the bahavior is based on the client browser settings) when the link is clicked.

CTA X Link Icon

This renders either a right facing carat to indicate a local link or a new window icon indicating that the link goes to another site. See examples in the CTA above.

Back to Top

Register Style

The Register Style checkbox drastically alters the design of the Call-to-Action and should be used for promoting registration. This can also be used in the sidebar.

Your Account
Register now or log into your account to get started.
Register Now Log In
Back to Top

No Border

The No Border option is intended for situations where you need the link style and layout but without a component border. Here's an example of how that looks:

No Border CTA
This has no component border but does have a linked headline.
Back to Top

Icon Reference

Listed below are the various Headline Icon options available.

  • - PDF
  • - Location
  • - Preferences
  • - Bank
  • - Create case
  • - Manage case
  • - Add postage
  • - Low balance
  • - Meter
  • - Contact info
  • - Manage account
  • - Contract
Back to Top