← All widgetsWidget 311 · emcp_custom_311

Tooltip Text

Elementor widget2 layouts13 content options13 style options2 panel sections

Built with the EMCP Widget Builder and registered under the EMCP Custom category of the Elementor panel. Search the panel for: tooltip, glossary, definition, hint, popover, info.

Setup guide

  1. Open a page in Elementor, search the panel for Tooltip Text and drag it into a container.
  2. Content › Content: Mode, Text, Trigger Text, Trigger Icon, Tooltips, Trigger Style, Open On, Placement and 5 more.
  3. Pick a Mode: Rich text with tooltip terms, Single trigger (text or icon). Each one is shown below.
  4. Style tab sections: Style. Colours, typography and spacing set here are scoped to this widget instance.
  5. Publish. Every option is a standard Elementor control, so it responds to the editor, dynamic tags and global styles as usual.
Conditional options: Text appears when Mode is inline; Trigger Text appears when Mode is single; Trigger Icon appears when Mode is single.
Ships with its own JavaScript; it runs once per instance and re-initialises inside the Elementor editor preview.
Layout

Rich text with tooltip terms

Mode = inline

Elementor pages are built from containers, which hold widgets. Wrap any words in a span with data-tip="N" to attach the Nth tooltip below.

Layout

Single trigger (text or icon)

Mode = single

What is this?

Options reference

Every control the widget exposes, grouped by panel section. Names in code are the setting keys used by the MCP tools (add-free-widget, update-widget).

Content tab

Content

OptionTypeChoices / rangeDefaultNotes
Mode
mode		DropdownRich text with tooltip terms, Single trigger (text or icon)inline
Text
body		Rich textElementor pages are built from contai...Shown when mode = inline
Trigger Text
trigger_text		TextWhat is this?Shown when mode = single
Trigger Icon
trigger_icon		Iconfas fa-info-circleShown when mode = single
Tooltips
tips		Repeater2 items
↳ Title
title		Text
↳ Text
text		TextareaTooltip text
↳ Icon
icon		Icon
↳ Learn More Link
link		Link
↳ Link Text
link_text		TextLearn more
Trigger Style
trigger_style		DropdownDotted underline, Solid underline, Highlighted, Small info icon after the term, Badge, Plaindotted
Open On
open		DropdownHover (tap on touch), Clickhover
Placement
placement		DropdownTop, Bottom, Left, Right, Autotop
Theme
theme		DropdownDark, Light, Accentdark
Arrow
arrow		Toggleon / offyes
Animation
anim		DropdownFade, Shift, Scalefade
Open Delay (ms)
delay		Numbermin 0, max 2000100
Interactive (can hover into the tooltip)
interactive		Toggleon / offyes

Style tab

Style

OptionTypeChoices / rangeDefaultNotes
Text Typography
body_typo		Typography
Text Color
body_color		Color#344054
Accent (trigger / accent theme)
accent		Color#6a11cb
Highlight Background
hl_bg		Color#f4ebff
Tooltip Background Override
tip_bg		Color
Tooltip Text Override
tip_color		Color
Tooltip Typography
tip_typo		Typography
Tooltip Title Typography
title_typo		Typography
Tooltip Max Width
tip_w		Slidermin 120, max 480, px260
Tooltip Padding
tip_pad		Dimensions
Tooltip Radius
tip_radius		Slidermin 0, max 30, px10
Tooltip Shadow
tip_shadow		Box shadow
Tooltip Icon Size
icon_size		Slidermin 10, max 40, px18

Add it with the MCP tools

Any connected agent can place this widget: call add-free-widget with widget_type: "emcp_custom_311" and a settings object using the keys above. Run get-custom-widget with id 311 for the full JSON spec.