Skip to content

How to Open a Hotspot Tooltip on Click in WordPress?

Key Takeaways

  • Nexter Blocks Hotspot block opens hotspot tooltips with a mouse click, which makes hotspots compatible with all devices, including mobile, where hover functionality is not available.
  • Tooltip Options in the Style tab includes a Triggers section, and selecting Click makes that hotspot tooltip open with a mouse click.
  • Hotspot setup uses the Content tab for the Hotspot Image and Tooltip toggle, then the Pin Content tab for the repeater item, pin type, and pin before enabling click-triggered tooltips.
Table of Contents

Hover does not exist on a phone. A tooltip that only opens on hover is a tooltip half your readers cannot open.

Each hotspot pin can be switched from opening on hover to opening on click, which works the same way for a mouse and for a finger.

For every Hotspot setting in one place, see the Hotspot feature guide.

Before You Start

  • Edition: Pro — the Hotspot block needs Nexter Blocks Pro.
  • Block to enable: Hotspot, switched on under Nexter > Blocks in your WordPress dashboard.

Steps

  1. Add the Hotspot block, set its image and add your pins.
  1. Open a pin and make sure Tooltip is switched on with some Tooltip Text.
  1. Set that pin’s Triggers to Click.
  1. Repeat for every pin you want to behave this way — the trigger is a per-pin setting.
A hotspot pin set to open its tooltip on click
The tooltip open after clicking the pin

How It Behaves

TriggerMeasured on a published page
Hover (default)The tooltip opened as the pointer arrived and closed when it left.
ClickHovering did nothing at all; clicking the pin opened the tooltip.
  • The trigger is set per pin, so one image can mix hover pins and click pins — though mixing them is usually more confusing than picking one.
  • Click is the safer choice when the image matters on phones and tablets, where hover does not exist.
  • Tooltip placement, arrow, theme and animation all work the same whichever trigger you choose.

Limitations

  • The trigger is per pin, not per block. Adding a new pin later gives it the default hover trigger, so remember to switch it too.
  • A pin that is also a link will follow the link when clicked, so avoid combining a click tooltip with a pin link on the same pin.
  • There is no “tap to open, tap again to close” setting beyond the tooltip’s own behaviour.
  • Clear the Tooltip Text rather than relying on the Tooltip toggle — measured, the toggle alone does not stop the tooltip appearing.

Troubleshooting

Clicking the pin opens a page instead of the tooltip

That pin has a link on it as well. Remove the pin’s URL, or move the link into the tooltip content instead — a pin cannot usefully be both a link and a click-to-open tooltip.

My new pin still opens on hover

The trigger is a per-pin setting and new pins start on Hover. Open that pin and set Triggers to Click as well.

The tooltip will not open on my phone

Set Triggers to Click for that pin. Hover does not exist on a touch screen, so a hover-only tooltip can never be opened there.

Related Docs

Share your Thoughts

Still in Doubt? Let’s Assist You

Have Feedback or Questions?

Join our WordPress Community on Facebook!