When you've added Buttons to your site, you can customize the style of the Buttons.
By default, each template has its own Button style, but you can easily customize it.
Buttons Settings are global and will be applied to all website pages.
Note: Theme Settings will only apply to the features with default settings. If you've already customized one or more Buttons on the website, Theme Settings won't overwrite these customizations.
How to Change Button Style?
Step 1. You can access the Buttons Settings from the left-hand sidebar of the Site Editor by selecting Theme:
Step 2. Hover over the Buttons button and click on it to open the Buttons Settings menu:
There are 5 types of Buttons in Site Editor:
- Primary solid
- Secondary solid
- Primary outline
- Secondary outline
Customizing Button Style
You can easily change each Button style:
1. Make Button Text Bold, Italic, Underline, or Strikethrough (selected option will be highlighted in blue color):
2. Change Button Text font, style, and format:
3. Change Button and Button Text colors:
4. Click on the Settings icon to:
- Choose the Button style (Square, With Rounded Corners, Round).
- Turn on and configure Hover Effects (Fade Out, Scale, Shine, Shadow, Glow, Uplift):
- Adjust border size (for the Primary and Secondary Outline Button styles only):
How to Reset Button Styles?
To restore the default Button style click the Reset button in the Buttons Settings menu:
Confirm your choice by clicking Yes:
How to Align Buttons
Buttons can be aligned simply by using the button menu options. Please view the video below to see how the functionality works: