Design and customize buttons using the Button widget in the 10Web Builder.

The Content Tab

Button

Type: From the drop down menu choose a button type.

Text: Customize the button text in the provided field.

Link: Set the button redirect link. Click on the gear icon to customize the link settings.

Alignment: Choose the button alignment relative to the widget box.

Size: From the drop down menu, choose the size of the button.

Icon: Click the icon box to choose and set an icon on the button.

Icon Position: If the icon is set, choose if the icon appears before or after the button text.

Icon Spacing: Adjust the spacing between the icon and the button text.

Button ID: Option to set a custom ID to the button to help with tracking in Google Analytics.

Typography: Customize typographical setting of the button text.

Text Shadow: Option to set and customize the shadow of the button text.

Text Color: Customize the color of the button text.

Background Color: Customize the color of the button. Hover & Normal

Hover Animation: When on the hover tab, click the drop down menu to set an animation effect on hover.

Border Type: Option to set a border to the button.

Border Width: Set the thickness of the border.

Color: Customize the border color.

Border Radius: Adjust the radius for rounded button edges.

Box Shadow: Option to set a shadow to the button.

Padding: Adjust the padding of the button.

In the advanced tab adjust the padding, apply Z-index to your elements, set conditions, motion effects, responsiveness, and more.

Next Up: Divider