The “Notification Widget“ allows you to create eye-catching notifications for free in WordPress Elementor websites. Easily add a customizable notification box with a close icon to grab attention and convey important messages. Adjust colors, typography, and layout to match your site’s design while ensuring a seamless user experience.
Let’s look at each of the options in the “Notification Widget” below.
Add a Free Notification for Elementor
This widget requires Unlimited Elements Free version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Notification”
- Hover over the widget in the search results and click install
- Add your “Notification” widget to any Elementor Page
General Settings for Elementor Notification
Show Title
Show/Hide the title.
Notification Title
Type the notification title.
Title Tag
Select the html tag for title.
- H1
- H2
- H3
- H4
- H5
- H6
- div
- span
- p
Show Description
Show/Hide the description in notification.
Notification Description
Type text for notification description.
Text Tag
Select the html tag for text.
- H1
- H2
- H3
- H4
- H5
- H6
- div
- span
- p
Show Button
Show/Hide button in notification.
Show Graphic Element
Show/Hide the graphic element.
Graphic Element Settings for Elementor Notification
Close Button Settings for Elementor Notification
Horizontal Position
Select the horizontal positioning.
- Left
- Right
Vertical Position
Select the vertical positioning
- Top
- Bottom
Horizonal Gap
Set the horizontal gap.
Vertical Gap
Set the vertical gap.
Close Icon
Choose icon for close button.
Show Close Button Text
Show/Hide the close button text.
Close Text
Type text for close button.
Additional Settings for Elementor Notification
Hover Transition Duration
Set the hover transition duration.
Button Entrance Animation
Select the button entrance animation.
- None
- Appear
- Scale Down
- Scale Up
- From Left
- From Right
- From Top
- From Bottom
Button Hover Animation
Select the button hover animation.
- Grow
- Shrink
- Pulse
- Pulse Grow
- Pulse Shrink
- Push
- Pop
- Bounce In
- Bounce Out
- Rotate
- Grow Rotate
- Float
- Sink
- Bob
- Hang
- Skew
- Skew Forward
- Skew Backward
- Wobble Vertical
Set Cookie Settings for Elementor Notification
Button Source Settings for Elementor Notification
Items (Buttons) Settings for Elementor Notification
Styling the Elementor Notification
A variety of styling options are provided to control every aspect of the widget’s appearance. Select the colors that match the theme of your site. Make the widget look exactly how you want it to, by customizing the text, buttons, fonts, and layout.
Elementor Notification Layout Styling
Style the layout, alignment, padding, border, and background.
Elementor Notification Title Styling
In this section, style the title color, typography, and width.
Elementor Notification Description Styling
Set the description color, typography, and gap.
Elementor Notification Graphic Element Styling
Set the graphic element margin, gap, wrapper width, height, icon size, color, background, and border.
Elementor Notification Close Button Styling
Set the padding, border radius, border, typography, icon and text color for close button.
Elementor Notification Button Styling
You can set the button positioning, alignment, layout, typography, gap, padding, and border.
Usage Examples of Elementor Notification
Here are some live use cases for the Notification Widget.
Free Notification for Elementor with Multiple Action Buttons
Free Notification for Elementor with a Custom Image
Thank you for using the Notification Widget for Elementor! With its flexible styling and dynamic trigger options, this is the best Notification Widget for Elementor, helping you create engaging alerts and messages with ease. We hope it enhances your website’s communication and user interaction. If you have any questions or need assistance, feel free to reach out.