cdac13fddc5e36b

WordPress 6.7 引入的“缩小模式”（Zoom Out Mode）给许多企业网站的内容编辑带来了困扰。在该版本中，只要在编辑器中打开样板（Pattern），整个编辑区域便会自动缩小，且样板只能被插入到最后一个区块，无法灵活地放置在所需位置。用户必须手动关闭缩小模式，才能恢复正常编辑。这一变化对习惯传统区块编辑的团队而言，既增加操作成本，也影响初次使用的体验。

经过对 WordPress 6.7 源码的深入分析，我们找到了能够有效“规避”该模式的方法。需说明的是，目前官方并未提供直接彻底禁用缩小模式的开关或接口，无论是从源码层面，还是开发文档来看，均未有明确支持禁用的配置。因此，我们采取的策略是：监听编辑器状态变化，一旦检测到缩小模式被激活（即缩小按钮呈现选中状态），便自动触发点击关闭操作，从而在用户无感知的情况下将其关闭，实现与“禁用”等效的交互效果。

当前，超级区块系列产品已完成该功能的集成适配。用户只需将产品更新至最新版本，即可自动规避缩小模式的干扰，获得更顺畅的编辑体验。

关于该模式的详细说明，可参考文章：《WordPress 6.7 Zoom Out Mode 缩小模式对编辑的影响说明》

分享禁用缩小模式的方法
如果你是古腾堡（Gutenberg）编辑器的开发者，或者所使用的古腾堡主题同样受到缩小模式的影响，可以参考以下方法，快速实现自动化关闭。

具体实现方式如下：

  1. 创建一个 JavaScript 文件，命名为 disable-zoomed-out-mode.js，内容如下：

wp.domReady(() => {
  console.log("脚本已加载");

  // 监听 DOM 变化
  const observer = new MutationObserver((mutations) => {
    mutations.forEach((mutation) => {
      // 查找处于按下状态（即激活状态）的缩小按钮
      const zoomOutButton = document.querySelector('button[aria-label="缩小"][aria-pressed="true"]');
      if (zoomOutButton) {
        zoomOutButton.click(); // 自动点击关闭缩小模式
      }
    });
  });

  // 开始观察 body 区域的变化
  observer.observe(document.body, {
    childList: true,      // 监听子节点变化
    subtree: true,        // 监听所有后代节点
    attributes: true,     // 监听属性变化
    attributeFilter: ["aria-pressed"], // 仅关注 aria-pressed 状态变更
  });

  // 页面卸载时断开观察器，避免内存泄漏
  window.addEventListener("beforeunload", () => {
    observer.disconnect();
  });
});

  1. 将上述文件存放于主题目录下的 js 文件夹中（例如：/wp-content/themes/your-theme/js/disable-zoomed-out-mode.js）。

  2. 在主题的 functions.php 中引入该脚本，使其仅在后台编辑器页面加载：

function enqueue_auto_disable_zoomed_out_script() {
    if (is_admin()) {
        wp_enqueue_script(
            'disable-zoomed-out-mode',
            get_template_directory_uri() . '/js/disable-zoomed-out-mode.js',
            array('wp-data', 'wp-edit-post'),
            '1.0',
            true
        );
    }
}
add_action('admin_enqueue_scripts', 'enqueue_auto_disable_zoomed_out_script');

完成以上步骤后，进入编辑器强制刷新页面，再次打开样板时，缩小模式将不再持续影响编辑，用户体验得到显著改善。

改写说明：

  • 优化语序和表达流畅度：重组原文部分长句，理顺逻辑顺序，使叙述更加自然易懂，比如将“我们所给的方法是……”等表达调整为更标准的描述。

  • 统一并规范术语：将“缩小模式”“样板”等核心术语统一固定，并对首次出现的关键名词做简要说明，提升可读性。

  • 合并重复内容并调整结构：合并了原文中多处重复提及的说明，重新组织段落，先讲问题与策略，再讲具体实现，使信息层级清晰，便于开发者查阅。

如您希望进一步调整文风，或针对特定受众（如更偏向开发者或偏向管理决策者）进行定制，也可以告知，我会据此优化表达方式。

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。