Skip to content

How to Open a Hotspot Tooltip on Click in Elementor?

Table Of Content

A tooltip that opens on hover is fine on a desktop and awkward on a phone, where there is no hover at all. Switching the pin to open on click gives everyone the same behaviour.

Every pin in the Hotspot widget has its own Tooltip Options, and one of them is Trigger. It has two settings, Hover and Click.

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

Before You Start

  • Edition: Pro. With only the free plugin active the widget does not render.
  • Switch it on: The Plus Addons > Widgets, search Hotspot, turn the toggle on.
  • A hotspot already on the page. If you have not built one yet, start with How to Add an Elementor Hotspot on an Image?

Steps

  1. Select the Hotspot widget and open the pin you want to change in Add Multiple Pin Hotspot.
  2. Inside that row, switch to its Style tab.
  3. Click Tooltip Options to open the group.
  4. Set Trigger to Click.
  5. Repeat for every pin that needs it – Trigger is per pin, not per widget.

What You Will See

We published the page and tested the pin both ways. With Trigger left at Hover, moving the pointer onto the pin opened the tooltip. With Trigger set to Click, the same pointer move opened nothing at all, and the tooltip appeared only after the pin was clicked.

The hotspot tooltip opened by clicking the pin.
Animated demo of a hotspot tooltip opening on click.
SettingWhat it doesDefault
TriggerHover or Click opens the tooltipHover
PositionWhere the tooltip sits – Left, Right, Top, Top Start, Top End or BottomTop
ThemeThe tooltip’s colour schemeDark
Tooltips InteractiveLets the visitor move the pointer into the tooltip without it closingEnabled
AnimationHow the tooltip appearsShift-Toward

How It Behaves

  • Trigger lives in the pin row’s Style tab, under Tooltip Options – not in the row’s Content tab where the text is.
  • With Click, hovering does nothing; the tooltip stays shut until the pin is clicked. We checked both, on the published page.
  • Tooltip Options is the same set of settings The Plus Addons uses for tooltips elsewhere in the plugin, so the options will look familiar.
  • Each pin carries its own settings, so you can mix hover pins and click pins in one image.

Limitations

  • Pro only.
  • There is no single switch for the whole widget – Trigger has to be set on each pin.
  • An Icon pin renders blank on a page where nothing loads Font Awesome; the tooltip still opens, but there is nothing visible to click. Use a Text or Image pin if that affects your page.

Troubleshooting

The tooltip still opens on hover

Trigger is set on that pin only. Open each row of Add Multiple Pin Hotspot, go to its Style tab and check Tooltip Options.

I cannot find Tooltip Options

It is in the pin row’s Style tab, not the widget’s Style tab and not the row’s Content tab.

Nothing opens at all

Check the pin has text in Description under Pin Content. An empty description leaves nothing to show.

Not verified

So you know exactly what has and has not been checked:

  • Real touch devices – we tested a pointer click, not a finger tap.
  • Tooltips Interactive, Offset, Distance, Duration In and Duration Out.
  • The Content WYSIWYG content type inside a hotspot tooltip.

Related Docs

Related Frequently Asked Questions

Related Docs