The Button Element is a
call-to-action that your visitors can click. It works just
like a link, but it's a small graphic instead of just text.
Once you add a Button Element, you'll see a cursor where you can type your text directly into the button. The button will auto-resize based on how much text you add. Choose text that's short and to-the-point (think "Shop Now!" rather than "Click here to be taken to our Store Page.") Make it clear where the button will take people if they click on it.
After you've added the Button Element, you can make several adjustments to it. Make sure to click Save in the bottom right corner after you make any changes.
When editing a Button Element, don't forget to add a link to the page where you want the button to lead:
Click the Chain Link icon.
- If the link is to another page on your site, select the page from the dropdown menu below Internal Link.
- If the link is to one of your blog posts, select the post from the dropdown menu below Blog Post.
- If the link is to a page on another website, enter the page's URL in the box below External Link or Email Address.
If the link is to an email address, enter the full email address in the box below External
Link or Email Address.
- If the button should link to a File Download Element, select the right file from the dropdown menu under File Download.
- Click the Set Link button on the right side, then click Save.
Click one of the alignment options to align your button to the left, right, or center.
Choose between 3 button styles:
Once you choose the basic style, there are even more settings you can customize, including font, font color, background color, and borders. Learn more about these in the next section, Designing Buttons.
Use the Style Editor to change the way your buttons look. Click on Style in your Site Admin and then click on one of the Button Elements you'd like to change. You'll see the following menu appear at the top of the page, with lots of choices:
You can choose different design settings for your Style 1, Style 2, and Style 3 buttons.
Choose the Font, Font Size, Font Color, and Active Font Color of the text in your button. You'll likely want to choose a sans-serif font that's easy to read here.
"Active" color is the color that will appear when someone hovers over or clicks on the button with their mouse.
Next, choose the Background Color and Active Background Color for your button that matches well with the rest of your site. If you don't want the button to change color when people hover over it, just make the Active Background Color the same as the Background Color.
Set the Border Color, Active Border Color, Border Size, and Border Radius for the border (outline) around your button.