Reveal Modal
Popup Modal Plugin for Joomla
J4 J5 J6 Plugin P1.5.2
Current Version0.22K
Active UsersSee our product features
Using the extension you can popup HTML content whether text or images in an animated way such as fade and popup, fade only, etc in a popup box when clicked on a text.
- Easy to use Plugin using plugin syntax
- Poups when clicked, can be used multiple times within the content.
- HTML text can be used ( Images, Videos and iframe can be popped up)
Vanilla JavaScript — No jQuery
Zero Dependencies
Lightweight vanilla JS engine — no jQuery required.
Fast & Lean
Small CSS/JS footprint with cache-busted assets for quick loads.
Simple Shortcode Syntax
Intuitive Syntax
Create popups with {reveal text="Click Me"}…{/reveal} in articles or Custom HTML modules.
No Coding Required
Editors can add modals without touching templates or JavaScript.
2026 Modal UI
Glass Overlay
Frosted backdrop blur, soft ambient shadow, and refined typography.
Mobile Bottom Sheet
On small screens the dialog slides up as a modern sheet with a grab handle.
Animation Styles
Per-Modal Animation
Choose scale, fade, slide, or none on each shortcode.
Speed Control
Set duration globally or per popup with speed (milliseconds).
Flexible Sizing
Size Presets
Use size="sm|md|lg|xl|full" for common layouts.
Exact Dimensions
Or set width / height for pixel-perfect control.
Accessible Dialogs
Proper Dialog Semanticsrole="dialog", focus trap, Escape to close, and focus restore on dismiss.
Titled Headers
Add title="…" for headings wired to aria-labelledby.
Deep Link & JS API
URL Hash Open
Give a stable id and open with #your-id from any link.
RevealModal API
Call RevealModal.open('id') / RevealModal.close() from your scripts.
Brand Matching Styles
Colour Controls
Overlay, popup background, text, and close button colours from plugin params.
Layout Tunables
Padding, margin, border radius, and overlay blur amount.
Rich HTML Content
Full HTML Body
Text, images, buttons, forms, lists — drop in any article markup.
Video & Iframe Ready
Embed YouTube/HTML5 video; media pauses automatically when the popup closes.
Confirmation Controls
Backdrop Lock
Use closebg="false" so users must pick Cancel / Confirm.
Close Helpers
Buttons with close-reveal-modal dismiss cleanly without fighting the × control.
Shortcode Examples Tab
Copy & Paste
Plugin parameters include a Shortcode Examples tab with ready-to-use snippets.
Attribute Guide
Quick reference for text, class, title, id, size, animation, speed, and more.
User-Friendly Controls
Multiple Ways Out
Close via ×, backdrop click, Escape, or your own action buttons.
Per-Modal Overrides
Toggle backdrop / Escape behaviour with closebg and closeesc.
Multiple Modals Per Page
Independent Dialogs
Run many reveals on one page with different sizes, titles, and animations.
Stable or Auto IDs
Set id yourself or let the plugin assign unique identifiers.
Joomla 4, 5 & 6 Compatible
Latest Joomla Support
Built for Joomla 4.x, 5.x, and 6.x as a system plugin.
Modern PHP
Clean PHP 8-ready code with proper escaping and validation.
Zero Dependencies
Lightweight vanilla JS engine — no jQuery required.
Fast & Lean
Small CSS/JS footprint with cache-busted assets for quick loads.
Intuitive Syntax
Create popups with {reveal text="Click Me"}…{/reveal} in articles or Custom HTML modules.
No Coding Required
Editors can add modals without touching templates or JavaScript.
Glass Overlay
Frosted backdrop blur, soft ambient shadow, and refined typography.
Mobile Bottom Sheet
On small screens the dialog slides up as a modern sheet with a grab handle.
Per-Modal Animation
Choose scale, fade, slide, or none on each shortcode.
Speed Control
Set duration globally or per popup with speed (milliseconds).
Size Presets
Use size="sm|md|lg|xl|full" for common layouts.
Exact Dimensions
Or set width / height for pixel-perfect control.
Proper Dialog Semanticsrole="dialog", focus trap, Escape to close, and focus restore on dismiss.
Titled Headers
Add title="…" for headings wired to aria-labelledby.
URL Hash Open
Give a stable id and open with #your-id from any link.
RevealModal API
Call RevealModal.open('id') / RevealModal.close() from your scripts.
Colour Controls
Overlay, popup background, text, and close button colours from plugin params.
Layout Tunables
Padding, margin, border radius, and overlay blur amount.
Full HTML Body
Text, images, buttons, forms, lists — drop in any article markup.
Video & Iframe Ready
Embed YouTube/HTML5 video; media pauses automatically when the popup closes.
Backdrop Lock
Use closebg="false" so users must pick Cancel / Confirm.
Close Helpers
Buttons with close-reveal-modal dismiss cleanly without fighting the × control.
Copy & Paste
Plugin parameters include a Shortcode Examples tab with ready-to-use snippets.
Attribute Guide
Quick reference for text, class, title, id, size, animation, speed, and more.
Multiple Ways Out
Close via ×, backdrop click, Escape, or your own action buttons.
Per-Modal Overrides
Toggle backdrop / Escape behaviour with closebg and closeesc.
Independent Dialogs
Run many reveals on one page with different sizes, titles, and animations.
Stable or Auto IDs
Set id yourself or let the plugin assign unique identifiers.
Latest Joomla Support
Built for Joomla 4.x, 5.x, and 6.x as a system plugin.
Modern PHP
Clean PHP 8-ready code with proper escaping and validation.
Need help getting started?
Our comprehensive documentation provides step-by-step instructions for setting up and installing Reveal Modal.
We have a pricing plan that's perfect for you!
Choose the subscription plan that suits you.
$9
$19
$29
$49
Frequently Asked Questions
No. Version 1.5 is pure vanilla JavaScript with no jQuery dependency.
Use {reveal text="Click Here"}Your HTML content{/reveal} in an article or Custom HTML module.
text, class, title, id, size (sm|md|lg|xl|full), width, height, animation (scale|fade|slide|none), speed, closebg, and closeesc.
Add template button classes, for example class="btn btn-primary".
Use size="sm|md|lg|xl|full", or set exact width / height such as width="800px" height="500px".
Set animation="scale", fade, slide, or none. Optionally add speed="400" (milliseconds).
Yes. Use title="Welcome" for an accessible heading wired to aria-labelledby.
Give the shortcode a stable id="welcome-modal", then link to #welcome-modal or call RevealModal.open('welcome-modal').
Place an iframe between the shortcode tags (preferably inside <div class="reveal-modal__media">…</div>). Playback pauses when the popup closes.
Use closebg="false" so backdrop click does not dismiss, and add Cancel / Confirm buttons with class close-reveal-modal.
Yes. In plugin Styling Settings set overlay colour, blur, popup background, text colour, close button colour, padding, margin, and border radius.
Yes. Each modal gets a unique id automatically, or set your own with the id attribute.
Use the × button, backdrop click (if enabled), Escape (if enabled), or a button with class close-reveal-modal.
Open System - Reveal Modal plugin parameters and use the Shortcode Examples tab — each snippet has a Copy button.
Yes. On small screens the dialog uses a bottom-sheet layout with a grab handle. Animations stay distinct on mobile.
Joomla 4.x, 5.x, and 6.x with PHP 8.0+.
In articles or Custom HTML modules — not in CSS. Styling belongs in the plugin Styling Settings or your template CSS.
Still have questions?
Related Extensions
Easy Login Popup
Create Your Own Joomla Module for Free!
Use our Free Joomla Module Generator to quickly create custom modules for your website.