Notification

Adding a notification bar to your website is an easy way to display important messages, promos, or announcements to your visitors. You can set up your Notification in Elementor and customize it to match your style, including text, button, alignment, and icons.

Requirement 

• Elementor (Page Builder) 
• Animations Addons (Our Plugin)  

Tip: Make sure Animation Addons is installed and activated on your WordPress site before you start.   

How To Activate Notification 

1. Go to your WordPress Dashboard. 
2. Click on Animation Addons. 
3. Head to the Widgets Tab. 
4. Under General, toggle on Notification.  

Configuring Notification Settings

1. Open the Elementor editor panel and click the ‘+’ icon. In the search bar, type ‘Notification.’ When it appears, you can either click on it or drag it to your desired spot. 

2. Once you click on the Notification, all its functions will appear. You can then customize it according to your preferences.

Text: In the text section, add the message you want to display on your promo or announcement bar. In this example, the paragraph says, “All plans have 30% off this week.” However, you can write any text you prefer. 

Button Text: Button Text option controls the label or text that appears on the button. For example, here is set to ‘Claim’. However, you can set any name based on your preference. 

Button Link: It lets you set the URL or page where the button will take users when they click it.
Alignment: This option controls the position of the notification content. In left, center, or right you can set any position of content as per your choice. For example, here its set to ‘Center’, however, you can set any position according to your preference. 

Close Icon: It lets you choose an icon from the library or upload a custom one. In this example, no icon is selected, but you can pick any icon you like.

Icon Position: This option controls where the icon appears. Since no icon is selected in this example, the icon position isn’t set.

Note:In image below, you can see that the icon position is set to the right. However, since no icon is selected, this function will not be applied. 

Final Output 

You Did It 

Your Notification is now live and ready to shine!

The message is set, the button is clickable, and your content looks exactly where you want it. Even the icon position is ready to show off whenever you add your favorite icon.

Take a moment to admire your work — your website just got a dynamic, attention-grabbing upgrade!