Hero with Link

Component Overview

The Hero with Link is essentially the Hero Compact, but with the ability to add a link. You can add one link, which will appear as an orange CTA button in the hero.

The Hero with Link gets its copy from the parent page's Page Title and Page Description, however you add your image and link in the component itself.


Component Location

Hero → Hero with Link


Component Overview

Supported Templates & Placeholders

Template Placeholder
Article Detail Page
/maincontent/hero-content
Detail Page
/maincontent/detail-page-nav/hero-content
Experience Landing with Nav
/maincontent/hero-content
Experience Landing Page
/maincontent/hero-content
Experience Interior Nav
/maincontent/interior-nav-content
Experience Right Rail Page
/maincontent/hero-content


Recommended Image Size

1500x1000 @72DPI


Character Limits

Title: 100
Body: 280
Link: 50


How to Use

  1. In the Page Content folder, locate and add the 'Hero with Link' component
  2. Ensure that your Page Title and Page Description are entered correctly in the parent page
  3. Select your image
  4. Insert your link
  5. In the Details pane for the page in which you want to add a Hero with Link, navigate to the 'Hero' folder and select 'Hero with Link'

Component Example

To see how the component will display on different types of screens, select the button below.

Device resolution = 1440px

Component Type

Hero

ABOUT THE COMPONENT

  • Component Type: Hero
  • Rich Text: No
  • Images: Yes
  • Video: No
  • Buttons: Yes
  • Links: Yes
  • Icons: No 

Report Issue & Suggest Changes

Report a Bug or Suggest a Change