Galleries
Let visitors view photos at full size.
Content / widget · Elementor module
Fullscreen Content Toggle Widget Plugin for Elementor
Add a button that shows its container, an element by CSS ID or the whole page full screen, for galleries, menus, slides or reading.
Included in All AccessClassic Elementor widgetFrom $29 USD / year
Complementor / Fullscreen content toggleProduct preview
Text, style and layout controls inside Elementor
01 / Interactive demonstration
Try it
These are the actual published outputs of the widget. Try each one on this page.
02 / Inside WordPress
Fullscreen content toggle controls in Elementor
Content sets what goes full screen, the CSS ID, the background used in full screen, the icon, what happens where full screen is not available, and every label. The Style tab covers the button in its normal, hover and focus states, and the message.
03 / Website use cases
Where to use fullscreen content toggle
Galleries, menus, slides and long reads look cramped inside a page, and visitors do not know their browser can show them full screen. Fullscreen content toggle adds a button that shows its own container, an element by CSS ID or the whole page full screen, keeps the content readable on the black backdrop, and announces how to leave. Where the browser cannot do it, the button hides or explains instead of failing silently.
Menus and price lists
Show a menu full screen on a tablet at the counter.
Presentations
Show a slide or chart full screen.
04 / Installation and setup
How to add a fullscreen content toggle in Elementor
Start with Complementor installed and your license connected. Enable this module in the WordPress library, then configure it in Elementor.
Install Complementor, connect your license and enable Fullscreen content toggle in the Complementor library.
Add the widget inside the section or container to show full screen.
Or choose an element by CSS ID, or the whole page.
Adjust the labels and style the button.
Publish the page and try it.
05 / Content and style controls
Customize fullscreen content toggle in Elementor
Configure the settings available for this module to suit the page you are building.
Container, CSS ID or whole page.
Label switches to Exit full screen.
Readable background in full screen.
Hidden or explained where unavailable.
Status message with how to leave.
Standard and webkit Fullscreen API.
06 / Choose the right approach
Fullscreen content toggle and Elementor alternatives
Compare the existing Elementor workflow with this Complementor module before choosing your setup.
A lightbox
Good for single images, not for a whole section.
Browser full screen (F11)
Shows the whole window, including your header and footer.
07 / Requirements and compatibility
Fullscreen content toggle compatibility with Elementor
- Requires Elementor; works without WooCommerce.
- Depends on the browser’s Fullscreen API; some mobile browsers do not offer it for page elements.
- Nothing is sent to your server.
Complementor uses classic Elementor APIs. Atomic-native controls are not implemented. Check your theme, cache and integrations on a staging site before release.
08 / Common setup problems
Troubleshoot fullscreen content toggle
Check these settings if the published page behaves differently from the editor.
The button does not show on some phones.
That browser has no full screen for page elements, so the button is hidden. Choose Show a message to explain instead.
It does not work in the editor.
The editor preview may not allow full screen. Check it on the published page.
The content is black in full screen.
It had no background. Set Background in full screen, or give the section a background.
The button is missing with a CSS ID.
No element on the page has that ID. Set it under Advanced, CSS ID.
Fullscreen content toggle plugin questions
Does it need Elementor Pro?
No. It works with the free version of Elementor.
How do visitors leave full screen?
Press Esc, or press the button again when it is inside the full-screen content.
Is it accessible?
Yes. It is a real button, the label states what it will do, and changes are announced.
Does it need JavaScript?
Yes. Without it the button is not shown.
Can I use it more than once on a page?
Yes. Each copy works on its own.
10 / Annual All Access subscription
Get fullscreen content toggle with Complementor
This module is included with all 1007 current Complementor solutions. Choose your production website allowance; every plan includes the same modules.
One website
$29USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $29 USD each year.
A few websites
$49USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $49 USD each year.
More websites
$99USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $99 USD each year.
Applicable taxes extra. Annual subscriptions renew automatically unless canceled in your customer account. Elementor Pro is required for Exclude current post. Read the terms and 14-day technical-issue refund policy.