修复古腾堡图像浮动 — Ben Gillbanks

上周基思德文问是否有人知道如何修复古腾堡漂浮的图像块由于某种原因,浮动图像被包裹在一个包含 div 中。

我不确定为什么要这样做,但是代码就在那里,通过对齐方式挑选块并添加额外的包装器这使得浮动和定位内容变得困难,因为位置控件被添加到容器内。

Simon Blackbourn 建议使用render_block过滤器来调整 html,这就是我所做的。代码最终非常简单,基本上只是一些字符串替换。

代码首先检查我们是否使用了 Image 块。我们可以在 WP 5.7 中使用新的render_block_core/imagefilter简化这一点

然后我们遍历可能的对齐方式并检查当前块是否包含其中之一。如果是,那么我们首先删除旧的对齐方式,然后用我们删除的对齐方式替换包装器类——将对齐方式移到包装器上。最后我删除了所有空的类属性。

添加包装器以便某些对齐情况发生,但它们也意味着其他情况不会发生。关于这个 Gutenberg Github issue一个完整的解释去年这个时候 Github 问题非常活跃,但现在已经停滞不前,这表明它不会得到解决;但我希望我错了,因为改进这将使主题变得更简单。

我现在想知道是否将它添加到Toolbelt以及修复任何其他具有时髦渲染行为的块。例如,Pullquote 和 Blockquote 块有不同的包装器,这使得这两个块的样式始终很痛苦,所以也许也可以做些什么来改进它。

相关推荐: docker-wordpress迁移踩坑记录

01 事件概述之前在腾讯云服务器上搭建了一个内部wiki,使用的是docker-wordpress+docker-mysql的搭建方法,如今需要将网站迁移到本地服务器中,这里记录一下操作方法以及踩的一些坑。02数据备份首先需要将原网站的一些内容备份下…

© 版权声明
THE END
喜欢就支持一下吧
点赞0
分享