Button snippets create small colored boxes that contain linked text. Buttons are used for
calls to action, such as "Register" or "Apply". Avoid using buttons to link to informational pages
or articles (use the Tile component instead).
How to create a button
Place the cursor on your page where you want the button to appear.
Click on the Snippet icon in your tool bar (it looks like a puzzle piece), then choose
a Button snippet.
Edit the button text and link by highlighting the text clicking on the link icon in
the toolbar. Enter the URL in the pop-up that appears and fill in other details as
needed. Click Save.
Example
Button (default): Use this for most calls to action; can be used anywhere.
Advanced usage notes
For any part of the button to be clickable, the <a> element must surround the <button>
element. If the order is reversed, as it is in many places across the site, only the
text will be clickable.
Because <a> elements and <button> elements are by default part of the tab index, the
<button> element should be removed from the tab index by adding the tabindex="-1" attribute. If the tabindex removal is on the <a> element, a keyboard user will not
be able to click the link.