Plugin
TooltipText Image Tooltip
Text to Image Tooltip Plugin for Joomla
Instant access after purchaseOne-click Joomla updatesLifetime option available
30-day money-back guarantee
Works with
Joomla 4 Joomla 5 Joomla 6
Changelog — Text Image Tooltip
Version 3.2: 20 October 2026
- Download Key support on the update site (dlid).
Version 3.1: 19 October 2026
- Runs on Joomla 5 and Joomla 6 with the Behaviour - Backward Compatibility plugin disabled.
- The editor button loads through the Joomla service provider.
- An update no longer turns the plugins back on if you had disabled them.
Version 3.0: 17 July 2026
Release Date: 17 July 2026
Complete Rebuild
- Full rebuild for Joomla 4, Joomla 5, and Joomla 6
- Namespaced service-provider architecture with Web Asset Manager loading
- Vanilla JavaScript only — jQuery and TimThumb /
image.phpremoved - Install package
pkg_text_image_tooltip_3.0.zipincludes the content plugin and editor button - Legacy shortcode
{txttooltip}TRIGGER{end-link}image.jpg{/txttooltip}still works
New Features
- Text-first tooltips — underlined phrases open rich image previews by default
- Four themes — Dark, Light, Glass, and Brand, with per-tip shortcode overrides
- Placement modes — Follow cursor, or anchor top / bottom / left / right
- Animations — Fade, Scale, Slide, or None, with reduced-motion support and per-tip
animationattribute - Sticky click & touch — Click/tap to pin; Escape or outside click to dismiss; second click on a linked tip follows the URL
- Optional image triggers — Thumbnails with float left/right when needed
- WebP thumbnail cache — Local images are resized and cached under
images/cache/text-image-tooltip - Editor button — Insert
{txttooltip}shortcodes from the article editor toolbar - Design controls — Background, text, accent colour, max width, and corner radius
- Rich tip content — Title, multi-line body, large preview image, and optional CTA link
Improvements
- Safer URL handling for media and links (blocks javascript/data schemes)
- Keyboard focus styles and
aria-expandedstate - Bootstrap/Helix-compatible
showclass so tips are not hidden by template CSS - Correct spacing for link-only, title-only, and image+link tip layouts
- Empty shortcodes no longer open blank tip bubbles
- Image triggers without
thumbsrcfall back tolgsrc - Anchored tips reposition on scroll and resize
- Ctrl/Cmd/Shift-click on linked triggers opens the URL normally
- Responsive behaviour — floated triggers unwrap on small screens; panels stay inside the viewport
- Lazy loading and async decoding for tip images
Removed
- jQuery tooltip behaviour and TimThumb-style resize endpoints
- Legacy JFactory / JURI runtime paths
- Old resize-by height/width-only parameter UI replaced by modern theme, placement, and design controls
Version 1.4: 3 December 2025
- Joomla 4, 5 & 6 compatibility work and WebAssetManager integration
- Accessibility and shortcode documentation improvements
Version 1.3: 14 September 2025
- Joomla 5 compatibility, WebP support, and improved tooltip positioning
Version 1.2: 11 February 2023
- Joomla 4 support and update server integration
DemoExample 1 - Inline Text Preview
Hover or tap a dotted underline phrase to open a rich image tooltip. Click once to pin it, click outside or press Escape to dismiss. Local previews are resized and cached as WebP.
Start with the leather tote (opens in a new window) — a text-first product callout that never leaves the sentence.
{txttooltip text="leather tote" title="Leather Tote" content="Soft full-grain leather with brass hardware. Hover the phrase to preview the full product shot." lgsrc="images/cloud/Bag__leather-tote.webp" theme="dark" placement="follow" link="https://joomlax.com"}{/txttooltip}DemoExample 2 - Editorial Mentions
Light theme tips keep long-form articles clean while still giving readers a quick visual preview.
Pair editorial copy with the so product mentions feel native inside paragraphs.
{txttooltip text="studio headphones" title="Studio Headphones" content="Closed-back monitoring headphones with natural tonal balance for long editing sessions." lgsrc="images/cloud/Headphones__studio-black.webp" theme="light" placement="follow"}{/txttooltip}DemoExample 3 - Glass Anchored Tip
Use placement="top" (or bottom, left, right) when a stable card feels more intentional than a cursor-follow tip.
Readers can explore the without leaving the paragraph.
{txttooltip text="mirrorless camera kit" title="Mirrorless Kit" content="Compact body, fast autofocus, and travel-ready lenses for creators on the move." lgsrc="images/cloud/Camera__mirrorless-kit.webp" theme="glass" placement="top"}{/txttooltip}DemoExample 4 - Image Trigger
Need a thumbnail instead of underlined text? Set type="image" with thumbsrc and optional float.
{txttooltip type="image" title="Aviator Sunglasses" content="Gold-frame aviators with polarized lenses. Anchored tip stays beside the trigger instead of following the cursor." thumbsrc="images/cloud/Sunglasses__aviator-gold.webp" lgsrc="images/cloud/Sunglasses__aviator-gold.webp" thumbwidth="150" theme="brand" placement="right" tipwidth="300"}{/txttooltip}DemoExample 5 - Glossary Strip
Combine multiple text shortcodes in one example for glossaries, lookbooks, and catalogue mentions.
Browse the , , and .
{txttooltip text="leather classic" title="Leather Classic" content="Warm leather strap with a clean dial for everyday wear." lgsrc="images/cloud/Watch__leather-classic.webp" theme="dark" placement="top"}{/txttooltip}, {txttooltip text="steel chronograph" title="Steel Chronograph" content="Polished steel case with chronograph subdials for precision timing." lgsrc="images/cloud/Watch__steel-chronograph.webp" theme="dark" placement="top"}{/txttooltip}, and {txttooltip text="signature scent" title="Signature Scent" content="Glass-bottle fragrance with layered citrus and amber notes." lgsrc="images/cloud/Perfume__glass-bottle.webp" theme="dark" placement="top"}{/txttooltip}DemoExample 6 - Legacy Shortcode
Older sites keep working: TRIGGER{end-link}image.jpg still renders as a modern text tip with a preview image.
Legacy syntax for upgrades automatically to the 3.0 tip UI.
{txttooltip}Heritage Runner{end-link}images/cloud/Shoes__running-sneaker.jpg{/txttooltip}DemoExample 7 - Rich Product Card
One tip can carry a larger preview, longer multi-line body copy, a CTA link, and a wider tip panel.
See the heritage runner (opens in a new window) for a fuller product story.
{txttooltip text="heritage runner" title="Heritage Runner" lgsrc="images/cloud/Shoes__running-sneaker.webp" theme="dark" placement="follow" tipwidth="380" link="https://joomlax.com"}Breathable knit upper with a responsive foam midsole tuned for all-day city miles. Wide toe box, reflective heel tab, and a durable rubber outsole for wet pavement grip. Available in sizes 36–46. Includes spare laces and a travel pouch.{/txttooltip}
Leather Tote
Soft full-grain leather with brass hardware. Hover the phrase to preview the full product shot.
Studio Headphones
Closed-back monitoring headphones with natural tonal balance for long editing sessions.
Mirrorless Kit
Compact body, fast autofocus, and travel-ready lenses for creators on the move.
Aviator Sunglasses
Gold-frame aviators with polarized lenses. Anchored tip stays beside the trigger instead of following the cursor.
Leather Classic
Warm leather strap with a clean dial for everyday wear.
Steel Chronograph
Polished steel case with chronograph subdials for precision timing.
Signature Scent
Glass-bottle fragrance with layered citrus and amber notes.
Heritage Runner
Breathable knit upper with a responsive foam midsole tuned for all-day city miles.
Wide toe box, reflective heel tab, and a durable rubber outsole for wet pavement grip.
Available in sizes 36–46. Includes spare laces and a travel pouch.
Wide toe box, reflective heel tab, and a durable rubber outsole for wet pavement grip.
Available in sizes 36–46. Includes spare laces and a travel pouch.