You are now in the main content area

Buttons Component

The buttons component is used to add clickable and customized links to a web page.  

  • Found in Sidekick > Content
  • Three styles available
  • Required content: Button name, link
  • Optional fields: None
  • Custom Colours Applicable:  Default style and Call-To-Action style

Display options

Choose the number of buttons that should appear in each row (maximum of four rows). This allows for the creation of a variety of layouts – vertical, horizontal and stacked.

Buttons per row:

  • One
  • Two
  • Three
  • Four

The component’s display is constrained by the amount of vertical and horizontal space it is placed in. This component’s layout will rearrange depending on the device.

For example: multiple columns on a desktop display will become a single column on a phone.

Sample display: One button per row

Sample display: Two buttons per row

Sample display: Three buttons per row

Sample display: Four buttons per row

Style Options

Choose the style of buttons — Default, Call-To-Action, or Transition.

Sample default style

Sample call-to-action style

Sample transition style

How to use

  1. In Sidekick> Content, click on "Buttons"
  2. Drag "Buttons" onto page
  3. Double click, or right-click to edit
  4. Under "Content" tab, choose how many buttons per row to display
  5. Click "Add Button"
  6. Enter "Name", "Path/URL"
  7. Checkmark "Target" and whether the button link should open in a new tab
  8. Click "Style" tab
  9. Select Default (default), Call-To-Action, or Transition
  10. Click OK
Screen capture of Buttons drag and drop functionality
Drag & drop the Buttons component from the sidekick