booster addons
creative elementor bundle
Purchase Now
Purchase Now
Purchase Now

Home - Widgets - Alert Box

Alert Box

Preview Widget
Preview Widget
Getting Started

More Widgets

• Drop Caps
• Icon Box
• Fancy Text
• Advanced Heading

# Getting started

The alert box widget from Booster Addons gives you a great way to display alert texts or an important notice on your web pages.Use a combination of an icon, title and message text, and style everything from the container to the icon.

Here are the options provided in this widget.


In the content section, you will define the alert box elements and align it in your web page.

  • Choose Icon : Select an icon from our extensive icon librairies
  • Alert Title : Fill in the title title of your alert or notice.
  • Alert Message :  Fill in the text of your alert.
  • Alignement : Horizontally position your alert box in the containing section.


The actions section will be used to enable various options for your alert box.

  • Enable Close Button : Enable the use of a 'cross' close button so the user can close the alert box.
  • Close Button Color : Choose a color for the close button.
  • Show Timer :  Enable this if you want the alert box to be hidden and appear after a defined amount of seconds.
  • Show Timer Value : Define the number of seconds after which the alert box should be displayed.
  • Hide Timer :  Enable this if you want the alert box to disappear after a defined number of seconds.
  • Hide Timer Value : Define the number of seconds after which the alert box disappear.


The styling tab is where you can find the options to style the alert box text, container, and icon.

  • Text Content Styling

Customize the alert title & message text properties.Change the font size, letter spacing... choose from hundreds of Google font families.

-Colors : You can change the colors for the text elements.

-Margins : Change the margins values to control the space between the widget elements..

  • Container Styling

Control everything about the container design.

-Min Height : Change the container height to suit your needs.

-Background Color : Customize the container's background and choose to apply either a solid or gradient color with the possibility to control the gradient direction and colors positions.

-Borders & Shadows : Add a border for the container with the possibility to customize the width and color, and apply a box shadow to create unique effects.

-Radius & Padding : Change the container radius if you want a more rounded shape and control the inner space using padding. 

  • Icon Styling

Control everything about your icon and customize the color schemes.

-Icon and background size : Control the icon size and the background size to create a unique design.

-Colors : Customize the icon color scheme using either a solid or gradient color with the possibility to control the direction of the gradient.The icon background color can also be changed.

-Borders & Margins : Add a border for your icon and control the icon margins.

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