Linux 软件免费装
Banner图

Light Modal Block

开发者 cloudcatch
dkjensen
更新时间 2025年8月21日 18:17
捐献地址: 去捐款
PHP版本: 6.6 及以上
WordPress版本: 6.8
版权: GPL-2.0-or-later
版权网址: 版权信息

标签

lightbox modal popup block gutenberg full-site-editing

下载

1.4.0 1.7.1 1.1.1 1.1.0 1.2.0 1.0.0 1.3.0 1.0.1 1.3.2 1.2.1 1.3.1 1.5.0 1.6.0 1.7.0

详情介绍:

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

安装:

  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

屏幕截图:

  • 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

常见问题:

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();

How can I prevent focusing on the first focusable element when the modal opens?

Paste the following code in your child themes functions.php file or similar: /* * Prevents the light modal block from focusing on a specific element when it opens. * * @return void / add_action( 'wp_enqueue_scripts', function () { wp_add_inline_script( 'cloudcatch-light-modal-block-view-script', 'window.lmbFocusableElements = "";', 'before' ); } );

How can I prevent scrolling when a modal is open?

The class lmb-open is added to the <body> of the page when a modal is open. You can use the following CSS to prevent scrolling .lmb-open { overflow: hidden; }

更新日志:

1.7.1 1.7.0 1.6.0 1.5.0 1.4.0 1.3.2 1.3.1 1.3.0 1.2.1 1.2.0 1.1.1 1.1.0 1.0.1 1.0.0