Build Sidebar: Heading with CTA

Page Content

How to Use the Sidebar: Heading with CTA Content Type

The Sidebar: Heading with CTA content type creates a colored block in the sidebar that combines a heading with a call-to-action (CTA) button. Use it to highlight an important next step or direct visitors to related content, resources, forms, or other key destinations. This content type can also be used to launch a form in a lightbox and can be incorporated into a mega-menu.

In this module, you will learn how to add and customize a Sidebar: Heading with CTA content type and use it to guide visitors toward relevant actions.

Learning objectives

  • Understand the purpose of the Sidebar: Heading with CTA content type
  • Learn how to add and customize a heading and CTA in the sidebar
  • Use the content type to highlight important actions, resources, or forms
  • Understand when and where to use the content type within a webpage

Instructions

From the T4 Site Structure, navigate to the page you are updating.

How to add a Sidebar: Heading with CTA content type

  1. Click the Add Content button.
  2. Select Sidebar: Heading with CTA from the list of content types.
  3. The content elements you use depend largely on how you'd like the sidebar to look on the page. At a minimum, use the following content elements:
    • Background color: Black, blue, gray, light gray, teal, or white
    • Heading: This is the title of the CTA
    • Open link in new tab: Select the checkbox if you require the link to open in a new tab/window as opposed to in the same page.
    • CTA link text: This is the name of the link and will appear as CTA button text
    • CTA link (internal): Select an internal website to link to on the CTA button
    • CTA link (external): Only enter this if you are NOT entering an internal link
  4. After you've added the desired content elements, click the Save Changes button to save content as a draft, or press the arrow and select Save and Approve to save and publish updates.

Video tutorial

Best practices

  • Use this content type only on layouts that include a sidebar; do not use it on full-width page layouts
  • Use a short, descriptive heading that helps visitors quickly understand the purpose of the content
  • Use clear, action-oriented button text that tells visitors what will happen when they select the CTA
  • Keep the content focused on one primary action to make the next step clear
  • Use the CTA to direct visitors to relevant, high-priority content rather than general or loosely related information
  • Avoid placing multiple Sidebar: Heading with CTA content types close together, which can create visual clutter and make it difficult for visitors to identify the most important action
  • Preview the page to make sure the sidebar content complements the main page content and does not compete with other CTAs

Common issues and troubleshooting

  • The sidebar will not appear on full-width layouts

Additional resources

By now, you should feel confident using the Sidebar: Heading with CTA content type to highlight important information and guide visitors toward a clear next step.

Explore the possibilities: Content type examples

Browse through the examples below to see how the type can be used in different scenarios and design choices.

Visit the Explore Healthcare Career Careers A-Z page to see a live example of a Sidebar: Heading with CTA content type.

Ready to enhance your content further?

Check out the next module.

Sidebar: Quote
menu
Close