WordPress 6.7 中的 “帖子编辑器 ”iframing 与元框

在尝试将帖子编辑器 iframe 化之后,元框的存在成为一个阻碍条件,阻止编辑器内容在iframe中加载,并使 iframe 的这些好处不可用:

  • 将块和主题CSS与编辑器UI隔离
  • 媒体查询和视口相关 CSS 单位的准确性
WordPress 6.7 中的 “帖子编辑器 ”iframing 与元框

这些优势对于支持编辑器和前端的 CSS 重用以及简化块和主题开发非常重要。即使存在元框,社区成员也一直在努力将它们引入帖子编辑器,但经过多次尝试确定 如何调整界面以将元框与帖子内容分开。

现在实现了分割视图,支持编辑器内容和元框同时可见。此更改可确保编辑器和前端视图之间一致的所见即所得体验。此外,它使元框比以前更容易使用,并允许在使用任何元框时直观地引用帖子内容的任何部分,反之亦然。

WordPress 6.7 中的 “帖子编辑器 ”iframing 与元框

iframe 的剩余例外情况

目前,阻止 iframe 始终使用的最后一个条件是是否有任何块使用其apiVersion小于注册3。然而,即使这个条件也可能会在未来的版本中被删除,并且如果网站使用Gutenberg 插件并且基于块的主题处于活动状态,它已经有一个例外。

边缘情况和兼容性

添加元框的插件开发人员应该注意两件事。第一,元框容器现在会剪切溢出元素,因此如果一些弹出式 UI(例如下拉菜单)从元框容器向上延伸,它们将被切断。但是,如果它们被渲染到容器外部的 DOM 的一部分,这将不是问题。第二,如果您的插件还添加了任何富文本格式,并且编辑 UI 锚定在文本选择上,那么它们的实现必须与 iframe 兼容。这不是一个新的要求,但对于仅扩展帖子编辑器的插件来说可能被忽视了。

WordPress 6.7 中的 “帖子编辑器 ”iframing 与元框

溢出裁剪

为了确保这不是问题,可以使任何类似弹出窗口的 UI 在元框中向下打开,或者通过将弹出窗口渲染到不在元框容器内的 DOM 部分。例如,后者是 和 组件的默认工作方式PopoverDropdown使用DropDownMenu它们@wordpress/components将确保即使 UI 超出元框容器的顶部也不会被裁剪。

富文本格式 UI 锚定

如果插件实现了自定义代码来锚定或定位 UI,那么这可能只是令人担忧的。如果插件已经使用了useAnchor来自@wordpress/rich-texteverything 的推荐钩子,那么它应该可以正常工作。如果不是,可以参考 Gutenberg 自己的链接编辑 UI组件,了解其用法的典型示例。

WordPress 6.7 中的 “帖子编辑器 ”iframing 与元框

联系我们
文章看不懂?联系我们为您免费解答!免费助力个人,小企站点!
电话:020-2206-9892
QQ咨询:1025174874
邮件:info@361sale.com
工作时间:周一至周五,9:30-18:30,节假日休息
发布者:光子波动,转转请注明出处:https://www.361sale.com/21819/

(1)
上一篇 2天前
下一篇 1天前

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

联系我们

020-2206-9892

QQ咨询:1025174874

邮件:info@361sale.com

工作时间:周一至周五,9:30-18:30,节假日休息

客服微信