Design

Button

Quickly place a button on a page.

How do I add this widget to a page?
  1. Click Edit Page
  2. Click either + Content or the Settings icon (down-facing caret) which will be located to the right of Edit where you will need to select either Insert above or Insert below
  3. Choose the Button widget
  4. Enter the text you would like displayed on the button.
  5. Enter the link that you would like to link to.
  6. Select the target. We recommend if the link is going to a document or an external website that the target be changed to New Window
  7. Additional fields can be found in the Settings tab, these will allow you to customize what information the widget displays. The fields and their descriptions are listed below;
    • Style - Choose the style of the button. The options available are; Default and Link Only
    • Size - Select the size of the button from the default size up to Large.
    • Color - Select the color of the button from the following options; Primary, Secondary, Tertiary, Accent, Info, Gray, Light Gray, Dark Gray, and Dark
    • Icon - Pick from a selection of icons if you want one to be displayed.
    • Alignment - This allows you to pick the alignment of the button from left, center, and right. By default, the alignment is left
    • Full Width - Should the button fill the complete width of the container. The default is off.
    • Title - If you want text to be displayed in the tooltip when the button is rolled over, enter it into this field.
  8. When you are finished, click on the green Create button and your Button widget will show up on the page.
  9. Make sure to click either the Publish or the Save Draft option just as you would when you're editing pages.

  • Is it possible to have the Button widget send an email or dial a phone number?
    It is also possible to have a button send an email or dial a phone number when clicked on. Both will try to open the appropriate program, on a visitor's computer if one is available, to handle the request. If one is not available nothing will happen.
    • If you like to use the button as a Contact Us enter mailto: followed by the email address into the Link field. So to send to stevej@domain.com you would enter mailto:stevej@domain.com into the link field.
    • To have the button dial a phone number enter tel: followed by the phone number into the Link field. So to dial 1-513-222-3333 you would enter tel:15132223333 into the link field.
  • Is it possible to have the Button widget look like an actual button?
    To get an actual button look to this widget, a color other than none needs to be picked in the Color field found under the Settings tab for the widget.

SchoolNow Tip #1- The alternative way to creating buttons is to simply make a link on a page, select it, and select the desired button style from the Styles context-sensitive menu in the TEXT widget.

SchoolNow Tip #2- It is best to keep the text inside a button as short as possible. Anything that goes over ten or fifteen words is probably too long. Simple statements are best.