Show Menu
主题×

教程: 创建交互式通信

本教程是创建您的第一个 交互式通信系列中的一个 步骤。 建议按照时间顺序按照系列来了解、执行和演示完整的教程用例。
为Web版本创建了表单数据模型、文档片段、模板和主题等所有构建基块后,您就可以开始创建交互式通信。
交互式通信可通过两种渠道提供: 印刷和Web。 您还可以创建交互式通信,将打印渠道作为主控。 Web渠道的打印为主控选项可确保Web渠道的内容、继承和数据绑定是从打印渠道派生的。 它还确保在打印渠道中所做的更改在Web渠道中同步。 但是,允许交互通信作者在Web渠道中中断特定组件的继承。
本教程将指导您逐步为印刷和Web渠道创建交互式通信。 在本教程的结尾,您将能够:
  • 为打印渠道创建交互式通信
  • 为Web渠道创建交互式通信
  • 创建印刷和Web交互式通信,将印刷作为主控

无需同步即可创建用于印刷和Web的交互式通信

创建交互式通信以进行打印渠道

以下是本教程中已创建的资源列表,创建打印渠道时需要这些资源:
表单数据模型: FDM_Create_First_IC
布局片段: table_lf
图像: PayNow和ValueAddedServices
  1. 登录到AEM作者实例,然后导航到 Adobe Experience Manager > 表单 > 表单和文档
  2. 点按 创建 ,然后选择 交互式通信 。 将显 示“创建交互 ”通信向导。
  3. 在“ 标题”和 “名称”字 段中指 定create_first ​_ic。 选 择FDM_Create_First_IC作为表单 “数据模型”,然后点 按下一 ​步。
  4. 在渠道 向导 :
    1. 定create_first_ic_print_template 作为打印模板,然后点按 选择 。 确保未选 中“将打印用作Web渠道的主控 ”复选框。
    2. 指定 Create_First_IC_templates文件夹 > Create_First_IC_Web_Template作为Web模板 ,然后点按 选择
    3. 点按​ 创建
    将显示一条确认消息,提示已成功创建交互式通信。
  5. 点按 编辑 ,以在右窗格中打开交互式通信。
  6. 转到“资 ”选项卡,应用筛选器以在左窗格中仅显示文档片段。
  7. 将以下文档片段拖放到交互通信中的目标区域:
    文档片段
    目标区域
    bill_details_first_ic
    BillDetails
    customer_details_first_ic
    客户详细信息
    bill_summary_first_ic
    帐单摘要
    summary_charges_first_interactive_communication
    费用
  8. 点按 图表 目标区域,然 后点按 +以添加图 表组件
  9. 点按图表组件,然后选 (Configure)。 图表属性显示在左窗格中:
    1. 指定图表的名称。
    2. 从“ 图表类 ”下 拉列表中选择“饼图”。
    3. 从X轴 的调用数 据模型 对象类型中选 择调用类型属性 。 点
    4. Function (函数) 下拉 列表中选择Frequency(频率)。
    5. 从Y轴 部分 的调用数据模 型对象类 型中选择调 用类型属性。 点
    6. 点按 以保存图表属性。
  10. 转到“资 ”选项卡,应用筛选器以在左侧窗格中仅显示布局片段。 将table_lf布局片 段拖放 到“项目化调 ”目标区。
  11. 在“日期”列中选择 文本 字段,然 configure_icon(Configure)。
  12. 从“ 绑定类型 ”下拉 列表中选择 “数据模型对象 ”,然后选择“调 用” > “调用日期”。 点按 ,以保存属性。
    同样,在 Calltime 、Callnumber、Calldime 、CalldimeCharges 中分别创建与Calltime、CalldimeCarges、 列、CalldimeCharges、CalldCarges列中的文本字段绑定。
  13. 点按 PayNow 目标区域,然 后点按+ 以添加图 像组件
  14. 点按图像组件并选 (Configure)。 图像属性显示在左窗格中:
    1. “名 称”字段中指定PayNow作为图像 名称
    2. 按上 ​传 ,选择保存在本地文件系统上的图像,然后点按打 ​开。
    3. 以保存图像属性。
  15. 重复第13步和第14步, 将ValueAddedServices图 像添加 到ValueAddedServices 目标区域中。

Create Interactive Communication for Web channel

以下是本教程中已创建的资源列表,创建Web渠道时需要这些资源:
表单数据模型: FDM_Create_First_IC
图像: PayNowWeb和ValueAddedServicesWeb
  1. 登录到AEM作者实例,然后导航到 Adobe Experience Manager > 表单 > 表单和文档
  2. 点按 创建 ,然后选择 交互式通信 。 将显 示“创建交互 ”通信向导。
  3. 在“ 标题”和 “名称”字 段中指 定create_first ​_ic。 选 择FDM_Create_First_IC作为表单 “数据模型”,然后点 按下一 ​步。
  4. 在渠道 向导 :
    1. 定create_first_ic_print_template 作为打印模板,然后点按 选择 。 确保未选 中“将打印用作Web渠道的主控 ”复选框。
    2. 指定 Create_First_IC_templates文件夹 > Create_First_IC_Web_Template作为Web模板 ,然后点按 选择
    3. 点按​ 创建
    将显示一条确认消息,提示已成功创建交互式通信。
  5. 点按 编辑 ,以在右窗格中打开交互式通信。
  6. 点按左 窗格 中的渠道选项卡,然后点 按Web
  7. 转到“资 ”选项卡,应用筛选器以在左窗格中仅显示文档片段。
  8. 将以下文档片段拖放到交互通信中的目标区域:
    文档片段
    目标区域
    bill_details_first_ic
    BillDetails
    customer_details_first_ic
    客户详细信息
    bill_summary_first_ic
    帐单摘要
    summary_charges_first_interactive_communication
    费用
  9. 点按 “费用汇总 ”目标区域,然 后点按+ 以添加图表 组件
  10. 点按图表组件,然后选 (Configure)。 图表属性显示在左窗格中:
    1. 指定图表的名称。
    2. 从“ 图表类 ”下 拉列表中选择“饼图”。
    3. 从X轴 的调用数 据模型 对象类型中选 择调用类型属性 。 点
    4. Function (函数) 下拉 列表中选择Frequency(频率)。
    5. 从Y轴 节的 “调用 ”数据模型对象类型 中选择calltype属性。 点
    6. 点按 以保存图表属性。
  11. 从左 窗格中 ,选择“数据源”选项卡,将调用数据模型 对象拖放到 “分项调用 目标区。 调用数据模 型对象 中的所有属性均显示为右侧窗 格的“分项调用 ”目标区中的表列。
    根据用例,您需要表中的“呼叫日期”、“呼叫时间”、“呼叫号码”、“呼叫持续时间”和“呼叫费用”列。
  12. 选择 Mobilenum 表列标题,然后选 择更多选项 > 删除列 。 同样,删除“ Calltype ”列。
  13. 选择调 用日 期表列标题并点 (编辑)以将文本重命名为 调用日期 。 同样,重命名表中的其他列标题。
  14. 根据用例,在交互通信 中插入 “立即付费”按钮,该按钮为用户提供通过单击按钮进行付款的选项。 执行以下步骤以插入按钮:
    1. 点按 立即付 目标区域,然后点 按+ 以添加文 本组件
    2. 点按文本组件,然后点 辑(编辑)。
    3. 将文本重命名为“ 立即支付 ”。
    4. 选择文本并点按超链接图标。
    5. 在“路径”字段中指定 付款 URL。
    6. 目标 下拉 式列表 中选择“新建选项卡”。
    7. 点按 以保存超链接属性。
  15. 列表 (位于预览选项旁)的下拉 中选择 Style。
  16. 设置超链接文本的样式,以在交互通信中将其显示为按钮,步骤如下:
    1. 点按文本组件,然后选择 (编辑)。
    2. 在“边 ”部分中, 将1.5 px指定为“边框宽度 ”,选择“ ​边框”样式为边框样式,并指 ​定4 px作为边框。
    3. 从“背景”部分选择红色作为按钮的背 景颜 色。
    4. 在“维 和位置 的边距 ”字段 中,点按“同时编 辑”图标,并将 “右边距”设置 ​为450px。 “顶部”、“底部”和“左侧”字段设置为空。
  17. 点按 立即付 目标区域,然后点 按+ 以添加图 像组件
  18. 点按图像组件并选 (Configure)。 图像属性显示在左窗格中:
    1. “名 称”字段中指定PayNow作为图像 名称
    2. 按上 ​传 ,选择保存在本 地文件系统上的 PayNowWeb图像,然后点按打 ​开。
    3. 以保存图像属性。
  19. 根据用例,在交互式 通信 中插入一个“订阅”按钮,该按钮通过单击该按钮为用户提供订阅增值服务的选项。
    重复第13 - 17步,将“订 ”按钮添 加到“增值服务 ”目标区 域并添加 ValueAddedServicesWeb图像。

使用自动同步创建用于打印和Web的交互式通信

您还可以通过启用打印和Web渠道之间的自动同步来创建交互式通信。 要启用自动同步,请在创建交互式通信时选择“打印为主控”选项。 选择“打印为主控”选项可确保Web渠道的内容、继承和数据绑定是从“打印”渠道派生的。 它还确保在打印渠道中所做的更改反映在Web渠道中。
执行以下步骤,使用“打印渠道”衍生Web渠道内容:
  1. 登录到AEM作者实例,然后导航到 Adobe Experience Manager > 表单 > 表单和文档
  2. 点按 创建 ,然后选择 交互式通信 。 将显 示“创建交互 ”通信向导。
  3. 在“ 标题”和 “名称”字 段中指 定create_first ​_ic。 选 择FDM_Create_First_IC作为表单 “数据模型”,然后点 按下一 ​步。
  4. 在渠道 向导 :
    1. 定create_first_ic_print_template 作为打印模板,然后点按 选择
    2. 选中“ 使用打印作为主控进行Web渠道 ”复选框。
    3. 指定 Create_First_IC_templates文件夹 > Create_First_IC_Web_Template作为Web模板 ,然后点按 选择
    4. 点按​ 创建
    将显示一条确认消息,提示已成功创建交互式通信。
  5. 点按 编辑 ,以在右窗格中打开交互式通信。
  6. 执行“为打印渠道创 建交互式通信”部分的步骤 6 - 15。
  7. 点按左 侧窗 格中的渠道选项卡, 然后点按 Web,从打印渠道自动生成Web渠道的内容。
  8. 在第4 步中选中了“将打印用 作主控渠道”复选框,将从“打印”渠道自动为Web渠道生成内容和绑定。
    打印渠道内容会插入到Web渠道模板内容的下方。 要修改已从“打印”渠道自动生成的Web渠道内容,可取消任何目标区域的继承。
    将指针悬停在Web目标中的相关渠道区域上,选 (取消继承),然后在取消继承 对话框中 ,点按
    如果已取消某个组件的继承,则可以重新启用该继承。 要重新启用继承,请将指针悬停在包括该组件的相关目标区域的边界上,然后点按重新启
  9. 选择左 窗格中 的“内容”选项卡。
  10. 使用内容树将自动生成的Web渠道内容拖放到Web模板中的现有面板。 以下是需要重新排列的组件的列表:
    • “清单详细信息”组件到“清单详细信息”面板
    • 客户详细信息组件到“客户详细信息”面板
    • “开单汇总”组件至“开单汇总”面板
    • “费用”组件汇总至“费用”面板汇总
    • 布局片段(表)到“明细的调用”面板
  11. 重复“为Web渠道创 建交互式通信 ”中的第13 - 18步 ,将“立即 付费”和“ 订阅 ”超链接插入交互式通信的Web渠道。