DS Callout

Component description

The DS callout component is used to help direct a user’s attention to important information e.g. open and closing dates.

The component can be used anywhere on the page but should not be confused with an alert component which only appears at the top of the page.

Component field properties

• Character count limits and recommendations per field
• Mandatory and optional elements
• Other notable display options.

DS Callout heading field 
Optional field  
Character count: 40 characters or less including spaces  
Plain text – no HTML

DS Callout text description field
Mandatory field 
Character count: 150 characters or less including spaces  
Plain text – no HTML

Callout link (CTA)  
Optional field 
Button text: 5 words or less, use active voice, don’t use 'learn more', 'read more', or 'click here' as not best practice for link text. 
Option to link to asset ID or external link

Read more collapse field  
Optional  
Field for additional information. Enabling this field will disable any link above. External links should go in the read more text.

Display options

• Option to centre align component
• Includes an optional call-to-action field, for users to navigate to linked content
• The linked/CTA text can be customised to suit your message e.g. ‘apply now,’ ‘register now’ ‘see courses.’

Guidelines for use

• Use sparingly and only for important information e.g. application open and closing dates or an important message.

Most suited for these page types

• Second level landing pages
• Content pages

Example(s) of use

https://www.latrobe.edu.au/transport-central/public-transport/commuter-club