David Jensen

CloudCatch

<p>A simple yet robust solution for creating modals within the WordPress block editor.</p>
<p>🚀 <a href="https://light-modal-block.cloudcatch.io/" rel="nofollow ugc">View Demo</a></p>
<h3>Features</h3>
<ul>
<li>Fully customizable using the native block editor style controls</li>
<li>Trigger modal on click for any element via CSS selector</li>
<li>Trigger modal on page load after X milliseconds
<ul>
<li>Set cookie to not show modal again on page load until X minutes have elapsed</li>
<li>Option for user interaction within modal triggers cookie to be set</li>
</ul>
</li>
<li>Custom modal width</li>
<li>Optional close button</li>
<li>API enabled</li>
<li>Only 2kb gzipped</li>
<li>Accessibility enabled</li>
<li>Use modals within the query loop block</li>
</ul>
<h3>Attribution</h3>
<p>The Light Modal block uses a modified version of the <a href="https://github.com/Ghosh/micromodal" rel="nofollow ugc">Micromodal</a> library.</p>


Light Modal Block

Lightweight, customizable modal block for the WordPress block editor

Rodrigo Leon

<p>This small plugin allows you to create a modal / popup / lightbox with WordPress’ default Block editor (Gutenberg). The plugin provides you with a block that can be used for the modal’s trigger and the modal’s window contents. Anything you can do with the block editor, you can use for the modal trigger or the contents.</p>
<ul>
<li>Multiple trigger methods. Use the power of the Block Editor to create your trigger (buttons, images, covers, and more).</li>
<li>Flexible modal content. Similarly to the trigger, use the Block Editor to define the content inside your modal content.</li>
<li>Supports multiple modals on the same page.</li>
<li>More to come.</li>
</ul>
<p>To create a modal, simply use the Modal Builder block to create a trigger. Use another Modal Builder block to create the content (make sure you select the appropriate content type under the modal settings). On both instances, set the “Content ID” to whatever you want as long as both instances match. You are set.</p>
<h4>Donations</h4>
<p>If you like the plugin, consider leaving a donation to support further development of the plugin. <a href="https://paypal.me/rodxleon" rel="nofollow ugc">Click here</a>. If you would like custom solutions or the like, please visit <a href="https://htr.design" rel="nofollow ugc">HTR.Design</a>.</p>


Modal Builder Block

Build a modal with the power of WordPress' block editor. Anything you can do with the editor works inside of the modal content window or the moda …

Light Modal Block vs Modal Builder Block