# Basic Content - Button
Drag and drop the More Column Content element from the Website Editor Sidebar into the column space where you want to add the Button.
This will open the Choose Content window.
Clicking the Button element will now drop it into the column space you selected.
When the Button element is highlighted it will also be seen in the "Selected Elements" section of the Website Editor Sidebar. Clicking on "Button" will open its settings.
# Edit Button
There are several properties available for the Button element within content blocks.
This is the text that appears on the button face. Click on the Label property to open its text field for editing. Click on the Label property again to close. Changes are automatically saved. Click on the
x beside the Label property to clear the text field.
# Color and Style
Clicking on the Configure button will open the Select Button Style window where you can adjust the look of your button and also see a preview of your changes.
# Type of Styling
There is the Default Styling option and the Custom Styling option available in a drop-down selector. Default Styling uses colors based on the current theme. Changing to the Custom Styling option opens a selection of Color Picker panels to adjust the colors of the button.
Custom Styling only works with the Normal "shape" button (see Appearance). Also, no other style options are available when using Custom Styling.
The Appearance drop-down selection allows you to change the shape of the button. The options are Normal (default), Link, Pill, or Squared.
Some Appearance options may limit other available style options for your button.
Link will make the button appear as text only.
Pill will make the button appear with rounded ends.
Squared will make the button appear as a block.
The Outline toggle will switch the color of the text with the button color and show the button outline.
The Variant option allows you to choose from the current theme color options with the default as Secondary.
# Full Width
A toggle to use the full width of the content block (default is disabled).
Uses a drop-down selector to choose from predefined font Size options.
- Default - uses the default font size.
- Large - uses a larger font size and adjusts the button as needed.
- Small - uses a smaller font size and adjusts the button as needed.
By default the button Alignment will be "centered". Alignment can be set to Center, Right, and Left.
The Alignment option is only applied when the Full Width option is toggled off.
# Video: Website Editor Add Button
Reviewed: 2021-05-04, 3:13 PM