CBD

CTA Banner

A CTA (call to action) banner is used to drive users to a targeted action on your site (enrolling in a course, for example)

descriptive label

Purpose

Text

When to use

Text

How to use

  1. Click Murdoch on the Drag widgets toolbox to the right of the screen.
    Screenshot of Drag Widgets toolbox
  2. Locate the CTA Banner widget and drag it across to the section on the page where you want the banner to appear
    Screenshot of CTA Banners widget
  1. Click the Edit icon or Create Content to view the options for the CTA Banner widget.
  2. Add the main title for your banner under Heading (limit of 50 characters)
  3. Include an optional descriptive text for your banner under Text (limit of 150 characters)
  4. Click Select image to add an image from the library or to upload a new one.
  5. Add text for the CTA's Button under Label (limit of 30 characters)
  6. Optionally add an internal or external link to the banner
    • For internal links, select the department from the Site dropdown.
      Then, select the page to display in the list that appears
      Screenshot of Site Dropdown
    • For external links, enter the URL (e.g. https://google.com) of the destination page.
      Tick Open in new window if you want to open the external URL in a new tab.
  7. Click Save to exit the CTA options
  1. Click More at the top right of the widget
  2. Select Delete in the dropdown to remove the widget.

Layout Variants

There are different colour and layout options available for CTA banners.

  1. Click  Edit on the CTA Banner widget to view its options.
  2. Locate and click on the More options tab (above the Save button at the bottom)  
  3. Select the colour for the banner under the Themes dropdown. Available choices are Light Grey, Black, Red and White
  4. On the Image Position dropdown, you can select the position on the banner's text. Options are Left, Right, Circle Left and Circle Right.
    NOTE: The Circle options will change the banner image from a square shape to a circular shape
  5. Finally, the Template dropdown has an option for Full Width. This will expand the banner to occupy the full width of the page. 
    NOTE: This option will not display correctly on this template. It will work on the Default and Landing page templates only. View the Full Width Banner example

Variant Examples

CBD

CTA Right Banner

A CTA (call to action) banner is used to drive users to a targeted action on your site (enrolling in a course, for example)

descriptive label
b360

Circle Left CTA Banner

A CTA (call to action) banner is used to drive users to a targeted action on your site (enrolling in a course, for example)

descriptive label
b360

Circle Right CTA Banner

A CTA (call to action) banner is used to drive users to a targeted action on your site (enrolling in a course, for example)

descriptive label

View the Full Width Banner example

Support

Need help with website updates?

  • Submit a web content request
  • Report a technical issue

Visit the Support page