Buttons

Buttons may be used to add additional styling to links. Some snippets are pre-coded to present links as buttons. When adding links to pre-style Snippets, make sure that the buttons styling is consistent for all links within that Snippet.

To insert a button:

  1. When in Edit mode, click to place your cursor at the location you want to add this feature.
  2. From the editing toolbar, select "Insert Snippet."
  3. Sort Snippet categories to "[Fierce] Buttons."
  4. Click the button you want to insert and select "Insert."
  5. The "Insert/Edit Link" tool in the editing toolbar may be used to edit link text, URL and to modify the custom class.

[Fierce] Button - Gold

Width will expand to accommodate text; if inserted into a grid, the text will wrap when it reaches width of container.

To manually converted a text link to this button style, change this custom class to the link encoding: btn btn-yellow


[Fierce] Button - Gold - Full Width

Width will expand to full width of the container it is placed in.

To manually converted a text link to this button style, change this custom class to the link encoding: btn btn-yellow btn-block

THIS IS A FULL WIDTH LINK


[Fierce] Button - Light

This button is intended for use with grids or snippets containing a dark background.

Width will expand to accommodate text; if inserted into a grid, the text will wrap when it reaches width of container.

To manually converted a text link to this button style, change this custom class to the link encoding: btn btn-light


[Fierce] Button - Purple

Width will expand to accommodate text; if inserted into a grid, the text will wrap when it reaches width of container.

To manually converted a text link to this button style, change this custom class to the link encoding: btn btn-purple


[Fierce] Button - Purple - Full Width

Width will expand to full width of the container it is placed in.

To manually converted a text link to this button style, change this custom class to the link encoding: btn btn-purple btn-block

THIS IS A FULL WIDTH LINK