自适应表单模板

创作表单时,您添加字段和组件以在编辑器中定义表单结构、内容和操作。 您可以在表单容器的guideRootPanel中添加字段和组件。 使用模板编辑器,您可以创建一个模板,其中包含作者可用于创建表单的基本结构和初始内容。

例如,您希望所有表单作者在登记表单中都具有某些文本框、导航按钮和提交按钮。 您可以使用作者可用来创建与其他注册表单一致的表单的组件创建模板。 当作者使用模板创建自适应表单时,新表单会继承您在模板中指定的结构和组件。 模板编辑器允许您:

  • 在结构层中添加表单的页眉和页脚组件。
  • 提供表单的初始内容。
  • 指定主题,提交操作。

使用模板

您可以通过导航到​Adobe Experience Manager >工具>模板​从“工具”菜单访问模板编辑器。 此处,模板按启用了可编辑模板的文件夹进行组织。 AEM提供一个全局文件夹来组织模板。 但是,默认情况下不启用它。 您可以请求管理员启用全局文件夹,或为模板创建新文件夹。 有关如何创建文件夹的详细信息,请参阅模板文件夹

点击以打开文件夹后,您会发现一个“创建”按钮,通过该按钮可以为自适应表单创建新模板。

创建模板

创建文件夹后,请打开该文件夹,然后执行以下步骤以创建模板:

  1. 在“模板”控制台中,点按您创建的文件夹中的​创建

  2. 在“选取模板类型”部分,选择​自适应表单模板​并点按​下一步

  3. 在“模板详细信息”部分,提供模板标题,然后点按​创建
    您可以提供描述和缩略图,您可以在创建表单时选择创建的模板时看到这些描述和缩略图。

  4. 点按​完成​以返回控制台,或点按​打开​以在编辑器中打开模板。

模板编辑器UI

打开模板进行编辑时,可以看到以下AEM编辑器组件:

  • 页面工
    具栏包含以下选项:

    • 切换侧面板:允许您显示或隐藏提要栏。

    • 页面信息:允许您指定诸如发布/取消发布时间、缩略图、客户端库、页面策略和页面设计客户端库等信息。

    • 模拟器:可让您模拟和自定义不同设备的外观。

    • 图层选择 器:用于更改图层。可以选择​结构​层或​初始内容​层。 结构图层允许您添加和自定义页眉和页脚。 使用初始内容图层可自定义表单内容。

    • 预览: 允许您预览模板在发布时的外观。您可以使用图层选择器和预览切换编辑和预览模式。

  • 提要栏: 提供内容、属性、资产和组件浏览器。

  • 组件工具栏 :选择组件时,您会看到一个工具栏,通过它可以自定义组件。

  • 页面:添加内容以创建模板的区域。

请参阅创作自适应表单的简介以了解触屏UI编辑器。

编辑模板

自适应表单模板是使用两个图层创建的:

  • 结构
  • 初始内容

预览选择器位于屏幕右上角的图层选项旁边。

结构

在模板编辑器中选择结构层时,您可以在自适应表单容器的上方和下方看到布局容器。 作者可以对页眉和页脚使用这些布局容器。 您可以添加、编辑或自定义页眉和页脚。 将自适应表单标题组件拖放到自适应表单容器上方的布局容器中,以自定义模板标题。 将自适应表单页脚组件拖放到自适应表单容器下的布局容器中,以自定义模板页脚。

结构图层中的布局容器

结构图层中的布局容器

A.页 眉组件的布局容器 B.页 脚组件的布局容器

将自适应表单标题组件拖放到自适应表单容器上方的布局容器中。 添加组件后,您可以指定其属性,以便添加徽标并提供其标题。

同样,当您将页脚组件拖放到自适应表单容器下的布局容器时,您可以提供版权信息和公司详细信息。

在“结构”图层中添加的页眉和页脚

在“结构”图层中添加的页眉和页脚

在结构层中锁定/解锁组件

在编辑模板时,选择了结构图层,可解锁模板的页眉和页脚。 如果在模板中解锁某个组件,表单作者可以在使用该模板的自适应表单中编辑该组件。 锁定组件可防止表单作者在自适应表单中编辑组件。 锁定选项在组件工具栏中可用。

例如,您可以在模板中添加标题组件。 选择组件时,组件工具栏中会显示一个锁定选项。 通常,标题包括公司名称和徽标,您不希望表单作者更改模板中的徽标和标题。 在使用模板创建的具有标题组件锁定的自适应表单中,表单作者无法更改徽标和公司名称。

注意

不建议单独锁定或解锁标题组件中的图像或徽标。 您可以解锁标题组件。

初始内容

选择“初始内容”选项后,模板的“自适应表单”容器将像要编辑的自适应表单一样打开。 与创作自适应表单一样,您可以指定初始设置,如选择主题和提交操作。

表单作者将其用作创建表单的基础。 内容流结构在模板的“初始内容”层中指定。 要切换到编辑表单模板的初始内容,请在页面工具栏中预览之前,点按画布下拉框 >初始内容
模板编辑器中的初始内容图层

模板编辑器中的初始内容图层显示为指定属性而选择的自适应表单容器。

初始内容

在“初始内容”图层中,创建作者用作基础的自适应表单模板。 创作模板与创作表单类似,您可以使用侧栏中提供的选项。 侧栏提供内容、属性、资产和组件浏览器。

请参阅Sidebar

注意

当您选择“存储内容”或“存储PDF”作为“提交操作”时,您可以选择指定存储路径。 如果在模板中指定路径,则从模板创建的所有表单都具有相同的路径。 您可以指定正确的存储路径,或者确保表单作者更新该路径以防止每个表单的数据存储在同一位置。

创建带有选项卡和面板的自适应表单模板 

例如,您希望创建具有以下选项卡的模板:

  • 常规信息
  • 专业信息

您添加了徽标、提供了标题,并在结构图层中添加了页脚。 锁定页眉和页脚,以阻止表单作者在使用模板创建表单时对其进行编辑。

将图层从“结构”更改为“初始内容”,并将内容添加到表单的开始。 要创建选项卡式结构,请在“自适应表单”容器的guideRootPanel中添加一个子面板。 要添加面板:

  • 选择​将组件拖动到此处​选项时,可以点按​+​按钮来添加面板。

  • 您可以从提要栏中的组件浏览器中拖放面板组件。

  • 您可以从组件工具栏中添加guideRootPanel的子面板。

要创建“一般信息”和“专业信息”选项卡,请在guideRootPanel的子面板中添加两个面板。 选择面板,然后点按cmppr以在提要栏中打开属性。 将元素名称分别更改为general-infoprofessional-info,将标题分别更改为“一般信息”和“专业信息”。 在提要栏中,点按内容以打开内容浏览器。 在“表单对象”选项卡中,选择guideRootPanel。 在编辑器中,选择了guideRootPanel。 点按组件工具栏中的cmppr以打开其属性。 在“面板布局”字段中,选择“顶部的​选项卡”,然后点按​完成。 将应用选项卡式模板结构。

在选项卡中添加内容

在自适应表单模板中添加字段

在添加面板并将它们构造为选项卡后,可以在选项卡中添加字段。 在编辑器中选择选项卡时,可以看到​将组件拖动到此处​选项。 您可以拖放组件,如文本框、列表项和按钮。 您可以在提要栏中从组件浏览器拖放组件。

每个组件都具有增强数据捕获和操作的属性。 例如,您可以启用组件的​必填字段​属性。 作者可以指定客户在跳过填写必填字段时看到的消息。 在​必填字段消息​属性中指定消息。

在示例模板中,“Name”(名称)、“Phone number”(电话号码)和“Date of bird”(出生日期)字段将添加到“General Information”(常规信息)选项卡中。 在“专业信息”选项卡中,添加“当前聘用”、“雇佣类型”、“教育资格”字段。

添加字段后,可以添加“提交”和“重置”等按钮。

启用模板

创建模板时,模板将添加为草稿。 启用模板以使用它创建自适应表单。 要启用模板,请执行以下操作:

  1. 导航到​Adobe Experience Manager >工具>模板,然后打开已在其中创建模板的文件夹。

  2. 您创建的模板将标记为“草稿”。

  3. 选择模板,然后点按工具栏中的​启用
    在创建自适应表单时,当系统要求您选择模板时,您可以看到列出的模板。

导入或导出模板

表单可与其模板配合使用。 当您下载使用自定义模板创建的自适应表单时,不会下载该模板。 在其他AEM Forms实例上导入表单时,将导入该表单,但不包含其模板。 如果导入了表单,但其模板不可用,则不会呈现该表单。 您可以从https://<server>:<port>/crx/packmgr/conf节点打包自定义模板,并将其移植到要上载表单的AEM Forms实例中。

使用模板创建自适应表单

在创建并启用模板后,在创建自适应表单时,模板可在表单管理器中使用。 要使用模板并创建自适应表单,请参阅创建自适应表单

更改现成模板的显示选项

您可以为自适应表单创建自定义模板来定义基本结构和初始内容。 AEM Forms还为自适应表单提供了一套开箱即用模板。 您可以选择显示或隐藏模板。

请执行以下步骤来显示和隐藏模板:

  1. 登录到AEM Forms作者实例,并导航到​Tools > Operations > Web Console

    注意

    AEM Web控制台的URL是https://'[server]:[port]'/system/console/configMgr

  2. 找到并打开​FormsManager Configuration​设置:

    • 要显示或隐藏现成的自适应表单模板,请选中或取消选中​“包括现成AF和AD模板”选项。
    • 要显示或隐藏已在AEM 6.0 Forms或AEM 6.1 Forms发行版中添加但现已弃用的自适应表单模板,请选中或取消选中​“包括AEM 6.0 AF模板”选项。 如果选中此选项,则要生效,它要求启用​“包括现成AF”和“AD模板”配置。
  3. 单击​保存。开箱即用模板的显示选项会更改。

推荐

  • 在模板编辑器中修改表单的属性时,请勿使用BindReference属性。
  • 如果要添加断点,请在创作自适应表单模板时创建断点。
    有关断点的详细信息,请参阅响应式布局

On this page

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now