To add a button to your Editor 2.0 website, drag a Button onto the page in the Site Editor, then click Manage Button to enter its text and choose where it goes: another page on your website, another website, a spot on the same page, an email address, a phone number or a file. Click Republish to put it on your live website.
Applies to: Org admins whose role includes Site Editor access, such as Administrator or Content Editor · All plans, for organizations with Editor 2.0 (the CMS module) · Editor 2.0 (CMS)
Where: Content > Site Editor
Add a button
- Go to Content > Site Editor and open the page.
- In the left sidebar, click Add, then Elements.
- Drag a Button onto the page where you want it.
To reuse a block that already has a button, such as a tryout or program announcement, hover over the block and click into its section, then click Duplicate in the section's Design menu. The copy appears below the original, ready to edit.
Set the button's text and link
- Click the button.
- Click Manage Button in the toolbar above it. The Button Content panel opens.
- Enter the text visitors see on the button, such as Register Now.
- Choose a link type and enter where the button goes (see the table).
- Click Republish.
| Link type | Where the button goes |
|---|---|
| Internal page | Another page on your website |
| External URL (web address) | Any website, such as a program's registration page or a partner's site |
| Anchor | A section further down the same page |
| Back to top or Scroll to bottom | The top or the bottom of the page |
| Email address | Opens a new email to that address in the visitor's email program |
| Click to call | Calls the number when the visitor taps it on a phone |
| File for download | A file visitors can download, such as a flyer |
Link a button to one program's registration page
- On your live website, open the program's More Info page.
- Copy the address from your browser. It looks like your website address followed by /programdetails?programId= and a number.
- In the Site Editor, click the button, click Manage Button, choose the web address link type and paste the address.
- Click Republish.
If the program has no More Info page, uncheck Hide More Info page on the program's 1 Setup page. For more detail, see CMS: Link a Button to a Specific TeamSideline Program.
Change how the button looks
- Click the button, then click Edit Design in the toolbar.
- Choose the Primary or Secondary button style at the top.
- On the Button style tab, change the background color, border or icon.
- On the Button text tab, change the font, size and color of the text.
- To undo your changes, click Reset to Site Theme style.
What you'll see
The button shows on the page in the editor right away. Use Preview to try the link, then republish so visitors can use it.
If it doesn't work
- The button goes to the wrong place. Click it, click Manage Button and check the link type and address. Then click Republish.
- A program button opens your home page. The button still points to a page on your old website, and old website pages open your new home page once the new website is live. Link it to the program's new More Info address as described above.
- The button can't be selected, or shows View Only. Some buttons that came with your website's template are locked. Ask TeamSideline Support to change their text or link. See CMS: Why can't I edit the header, footer or some page text? (View Only and locked areas).
- Visitors don't see the new button. Click Republish, then refresh the page.
Good to know
- The Primary and Secondary button styles come from your website's theme. Changing the theme changes every button that uses it. See CMS: Site Theme.
- To change pictures, text or icons, see CMS: Replace an image or your page header (hero) image and CMS: Edit text and icons on a page.