ACF Blocks 提供从 Advanced Custom Fields Pro 构建的各种块

已发表: 2020-05-07

上周末,Munir Kamal 发布了他的 ACF Blocks 插件的 2.0 版,这是一个为编辑器创建一套块的项目。 该插件在其免费版本中提供 18 个自定义块,在专业升级中提供 15 个更多。 它建立在 Advanced Custom Fields Pro (ACF Pro) 之上。

该插件的最新更新增加了对排版的支持,包括使用各种 Google 字体进行块内文本的选项。 Kamal 还包括用于设计功能的基本样式选项,例如插件中每个块的边距和填充。

使用 ACF Pro 作为硬依赖,它限制了 ACF 块的受众。 在很大程度上,这个插件对于需要在预算范围内为客户快速构建功能的机构和自由职业者很有用。 为此,该插件做得很好。

与 ACF Pro 的紧密耦合会损害插件的用户体验。 但是,ACF Blocks 背后的思想及其自定义选项弥补了依赖其依赖父插件的缺点。 将两者分离是不可能的,但它会带来更流畅的体验并将插件开放给更广泛的受众。

Kamal 从 ACF 及其专业版中获得了插件的灵感。 他描述了使用框架构建块的过程“超级简单”,即使对于中级开发人员也是如此。 “多年来,创建自定义字段一直是一个非常棒的 WordPress 框架,”他说。 “当 [Elliot Condon] 宣布 ACF 中的块创建功能时,这很快促使我构建了这个即用型 ACF 块的集合。”

最大的技术限制是 Kamal 无法构建嵌套块,这是 ACF 当前的限制。 “我已经与 [Condon] 讨论过,他已经在致力于尽快推出该功能,”他说。 “一旦涉及到 ACF,我们可能会创造出更惊人、更强大的 Gutenberg Blocks。”

观看插件如何工作的简短演练:

有用的积木分类

在主要测试 ACF Blocks 的免费版本时,我发现它有几个有用的块可以立即满足最终用户的常见需求。 有 18 个可用块,用户在决定是否要升级到专业版之前有很多工作要做。

集合中最好的块之一是照片拼贴块。 这是 ACF Blocks 对核心 Gallery 块的回答。 仅此块的网格选项就使该插件值得一试。 该块提供 2 到 15 个网格布局,具体取决于用户选择的网格选项。

WordPress 编辑器中 ACF 块插件的照片拼贴块的屏幕截图。
设置照片拼贴块的网格。

我第二喜欢的分类是推荐块。 再加上适用于所有块的排版选项,您可以在设计推荐部分时获得很多乐趣。

来自 WordPress 编辑器中 ACF 块插件的推荐块的屏幕截图。
在推荐块中修改 Google 字体。

这是插件可以做什么的一小部分。 价目表块可以帮助餐厅网站设置菜单。 定价框块,尤其是嵌套在核心列块中时,可以轻松设置具有多个产品选项的定价部分。 而且,团队块使在公司的团队/关于页面上创建个人资料部分变得简单。

免费版中提供了以下块(专业版中还有更多块):

  1. 可滚动图像块
  2. 选项卡块
  3. 切换块
  4. 手风琴块
  5. 图像滑块
  6. 社交分享块
  7. 照片拼贴块
  8. 帖子块
  9. 推荐块
  10. 团队块
  11. 多按钮块
  12. 定价框块
  13. 价目表块
  14. 开始评分块
  15. 进度条块
  16. 计数器编号块
  17. 点击推文阻止
  18. 营业时间块

整个套件中,Kamal 最喜欢的块是 Image Hotspot,它允许用户设置带有“指针”的图像背景以弹出内容; Before After Image,允许用户使用滑动条比较两张图像; 和照片拼贴,插件的基于网格的画廊块。 前两个仅在插件的专业版中可用。 插件创建者说他认为所有的块都很有用,但这些是构建起来最有趣的。

改进空间

ACF Blocks 是一个不错的概念。 它得到了很多正确的东西。 但是,有一些小问题会影响使用其块的体验。 这些问题并非不可克服,我希望 Kamal 将在即将发布的版本中解决这些问题,基于对他过去工作的熟悉度,并推动为用户打造出色的产品。

最直接且可能最容易解决的问题是插件在每个块上的左右边距样式。 该插件默认将这些边距重置为0 。 根据站点上的活动主题,这可能会将块移动到屏幕边缘而不是前端的内容区域。 一些主题使用左/右边距来对齐内容。 这不仅仅是 ACF 块的问题。 它在具有前端输出的插件中很普遍。

保证金问题的一种快速解决方案是将任何插件块包装在核心 Group 块中。 这将把边距重新置于主题的控制之下。

编辑块内容发生在块选项面板中,而不是直接在块中。 我不确定这是使用 ACF Pro 框架的限制还是 Kamal 的设计决定。 在内容区域的编辑内容和边栏中的编辑内容之间跳转感觉很奇怪。

我与块内容混淆的一个例子是照片拼贴块。 我单击了该块,希望出现媒体库以供上传。 没啥事儿。 我再次点击是因为,好吧,也许我第一次没有得到很好的点击。 没啥事儿。 我最终在右侧块的选项面板下找到了图像上传按钮。

设置块选项有时会感觉有点迟钝,因为编辑器中的块输出不会立即反映更改。 这主要是因为 ACF Blocks 依赖于 ACF Pro 的服务器端渲染功能。 这不太可能在块插件中解决。 一些用户在编辑多个选项时可能会发现延迟渲染很乏味。

最后的想法

Kamal 整理了一组有用的模块,这些模块将帮助许多最终用户构建他们无法开箱即用的内容部分。 在免费版和专业版之间,总共有 33 个区块。 创建者致力于根据用户反馈随着时间的推移添加更多块。 在不久的将来,他计划继续进行错误修复和改进代码。

我仍然觉得 ACF Pro 的工作方式阻碍了如果从头开始构建这个插件的效果。 话虽如此,该框架帮助使 Kamal 的插件成为现实。 ACF Blocks 展示了通过 ACF Pro 实现的可能性,它应该会激励其他正在寻找构建在 WordPress 生态系统中最广泛使用的框架之一之上的解决方案的开发人员。

Kamal 了解一些 ACF Pro 用户可能会尝试创建类似的块,但他觉得他的团队的知识和提供支持的奉献精神是等式中最重要的部分。 “ACF Blocks 节省了自己为最常见的网页设计元素创建块的时间和精力,”他说。

注意:此插件评论和反馈是插件作者要求的。 阅读我们关于基于真实体验的诚实反馈的帖子,以获取有关如何处理评论的更多信息。