Light Modal Block

説明

A simple yet robust solution for creating modals within the WordPress block editor.

🚀 View Demo

Features

  • Fully customizable using the native block editor style controls
  • Trigger modal on click for any element via CSS selector
  • Trigger modal on page load after X milliseconds
    • Set cookie to not show modal again on page load until X minutes have elapsed
  • Custom modal width
  • Optional close button
  • API enabled
  • Only 2kb gzipped
  • Accessibility enabled

Attribution

The Light Modal block uses a modified version of the Micromodal library.

スクリーンショット

  • Block editor modal settings
  • Show Modal block control enabled under the Advanced panel for various blocks
  • Native block styling enabled for modals
  • Custom panel reveals all modals enabled on page
  • Modal in list view

ブロック

このプラグインは1個のブロックを提供します。

  • Light Modal Block Lightweight, customizable modal block for the WordPress block editor

インストール

  1. Upload the plugin files to the /wp-content/plugins/light-modal-block directory, or install the plugin through the WordPress plugins screen directly.
  2. Activate the plugin through the ‘Plugins’ screen in WordPress

FAQ

How can I programatically open or close a modal?

Each modal is given a unique ID, which can be found inside the inspector controls of the block settings. It will look something like: Mk6I8L4haJB

To open a modal:

window.lightModalBlocks.get('modal-id-here').showModal(true);

To close a modal:

window.lightModalBlocks.get('modal-id-here').closeModal();

評価

2024年11月22日 1 reply
This has become my go-to solution for modals. Works seamlessly along with GeneratePress/GenerateBlocks. Thank you for your time developing this.
2024年8月13日
Many modal/pop-up plugins are just too heavy and complicated. This plugin is light and works simple. I had to find out a bit how it works exactly adding the modal with a css selector (maybe add a screenshot of this step?). The result looks good and works fine! Thanks.
2024年8月1日 1 reply
Completely down a rabbit hole on the WP Plugin Repo and came across this plugin that was so perfect, it shocked me! Simple to use and a great UX, and so unbelievably light weight too, it is insane – like it only adds about 5k to your page! (before the the content you add to it) It’s an absolute no brainer for me now, any time I need a popup in a Block Theme – thank you CloudCatch and David Jensen!
5件のレビューをすべて表示

貢献者と開発者

Light Modal Block はオープンソースソフトウェアです。以下の人々がこのプラグインに貢献しています。

貢献者

“Light Modal Block” をあなたの言語に翻訳しましょう。

開発に興味がありますか ?

コードを閲覧するか、SVN リポジトリをチェックするか、開発ログRSS で購読してみてください。

変更履歴

1.3.2

  • Fix: Unique modal ID not generating when duplicating block

1.3.1

  • Fix: When editing a pattern with a modal block, open modal by default

1.3.0

  • Enhancement: Add support for drop shadows

1.2.1

  • Fix: Modal blocks not showing in sidebar or advanced controls if a nested block

1.2.0

  • Enhancement: Add typography style controls

1.1.1

  • Fix: Block editor toolbar crash

1.1.0

  • Fix: Add backdrop color control
  • Enhancement: Set cookie to not display modal again until X minutes have elapsed
  • Enhancement: API to programatically open and close modal

1.0.1

  • Fix: Update CSS styling

1.0.0

  • Initial release