Full Screen Mode
This module provides a simple toggle button that allows users to switch to a distraction-free, full-screen mode for better content interaction. The button can be placed flexibly as a block and customized for appearance and visibility.
The Full Screen Mode module for Drupal provides users with a distraction-free, full-screen experience. With a simple toggle button, users can switch between normal and full-screen modes, allowing for smooth content interaction without distractions. This module enhances the user experience on any Drupal site by offering a clean, focused viewing mode.
Implementing the full screen button as a Drupal block allows flexible placement in any region and control over visibility based on pages, roles, content types etc. It makes configuration, reuse, and management simple and efficient.
Installation
- Full Screen Mode, like all Drupal modules, should be installed via Composer:
composer require drupal/full_screen_mode - Or install it as you would normally install a contributed Drupal module. See:
https://www.drupal.org/docs/8/extending-drupal-8/installing-modules
Features
- Fullscreen Toggle: Adds a button that toggles between normal and full-screen modes.
- Customizable Button: Allows fine-tuning of button placement, size, and styling.
- Supports Modern Browsers: Works with most major browsers that support the Fullscreen API.
- Position Control: Customize the button's position (Top Right, Top Left, Bottom Right, Bottom Left) and its margin from the page edges.
- Button Appearance: Adjust stroke color, width, and button size.
- Hide on Mobile: Optionally hide the fullscreen button on mobile devices to avoid clutter on small screens.
Post-Installation
Once the Full Screen Mode module is installed, you'll need to enable the module and configure the button’s placement and appearance. Here's how:
- Go to Extend in the Drupal admin interface and enable the module.
- Navigate to Block Layout, find the Full Screen Mode block, and place it in a region of your theme where you'd like the fullscreen toggle button to appear.
- Configure the button’s position, size, and color via the block’s settings page.
That’s it! The button should now be visible on your site, allowing users to switch between normal and full-screen modes.
Additional Requirements
- Drupal Version: This module requires Drupal 10 or higher.
- Browser Support: A modern browser that supports the Fullscreen API (most major browsers such as Chrome, Firefox, and Safari support it).
Recommended Modules/Libraries
There are no specific recommended modules or libraries required for this module. However, for full functionality, your site should be using a modern theme that supports block regions.
Similar Projects
Troubleshooting & FAQ
- Button not visible? Ensure the Full Screen Mode block is enabled and placed in a visible region.
- Fullscreen not toggling? Verify that your browser supports the Fullscreen API.
- Button hidden on mobile? Check the “Hide on Mobile” option in the block configuration if the button is not visible on small screens.
Support
Please post bug reports, feature requests and support requests to the Full Screen Mode module issue queue. If you met any problems with this module - feel free to create an issue.