Close

Quicklinks

Alert
Spacer
Table
CTA
CTA 5050
CTA Encore
CTA Full Width
Image Text CTA
Gallery
Accordion
Carousel Text
Homepage + 404 Hero
Instagram
Left-hand Sub Nav (FAQ)
Marketing Tiles Container
Member Benefits Promo
Redeem Points Promo
Filter Page
Image
Video
Anchor/Sticky Navigation
Breadcrumbs
How to Play Sub Navigation

CTA

This component helps users perform actions.

CTA Left Aligned
CTA Left Aligned

CTA Left Aligned

CTA Left Aligned

CTA Left Aligned

CTA Left Aligned

CTA Left Aligned
CTA Left Aligned

CTA Left Aligned

CTA Right Aligned
CTA Right Aligned

CTA Right Aligned

CTA Right Aligned

CTA Right Aligned

CTA Right Aligned

CTA Right Aligned
CTA Right Aligned

CTA Right Aligned

CTA Center Aligned
CTA Center Aligned

CTA Center Aligned

CTA Center Aligned

CTA Center Aligned

CTA Center Aligned
CTA Center Aligned

CTA Center Aligned

Usage Criteria

This component helps users carry out actions on the website, such as loading information, submitting forms, and more.

Do's and Don'ts

  • Do use the Primary Button style for important actions that users should pay attention to (ie. Submit button for a form).
  • Do not use the Primary Button style for secondary actions that are not as important (ie. Do not use this as a "back to previous page" button in a multi-step form).
  • Do not put multiples of this component directly side by side or stacked. If there are multiple CTA buttons on a page, please have some dividing content in between the components.

Design Notes

If there are two actions needed on a page in close proximity, use the Secondary Button style of the component for one of them. This draws less attention than the Primary Button style and maintains visual hierarchy.

Configurable Options

This component has a CTA Text field for the button label. The CTA type can be configured to be a standard button format or a text link with an icon. Once one of these are selected, the style can be configured directly underneath.

The position of the button is configured via the CTA alignment dropdown.

Developer Notes

Type Name
AEM Component Name CTA
Code Base Name  
resourceSupertype  
SCSS Attributes  
JavaScript  
Status  
Version  

Our operations span the entirety of the province that we now call British Columbia. We respectfully acknowledge that we are guests in the territories of more than 200 First Nations, each with unique traditions, cultures, and histories. We are grateful to these First Nations caretakers for their stewardship of these lands and waters since time immemorial. 

BCLC is committed to establishing and maintaining good relations with all First Nations, Métis, and Inuit people in British Columbia and beyond. Our journey has only recently begun, and we have a lot of work to do in collaboration with Indigenous Peoples to understand the Truth, reconcile the past, and truly generate win-wins for the greater good, together.

Read more

If you gamble, use your