Create and Edit a Button Widget on a Page

  • Updated on Jul 29, 2025
  • Published on Jul 22, 2025
  • 1 minute(s) read
Prev Next

Who can use this feature?

System Administrators | Owners | Publishers | Authors

Create a Button

  1. Sign in to your site

  2. Navigate to your desired page

  3. Click the Widgets tab The tab labeled Widgets in the vertical menu on the left-hand side of the page.

  4. Click and drag the Button widget onto the page The widget labeled Button dragged-and-dropped onto a New Row on the page.

  5. Select a Widget Skin or use the Button Appearance fields to select images The drop-down menu labeled Widget Skin.

  6. Click the Next button The button labeled Next in the bottom-right corner of the Button Appearance tab.

  7. Complete the Button Options fields

  8. Click Done The button labeled Done in the bottom-right corner of the Button Options tab.

  9. Click Save Changes The floppy disk icon labeled Save Changes in the top-right corner of the screen.

Edit a Button

  1. Navigate to the page with the button

  2. Hover the mouse cursor over the button, then click the Options tab The tab labeled Button Options in the top-left corner of the widget tab.

  3. Select a Widget Skin or use the Button Appearance fields to select images The drop down labeled Widget Skin.

  4. Click the Next button The button in the bottom-right corner of the Button Appearance tab labeled Next.

  5. Complete the Button Options fields

  6. Click Done The button labeled Done in the bottom-right corner of the Button Options tab.

Remove a Button

  1. Navigate to the page with the button

  2. Hover the mouse cursor over the button, then click the Remove icon The button labeled Remove this widget in the top-right corner of the button options.

  3. Click OK on the pop-up confirmation The button labeled OK in the confirmation modal.

  4. Click Save Changes The floppy disk icon labeled Save Changes in the top-right corner of the page.

Button Appearance Fields

An example image of the options under the Button Appearance header.

  • Widget Skin: The appearance of the button is based on a widget skin

  • Outer Background Images: Will override those selected in the button's theme

    • Normal: Select an image asset for the default display

    • Hover: Select an image asset for when a user hovers over the button

  • Inner Background Images: Will override those selected in the button's theme

    • Normal: Select an image asset for the default display

    • Hover: Select an image asset for when a user hovers over the button

Button Options Fields

An example image of the fields and options under the Button Options header.

  • Default Text: Add default text

    • Hide Text: Select to force text not to appear on the button

      Note:

      Text describing the button must be included for accessibility compliance.

  • Secondary Text: Add subtext

  • Link: Add a link

  • Open in a new window: Open the link in a new window

Related articles