自适应表单核心组件简介

上次更新: 2023-11-29
  • 创建对象:
  • Developer
    Admin
    User

使用 Adobe Experience Manager 中的自适应表单核心组件,您可以利用灵活性和可用的自定义选项创建引人入胜的注册体验。

核心组件

在 Adobe Experience Manager (AEM) 中,组件是用于创建页面和表单的构建基块。它们使作者能够通过一种简单而强大的方式创建和管理内容,并为开发人员提供了创建自定义组件所需的灵活性和可扩展性。它们旨在加快开发时间并降低网站和表单的维护成本,其操作灵活并且可以轻松定制,以满足网站和表单的特定需求。

此外,核心组件经过设计,具有响应能力并支持一系列广泛的设备,包括台式机、平板电脑和智能手机。它们还遵循最新的 Web 标准和最佳实践,这使其成为用于创建 Web 内容的强大且可靠的解决方案。

总的来说,核心组件是用于在 AEM 中创建和管理 Web 内容的重要工具,它提供了强大而灵活的解决方案,可帮助减少开发时间和维护成本,同时还为网站访客提供出色的用户体验。

自适应表单核心组件

自适应表单核心组件是一组(24 个)开源且与 BEM 兼容的组件,它们基于 Adobe Experience Manager WCM 核心组件而构建。它们专门设计用于创建自适应表单,后者是能够适应用户的设备、浏览器和屏幕大小的表单。

利用这些组件,可提供一系列广泛的表单字段选项(包括文本字段、复选框、下拉菜单等)来创建卓越的数据捕获和注册体验。它们还包括验证、条件逻辑和响应式设计等功能,可用于创建用户友好且易用的表单。

此外,由于这些组件是开源的,因此,开发人员能够轻松定制和扩展组件以满足其组织的特定需求。而且,这些组件基于 BEM 方法而构建,这确保了它们可扩展且可维护。

自适应表单图像

功能

可以即刻投入使用 自适应表单核心组件是 24 个功能强大的 WCM 组件。
云就绪 适用于 AEM Forms as a Cloud Service
可以通用 这些组件代表了表单作者可用来设计几乎任何布局的通用概念。
可配置 模板级内容策略定义了可以使用或无法使用的功能。
可访问 它们提供 ARIA 标签,支持键盘导航以及用于屏幕阅读器等辅助技术的文本。
可主题化 这些组件实施样式系统,且标记遵循 BEM CSS 约定
可自定义 可利用几种模式来轻松进行自定义设置(从调整 HTML 到高级功能重用)。
版本控制 版本控制策略可确保核心组件在改进可能影响您的内容时不会中断您的网站。
开源 如果有出错的地方,请做出您的改进。

好处

数据捕获体验对于商机开发和注册至关重要,自适应表单核心组件提供了功能强大的解决方案来创建针对数据捕获优化的表单。使用核心组件在基础组件上创建这些体验的一些益处包括:

  • 可在 GitHub 上获得并提供内容全面的文档:AEM Adaptive Forms 核心组件是开源的,可在 GitHub 上获得,并提供全面的文档。这使开发人员能够更容易理解相关组件及其工作方式,并为其开发做出贡献。Aemcomponents.dev 网站也是一项宝贵的资源,开发人员可以在其中查看正在运行的组件并访问详细的文档。

  • 样式的 BEM 模型:核心组件遵循 BEM(块元素修饰符)样式模型,这是一种行之有效且广泛使用的 CSS 组织方法。这使开发人员更容易理解相关样式的组织方式,以及如何修改它们,以满足其特定需求。

  • 不依赖第三方库:核心组件的优势之一是它们不依赖于第三方 JavaScript 库,包括 JQuery 和 Underscore。这使得组件能够更快、更轻巧,并且更容易集成到现有的 AEM 实施中。

  • 专注于性能和可访问性:核心组件在构建时考虑到了性能和可访问性,这反映在其较高的 Google Lighthouse 和 Web Vitals 得分中。这使开发人员可以更轻松地创建可访问且高性能的网页,而这在当今的数字环境中越来越重要。

  • Sites 30 模板和主题中的表单组件:核心组件为 Sites 30 模板和主题中的表单组件提供支持,使开发人员可以更轻松地在 AEM 中创建和自定义表单。

  • 更容易设计样式:与对应的基础组件相比,核心组件更容易设计样式。 主题创建过程类似于 Sites,并且能够从父 Sites 页面继承相同的主题/CSS。此外,用于样式的 BEM 模型使理解和修改各个样式变得更加容易。

  • 辅助功能:自适应表单核心组件支持辅助功能标准和指南,以确保残障人士(包括那些使用屏幕阅读器等辅助技术的人员)能够使用表单。

自适应表单核心组件

当前版本的自适应表单核心组件具有以下所列组件。

设置自适应表单核心组件

通过在 AEM Forms as a Cloud Service 上启用自适应表单核心组件,您可以使用 AEM Forms Cloud Service 实例为多个渠道创建、发布和投放基于核心组件的自适应表单和 Headless 表单。有关启用自适应表单核心组件的详细说明,请参阅在 AEM Forms as a Cloud Service 和本地开发环境上启用自适应表单核心组件

自适应表单核心组件具有以下要求。

AEM 版本 AEM Forms 附加组件 自适应表单核心组件
AEM as a Cloud Service 表单 - 数字注册 版本 2.0.10 以上
AEM 6.5 Forms 附加组件 版本 1.1.12 以上

如果您的 AEM Cloud Service SDK 版本低于 2023.02.0,请确保在您的环境上启用 prerelease 标志,因为自适应表单核心组件是低于 2023.02.0 版本的预发行版本的一部分。

创建基于核心组件的自适应表单

您可以在 AEM Forms as a Cloud Service 或 AEM 6.5 Forms 环境中执行以下操作:

操作 AEM Forms 版本
创建独立的自适应表单 AEM Forms as Cloud Service
在 AEM Sites 页面中创建自适应表单 AEM 6.5 FormsAEM Forms as Cloud Service
在 AEM 体验片段中创建自适应表单 AEM 6.5 FormsAEM Forms as Cloud Service
将自适应表单转换为体验片段 AEM 6.5 FormsAEM Forms as Cloud Service

在此页面上