在启动块增强功能后不到一周,Phi Phan 发布了另一个项目:Icon Dividers。它是一个块插件,用于使用 SVG 图标创建自定义分隔线。
“我正在努力支持核心/分隔符中的图标,”Phan 在我们上次讨论将图标添加到核心块时说道。 “但这需要更改标记。所以我可能会为此创建一个新的小块。”现在,他正在核对他在待办事项清单上提到的众多想法中的至少一个。
只做一件事并且做得很好的插件通常是我最喜欢的扩展类型,Icon Separator 也不例外。这也是区块系统本身的妙处。它旨在允许用户将小部件粘贴到任何地方。
当第一次插入图标分隔块时,它看起来很像任何其他普通分隔符。它在屏幕上输出一条简单的水平线:
图标分隔符字符块的默认输出。
欢迎用户在默认状态下使用它,但不会很有趣。这个块是关于图标的。
该插件捆绑了来自 WordPress、Bootstrap 和 Ionicons 库的 3,500 多个图标,为用户提供了大量选择。它似乎是 Phan 的 Block Enhancements 插件的遗留物——重用相同的代码是有意义的。此块还允许用户为自定义图标输入 SVG 代码。
快速选择一个图标,开始在编辑器中自定义分隔符输出:
自定义图标分隔块。
该插件有很多选项可以让用户自己制作。除了选择图标外,他们还可以自定义其填充和描边颜色、大小、间距、位置和对齐方式。
该块还具有自定义分隔线本身的选项,包括实线、虚线和点线样式。用户可以更改其对齐方式、宽度、颜色等。
各种图标和分隔符修改。
这个块是 WordPress 中可重用块系统的理想用例。假设用户想在他们的网站上使用相同的分隔符设计,设计一次并保存一份副本以在需要的地方使用是有意义的。
插件没有使用
HTML 元素让我有点失望。上次与 Phan 交谈时,我很兴奋。我想看看有人会如何解决这个插件问题,但我希望它可以用语义来解决
。部分原因只是作为开发人员和设计师的好奇心,知道将其用作任何主题设计的通用块的局限性。
Phan 采取了使用包装器
并将图标
但是,我想指出的是,对于那些需要在内容中使用适当的水平线的人来说,这个块并不理想。
元素用于标记主题中断。在这些情况下,最好坚持使用核心分离块。
如果分隔线是设计元素而不是内容中断,那就疯狂吧。图标分隔块有很多选项。
出处