booster addons
creative elementor bundle
Purchase Now
Purchase Now
Purchase Now

Home - Widgets - Advanced Button

Advanced Button

Preview Widget
Preview Widget
Getting Started
Button Settings
Button Styling
Icon Styling

More Widgets

• Advanced Heading
• Toggle Content
• Single Icon
• Alert Box

# Getting started

Every website needs buttons, and the advanced button widget from Booster Addons provides you with the tools to make fancy buttons.Customize the layout, shape, and colors to create your own design.

Read down below to know more about the options available.

Button Settings

In the button settings section you can define your button text and setup the layout for the widget.

  • Button text & Link: Fill in your button text and setup an optional link.
  • Button Layout :

This is where you will choose a layout for your widget.Here are the options available : 

-No Icon : Choose this if you only want to use text for your button.

-With Icon : Choose this if  want to use a combination of an icon and text.

-Just Icon : Choose this if only want to use an icon on your button.

  • Text & Button Alignement : Control the alignement for the button and the button's inner text.
  • Icon :

This area with only be displayed if you choose to use an icon in the layout control.

-Choose Icon : Apply an icon from our extensive icon libraries.

-Icon Position : Control the icon position in conjunction with the text.

  • Button Custom ID (For advanced users only) : Define a custom ID if you need an external advanced control over the button.


Under the styling tab section, you will have the full control over the styling & design of your advanced button widget.

  • Button Styling Settings

Control everything about the button size and typography.

-Width & Height : Define your button height and width or enable the full width option if  you want it to be equal to the containing section's width.

-Typography : Choose a font family and change all the text properties to adjust it to your needs.

  • Button Styling

Customize all the aspects of the button's background and also change the text color with following options.

-Colors : Solid and gradient colors are both available with the addition of having full control on the gradient behavior.

-Borders & Shadows : Control the border for your button & apply custom text and box shadows.

  • Icon Settings 

Control everything about your icon, customize the color and size.

-Size & Margins : Change the icon size and control the margins.

-Icon Color : You can apply a solid single color, or a gradient color with custom directions.Note that the color can be change for both the normal and hover states.

  • Advanced Icon Styling

Enabling this will provide you with additional icon  styling options.

-Background : You can change the background size and customize the colors with the possibility to use solid and gradient colors.

-Borders & Shadows : Control the border for the icon & apply custom  box shadows.

Get Help From Professionals

Can't find what you are looking for?

If you can't find what you are looking for any our documentation website, please feel free to open a support ticket  & get help from our support team.

Open a Ticket
Open a Ticket


We are a group of talented WordPress developers & designers from Earth our main goal is to create great products & provide the best services to our customers.




Email :

WebSite : Certain Dev

Made with love from Earth!

Certain Dev | all rights reserved © 2020