How to Add an Info Banner in Elementor?

Key Takeaways

  • The Plus Addons for Elementor Animated Service Boxes widget allows users to create info banners with customizable styles and hover orientations.
  • Users can select from four image types for info banners: None, Icon, Image, or Lottie, enhancing visual appeal.
  • The widget enables the addition of multiple info banners by clicking the +Add Item button and allows management of text alignment and item gaps.
Table Of Content

Do you want to add info banners to your Elementor website? These banners can be used to display important information and promotional offers on your website. Adding an info banner is a simple and effective way to grab the attention of your audience and improve the overall user experience.

With the Animated Service Boxes widget from The Plus Addons for Elementor, you can create beautiful info banners in Elementor.

To check the complete feature overview documentation of The Plus Addons for Elementor Animated Service Boxes widget, click here.

Requirement  – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.

To do this, add the Animated Service Boxes widget to a page and follow the steps –

1. Select Info Banner from the Main Style dropdown.

From the Style dropdown, you can select a predefined style.

2. Then from the Hover Orientation dropdown, you can select the slide direction on hover. You can set the direction to top, bottom, left or right.

You can select the image size from the Image Resolution dropdown.

By enabling the Button toggle you can add a button to the info banners.

When enabled you can select a button style from the Button Style dropdown.

Then by enabling the Image/Icon toggle, you can add different image types to the info banner.

3. In the Animated Service Boxes section, you have to add the content for the info banners. By default, you’ll find three items, open one item.

4. You can add a title in the Title field. 

Then from the Select Icon dropdown, you can select the image type for the info banner. Here you’ll find four options – 

  • None – This will not add any image to the info banner.
  • Icon – With this option, you can add an icon to the info banner.
  • Image – With this option, you can add an image to the info banner.
  • Lottie – With this option, you can add a Lottie file to the info banner.

Based on your selection you’ll get different options to add the image type.

Note: Make sure the Image/Icon toggle is enabled to show the icon, image or Lottie file.

You can add a subtitle in the Sub Title field as required.

5. In the Description field you can add a description that will show on the back slide.

6. Then in the Featured Image section, you have to add an image for the info banner.

You can edit the button text and URL from the Button Text and Button Link fields respectively.

Note: Make sure the Button toggle is enabled to make the Button Text and Button Link fields work.

Following this process you can edit the other items.

You can click on the +Add Item button to add more info banners.

Then from the Layout tab, you can manage the text alignment of the info banner content and you can also manage the info banner height as well.

Then from the Columns Manage tab, you can manage the number of items in a row for desktop, tablet and mobile separately. You can also manage the gap between the items as well.

About the Author

Photo of Aditya Sharma CMO of The Plus Addons for Elementor
CMO · The Plus Addons for Elementor · 10 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordPressElementorn8nAIClaudeAutomationServer
Get Instant Answers to all your questions about The Plus Addons for Elementor, trained on 1000+ Docs and Videos

Related Frequently Asked Questions

What if the Animated Service Boxes widget doesn't show up in Elementor?

If the Animated Service Boxes widget is not appearing, ensure that The Plus Addons for Elementor is installed and activated. This widget is part of that plugin, and without it, you won't have access to the info banner feature. Double-check your plugin settings to make sure everything is correctly configured.

Can I use the info banner for promotions on my website?

Info banners are ideal for displaying important information and promotional offers on your website. Using the Animated Service Boxes widget from The Plus Addons for Elementor allows you to create visually appealing banners that can effectively grab your audience's attention and enhance user experience.

What are the best practices for setting up the hover effects on info banners?

Setting the hover orientation correctly can significantly impact user interaction. You can choose slide directions like top, bottom, left, or right from the Hover Orientation dropdown. This feature helps create engaging interactions that encourage users to explore the content further. Consider testing different directions to see which one resonates best with your audience.

Are there any limitations to the types of images I can use in the info banner?

Yes, you can choose from four types of images for your info banner: None, Icon, Image, and Lottie. Ensure the Image/Icon toggle is enabled to display these options. If you don't enable this toggle, the selected image type won't show up, which could lead to incomplete banners.

How can I manage the layout of multiple info banners on a page?

You can manage the layout of your info banners using the Columns Manage tab. This allows you to adjust the number of items displayed in a row for desktop, tablet, and mobile views separately. You can also control the gap between items, ensuring a clean and organized appearance that enhances usability.

What happens if I forget to enable the Button toggle for my info banner?

If you forget to enable the Button toggle, the Button Text and Button Link fields will not work, meaning no button will appear on your info banner. This can limit user interaction and reduce the effectiveness of your promotional message, so itu2019s crucial to check this setting when designing your banners.

Last reviewed: April 9, 2026