How to Add Tooltip in an Elementor Icon List Item?

Updated on April 17, 2024 by Editorial Team
Table Of Content

Are you looking to add a tooltip in an Elementor icon list item? Adding a tooltip to an icon list item can help you provide additional information to the visitor and enhance the user experience. 

With the Style Lists widget from The Plus Addons for Elementor, you can easily add tooltips to icon list items in Elementor.

To check the complete feature overview documentation of The Plus Addons for Elementor Style Lists 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 Style Lists widget to the page and follow the steps – 

1. From the Stylish List tab, open the item you want to add a tooltip to.

2. Enable the Tooltip toggle.

Stylish list pin hint settings

3. From the Content Type dropdown, you can select the content type for the tooltip. Here you’ll find three options – 

  • Content Text – With this, you can add simple content in the editor. For formatting you have to add HTML tags manually.
  • Content WYSIWYG – With this option, you can add and format content using the WYSIWYG editor.
  • Template – With this option, you can add any type of content (video, image etc.) using an ELementor template. Once selected you have to select your template from the Elementor Templates dropdown.

Select the option as per your requirements.

Let’s select Content Text here.

4. Then add the tooltip content in the Description field.

From the Text Alignment section, you can align the content.

You can manage the text typography from the Typography section.

Then from the Text Color section, you can manage the text color.

Now when you hover over that particular icon list item it will show a tooltip.

Stylish list pin hint demo
Get Free 25+ Secrets to Make Elementor Website Faster [Guaranteed Results]

    Subscribe to our YouTube Channel for Elementor Tutorials
    New Video Every Week!
    Automatically Convert Figma Designs to 100% Editable Elementor Website