Button Shortcode


Make a link stand out by formatting it as a button.

Demo: Button Shortcode

Tip: You will find a list of shortcodes by clicking "More information about text formats" at the bottom right under the WYSIWYG editor.


Insert Button Shortcode

  1. Place your cursor in the Body content area where you want the button to appear.
  2. Click the Button Shortcode Generator: It's the first icon in the Shortcode icon set; a small square with an arrow in it.

Select Button icon


Enter Button Settings

The first tab, Button Settings, has a field for Button Text and a field for the URL.

Button Text: Use title-style capitalization. Please note an all-uppercase style has lower readability because of the lack of word shape. The lack of shape contrast makes it less accessible for users with dyslexia.

URL: You should always use the full URL, which begins with http:// or https://. Best practice is to navigate to the page you want to link to, and copy the full URL as it appears in the web browser's address bar.

Enter button settings

Tip: Make sure the URL in the button shortcode is not actually a hyperlink (underlined in blue) or the button will not work.


Choose Button Design

  1. Click the second tab, Button Design.
  2. Choose a Button Color (blue, gold, black, gray or white).
  3. A Button Icon is optional see all the choices here.
  4. Button Size:
    • Regular: normal text size.
    • Large: larger than surrounding text.
    • Small: smaller than surrounding text.
  5. Button Style:
    • Regular: the button is the same width as the text.
    • Full: the button stretches horizontally to fill the available space.

    Button design settings

    Buttons displayed on a web page