BLACK FRIDAY: 50% OFF all Pro plans
Pro from $18 a year or $60 lifetime, no code needed
Ends Cyber Monday, 30 Nov. Lock in the price today
Get 50% Off
Pro widget

Advanced Tooltip Widget for Elementor Pro

A text, icon, image or button with a rich tooltip

Overview

What Advanced Tooltip does

Advanced Tooltip adds a trigger element (a piece of text, an icon, an image or a button) that shows a tooltip on hover or click. The tooltip can hold an image, a title and formatted text, and it is repositioned so it stays on screen. Use it for short explanations, definitions and extra details that do not need their own section.

Live demo

See it in action

Hover over me
Features

What it can do

  • Four trigger types: Text, Icon, Image and Button.

  • The tooltip can contain an image, a title and rich text with links and lists.

  • Opens on hover and keyboard focus, or on click.

  • Four positions (Top, Bottom, Left, Right) and four effects (Fade, Slide, Zoom, None).

  • Show and hide delays for the hover trigger.

  • Stays on screen: side tooltips that do not fit move to the top, others shift sideways.

  • An optional arrow pointing at the trigger.

  • A Keep Open in Editor switch that makes styling easier.

Use cases

When to use it

Explain a term

Underline a technical word and show its meaning in a tooltip.

Help icons

Place an info icon next to a price or form label to explain what it covers.

Image details

Show a caption, credit or product detail when visitors hover an image.

Button hints

Tell visitors what will happen before they press a button.

Setup

How to set it up

A few steps from adding the widget to a finished result.

  1. Drag the Advanced Tooltip widget onto the page and open Trigger Element.

  2. Choose a type under Show As, then fill in the Text, Icon or Image for that type.

  3. Open the Tooltip section and add a Title, Content and, if needed, an Image.

  4. In Tooltip Settings choose Open On, Position and Effect.

  5. Turn on Keep Open in Editor while you work in the Style tab on the Tooltip width, background and text.

  6. Turn Keep Open in Editor off when you are done, or leave it on, since it has no effect on the live page.

FAQ

Questions and answers

What can go inside the tooltip?

An image, a title and a rich text area. The text area accepts formatted text, links, lists and images.

What happens when the tooltip is near the edge of the screen?

A left or right tooltip that does not fit moves to the top. A top or bottom tooltip slides sideways until it fits.

Can it be used with a keyboard?

Yes. The trigger can receive focus, a hover tooltip shows on focus, and the Escape key closes it.

Why does my text trigger have a dotted underline?

The text trigger is underlined by default so visitors notice it. Change or remove it with Underline in the Trigger style section.

Bright Addons Pro

Get Advanced Tooltip with Bright Addons Pro

Bright Addons Pro has 80 Pro widgets plus all 51 free widgets, 10 extensions, a Theme Builder and 32 dynamic tags. From $18 a year, with a 14-day money-back guarantee.