HM Modal Block
Simple modal block for WordPress block editor
by Human Made Limited · github.com/humanmade/modal-block · website
★ 0stars
5.4kcomposer installs
0forks
Install
No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:
wp plugin install https://github.com/humanmade/modal-block/archive/refs/heads/main.zipAlso on Packagist as humanmade/modal-block:
composer require humanmade/modal-blockFrom the readme
HM Modal Block
Simple modal block for the WordPress block editor.
Description
This plugin provides a modal component with two blocks:
- Modal Trigger: Container block where you add your trigger element (button, image, etc.)
- Modal Content: Renders the modal overlay with your content
Features
- Accessible keyboard navigation with focus trapping
- Auto-pause videos/iframes when modal closes
- Overlay click and Escape key to close
- Customizable trigger and content using any WordPress blocks
Installation
For Development
1. Clone or download to /wp-content/plugins/modal-block/
2. Run npm install && npm run build
3. Activate the plugin in WordPress
For Production
1. Download a release bundle or clone the release branch
2. Upload to /wp-content/plugins/modal-block/
3. Activate the plugin in WordPress
Usage
1. Add the Modal Trigger block to your page
2. Inside it, you'll see:
- A placeholder paragraph (replace this with your trigger: button, image, text, etc.)
- A Modal Content block (automatically added)
3. Add your modal content inside the "Modal Content" block
4. On the front-end, clicking the trigger opens the modal overlay
Tip: Add the class modal-trigger to your tr
Read the full README on GitHub →