Sometimes you may want to include buttons in a text field, and you can do so in the WYSIWYG (what you see is what you get) text editor. While these buttons have less style options than a button component, they allow for a longer button text label and can be more convenient being housed in the same component as your text.

Where can you create a button in a WYSIWYG text area?

Buttons created in a text area can be created within all content types (article, page, and person) and within two types of components (collection and text area).

Note: buttons can also be used with the card component; however, they are visually different and are created using the config fields, not the WYSIWYG editor.

Steps to add a button in a text area

• Once in the text area, type the text you want to appear on the button. Follow these guidelines for writing effective buttons.
• Select the text and using the WYSIWYG editor, link the selected text to the desired destination. In the Link URL field, you typically enter one of these three things:
  • If you are linking to another page on your site, start typing the page name and select it from the dropdown menu.
  • If you are linking offsite, type the full URL
• Once you have a link created, you may now set the styling for that text, which is how you create the button. To do so, highlight the link text, and click styles in the WYSIWYG editor.
• Scroll to the bottom of the style options. "Button primary" and "button secondary" should be active options to select. Select one. Click again to deselect.
  • Note: The only difference between the two style options is the color--gold or black. You cannot alter the buttons size, font, etc. 
  • Tip: Ensure that only one of the button style options are selected. If both styles are selected the styling will be affected.

Example of primary and secondary button styles

This is the primary button style

This is the secondary button style