传送横幅

通过创建交互式旋转促销内容并将其交付到任何屏幕，轮播横幅使营销人员能够推动转化。

创建和修改促销横幅中特有的内容可能非常耗时，这会限制您快速发布新内容或使其更具针对性的能力。 传送横幅可让您快速创建或修改旋转横幅，添加与产品详细信息或相关资源链接的热点等交互性，并将这些交互性传送到任何屏幕，从而让您更快地将新促销内容推向市场。

传送横幅由带有单词的横幅来指定 卡鲁塞:

在您的网站上，轮播横幅可以如下所示：

在此，您可以导航浏览图像（通过单击数字）。 此外，幻灯片会根据您可以自定义的时间间隔自动旋转。 您在轮播横幅中添加的图像同时支持热点和图像映射，用户可以在其中点按或转到超链接或访问概览窗口。

在此示例中，用户点按或单击了图像映射，并访问了手套的“概览”窗口：

观看如何创建轮播横幅

观看10分钟33秒的演练 轮播横幅的创建方式. 您还将了解如何预览、编辑和传送传送传送横幅。

快速入门：传送横幅

要快速启动并运行，请执行以下操作：

1. 识别热点和图像映射变量 (仅适用于使用AEM Assets + Dynamic Media的客户)

   首先，识别现有概览实施所使用的动态变量，以便您在AEM Assets的轮播横幅创建过程中能够正确输入热点和图像映射数据。

   注意

   如果您是AEM Sites或Ecommerce客户，则可以使用内置功能导航到产品页面并查找产品目录中的现有SKU。 您无需手动输入热点或图像映射变量。 请参阅 设置电子商务.

   如果您是AEM Assets和Dynamic Media客户，则将手动输入热点和图像映射的数据，然后将已发布的URL或嵌入代码与第三方内容管理系统相集成。

2. 可选：根据需要创建轮播集查看器预设。

   如果您是管理员，则可以通过创建自己的轮播查看器预设来自定义轮播的行为和外观。 主要优势在于，您可以对多个轮播重复使用此自定义查看器预设。 但是，用户也可以选择在创作轮播时直接自定义轮播的行为和外观。 当您想要为给定轮播设计非常具体的设计时，这是首选方法。

3. 上传图像横幅.

   上传要进行交互的图像横幅。

4. 创建轮播集.

   在轮播集中，用户在横幅图像中导航，并点按热点或图像映射以访问相关内容。

   要在 Assets 中创建轮播集，请点按​创建，然后选择​轮播集。将资产添加到幻灯片，然后点按​保存。您还可以直接在编辑器中编辑轮播集的外观和行为。

5. 将热点或图像映射添加到图像横幅。

   向图像横幅中添加一个或多个热点或图像映射，并将每个热点或图像映射与链接、概览或体验片段之类的操作相关联。 添加热点或图像映射后，可通过发布轮播集来完成此任务。 发布后会创建嵌入代码，您可以使用该代码复制嵌入代码并将其应用于网站登录页面。

   请参阅 （可选）预览传送横幅 — 可选。 如果需要，您可以查看轮播集的表示形式并测试其交互性。

6. 发布传送横幅。

   与发布任何资产一样，您也可以发布轮播集。 在资产中，导航到轮播集，然后选择它，然后点按或点按 发布. 发布轮播集时，会激活URL和嵌入字符串。

7. 执行下列操作之一：

   • 将轮播横幅添加到您的网站页面 您可以将复制的轮播横幅URL或嵌入代码添加到网站页面。

     • 将轮播横幅与现有概览相集成. 如果您使用的是第三方Web内容管理系统，则需要将新的轮播横幅与网站上的现有概览实施相集成。

   • 在AEM中将轮播横幅添加到您的网站 如果您是AEM Sites客户，则可以使用交互式媒体组件将轮播集直接添加到AEM中的页面。

如果需要编辑传送集，请参阅 编辑轮播集. 此外，您还可以查看和编辑 轮播集属性.

识别热点和图像映射变量

首先，识别现有概览实施所使用的动态变量，以便您在AEM Assets的轮播集创建过程中能够输入适当的热点或图像映射数据。

在AEM Assets中将热点或图像映射添加到横幅图像时，您需要为每个热点或图像映射分配一个SKU和可选的其他变量。 这些变量稍后会用于将热点或图像映射与概览内容进行匹配。

必须正确识别要与热点或图像映射数据关联的变量数量和类型。 添加到横幅图像的每个热点或图像映射都必须包含足够的信息，以便在现有的后端系统中明确地识别产品。 同时，每个热点或图像映射不应包含所需的更多数据。 原因是这样会使数据输入过程过于复杂，并且会使正在进行的热点或图像映射管理更容易出错。

有不同的方法来识别一组用于热点或图像映射数据的变量。

有时，与负责现有概览实施的IT专家进行咨询可能已足够，因为他们可能知道在系统中识别概览所需的最少数据集。 但是，在大多数情况下，也可以简单地分析前端代码的现有行为。

大多数概览实施都使用以下模式：

• 用户在网站上激活用户界面元素。例如，单击 概览 按钮。
• 如果需要，网站会向后端发送Ajax请求以加载概览数据或内容。
• 概览数据会转换为内容，以准备在网页上渲染。
• 最后，前端代码以可视方式将此类内容呈现在屏幕上。

然后，方法是访问实施了快速视图功能的现有网站的不同区域，触发快速视图并捕获由网页发送的Ajax URL，以加载快速视图数据或内容。

通常，您无需使用任何专门的调试工具。 现代的Web浏览器配备了Web检查器，可以做到充分的工作。 以下是一些包括Web检查器的Web浏览器示例：

• 要在Google Chrome中查看所有传出的HTTP请求，请按F12(Windows)或Command-Option-I(Mac)以打开“开发人员工具”面板，然后点按 网络 选项卡。
• 在Firefox中，您可以通过按F12(Windows)或Command-Option-I(Mac)并使用其“网络”选项卡来激活Firebug插件，也可以使用内置的检查器工具及其“网络”选项卡。

在浏览器中打开网络监控时，会触发页面上的概览。

现在，在网络日志中找到Quickview Ajax URL，并复制记录的URL以供将来分析。 在大多数情况下，当您触发概览时，会向服务器发送大量请求。 通常，Quickview Ajax URL是列表中最先使用的URL之一。 它具有复杂的查询字符串部分或路径，其响应MIME类型为 text/html, text/xml或 text/javascript.

在此过程中，访问网站中具有不同产品类别和类型的不同区域非常重要。 原因是概览URL的某些部分可能与给定网站类别相同，但只有在您访问网站的其他区域时才会发生更改。

在最简单的情况下，概览URL中唯一的变量部分是产品SKU。 在这种情况下，SKU值是您在将热点或图像映射添加到横幅图像时需要的唯一数据块。

但是，在复杂的情况下，除SKU之外，快速视图URL还具有不同的可变元素，例如类别ID、颜色代码、大小代码等。 在这种情况下，在热点或轮播横幅功能的图像映射数据定义中，每个元素都是一个单独的变量。

请考虑以下概览URL示例及其生成的热点或图像映射变量：

上传图像横幅

如果您已上传要使用的图像，请前进到下一步， 创建轮播集. 请注意，在启用Dynamic Media后，必须上传轮播中使用的图像。

要上传图像横幅，请参阅 上传资产.

创建轮播集

创建轮播集:

1. 在Assets中，导航到要创建轮播集的文件夹，然后点按 创建>轮播集.

2. 在 轮播横幅编辑器 页面，点按 点按以打开资产选择器 来选择第一张幻灯片的图像。

   在 轮播横幅编辑器 ，请执行以下任一操作：

   • 在页面的左上角附近，点按 添加幻灯片 图标。
   • 在页面中间附近，点按 点按以打开资产选择器.

   点按以选择要包含在轮播集中的资产。选定资产上有一个复选标记图标。完成后，在页面的右上角附近，点按 选择.

   借助资产选择器，您可以通过键入关键字并点按​返回​来搜索资产。您还可以应用过滤器来优化搜索结果。您可以按路径、收藏集、文件类型和标记进行过滤。选择过滤器，然后点按工具栏上的​过滤器​图标。通过点按 查看 图标和选择 列视图, 卡片视图​或 列表视图.

   请参阅 使用选择器 以了解更多信息。

3. 继续添加幻灯片，直到您添加了所有要在轮播集中旋转的图像。

4. （可选）执行以下任一操作：

   • 如有必要，可拖动幻灯片以对设置列表中的图像进行重新排序。
   • 要删除图像，请选择图像，然后点按 删除幻灯片 中。
   • 要应用预设，请点按页面右上角附近的预设下拉列表，然后选择要一次应用于该预设集的预设。

   要删除幻灯片，请点按幻灯片，然后点按 删除幻灯片 中。 要移动幻灯片，请点按订单图标，然后按住并移动到所需位置。

5. 在幻灯片中添加图像后，您可以向图像添加热点和/或图像映射。 请参阅 添加热点或图像映射.

6. 您可以通过点按或单击“行为”和“外观”选项卡，并调整轮播横幅的外观或特定组件的行为，来更改轮播集的可视设计和行为。 请参阅 管理查看器预设 以了解有关如何使用查看器编辑器的更多信息。

   注意

   对于传送横幅，您可能需要调整以下内容：

   • 图像显示的持续时间。 默认情况下，每幅图像显示9秒。
   • 动画. 默认情况下，每个幻灯片过渡都是渐隐效果。 您可以将其更改为幻灯片过渡。
   • 按钮的样式。 用户可以通过点按每个圆点或数字来旋转横幅。 您可以更改设置指示器按钮的显示位置（如果是数字或虚线样式）以及其大小。
   • 更改图像映射的高亮显示样式或用于热点的图标。
   • 在编辑查看器预设之前，请选择要作为预设基础的样式。 如果不这样做，则在开始编辑查看器预设时，如果您决定更改其他预设，则将丢失所有更改。

   您还可以预览轮播横幅的外观。 请参阅 （可选）预览传送横幅.

7. 点按 保存 完成。

将热点或图像映射到图像横幅

您可以使用轮播集编辑器将热点或图像映射添加到横幅。

添加热点或图像映射时，您可以将热点或图像映射定义为“概览”弹出显示、超链接或体验片段。

请参阅 体验片段.

在向图像添加热点或图像映射时，请记住保存您的工作。 撤消 和 重做 在当前创建/编辑会话期间，支持页面右上角附近的选项。

创建完轮播横幅后，您可以选择使用 预览 以了解轮播横幅向客户显示的方式。

请参阅 （可选）预览传送横幅.

向图像横幅添加热点:

1. 在资产中，导航到要进行交互的轮播集。

2. 选择轮播集并点按 编辑.

3. 在轮播查看器编辑器中，选择要进行交互的幻灯片。

4. 在页面的左上角附近，点按​热点​或​图像映射。

5. 执行以下任一操作：

   • 对于热点：在图像上，点按您希望显示热点的位置。
   • 对于图像映射：在图像上，点按，然后从左上角拖动到右下角，以创建图像映射区域。 您可以通过拖动角来调整图像映射的大小。

   如有必要，请将热点或图像映射拖到新位置。 根据需要添加其他热点或图像映射。

   要删除热点或图像映射，请点按​操作​选项卡。在​映射和热点​标题下，从​选定类型​下拉菜单中，选择要删除的热点或图像映射的名称。点按菜单旁边的​废纸篓​图标，然后点按​删除。

6. 在“名称”文本字段中，键入热点或图像映射的名称。 此名称也会显示在 映射和热点 下拉列表。 如果您决定在将来对热点或图像映射进行更改，那么提供名称可以让您轻松地识别该热点或图像映射。

7. 在 操作 选项卡：

   • 点按 概览.

     • 如果您是AEM Sites和电子商务客户，请点按 产品选取器 图标（放大镜）以打开 选择产品 页面。 点按要使用的产品，然后点按页面右上角的复选标记，以返回到 轮播横幅编辑器.

     • 如果您不是AEM Sites或Ecommerce客户

       • 请参阅 识别热点变量 ，因为您可能想要定义这些变量。
       • 然后，手动输入SKU值。 在 SKU价值 文本字段中，键入产品的SKU（库存单位），即您提供的每个不同产品或服务的唯一标识符。 输入的SKU值会自动填充概览模板的变量部分，以便系统能够将点按的热点与特定SKU的概览相关联。
       • （可选）如果您需要在概览中使用其他变量来进一步识别产品，请点按 添加常规变量. 在文本字段中，指定其他变量。 例如， category=Mens 是添加的变量。
       • 请参阅 使用选择器 以了解更多信息。

   • 点按 超链接.

     • 如果您是AEM Sites客户，请点按 网站选择器 图标（文件夹）来导航到URL。

       注意

       如果您的交互式内容具有包含相对URL的链接，特别是指向AEM Sites页面的链接，则无法使用基于URL的链接方法。

     • 如果您是独立客户，请在 HREF 文本字段，指定链接网页的完整URL路径。

       请确保指定是在新的浏览器选项卡（推荐为默认选项卡）还是在同一选项卡中打开链接。

       请参阅 使用选择器 以了解更多信息。

   • 点按 体验片段.

     • 如果您是AEM Sites客户，请点按 搜索 图标（放大镜）以打开“体验片段”页面。 点按您要使用的体验片段，然后点按 选择 ，以返回到热点管理页面。

       请参阅 体验片段.

       注意:请注意，在体验片段中嵌入查看器时，“轮播横幅”中的社交媒体共享工具不受支持。 要解决此问题，您可以使用或创建没有社交媒体共享工具的查看器预设。 通过此类查看器预设，您可以成功将其嵌入到体验片段中。

     • 指定将在横幅上显示的体验片段的宽度和高度。

   

   您还可以预览轮播横幅的外观。 请参阅 （可选）预览传送横幅.

8. 点按 保存.

9. 发布轮播集。 发布后会创建可在您的网站页面上使用的嵌入代码或URL。 如果您是AEM Sites客户，则可以将轮播集直接添加到您的网页。

   请参阅 发布资产.

   请参阅 将轮播集添加到您的网站登录页面

编辑轮播集

您可以对轮播集执行多种编辑任务，如下所示：

• 向轮播集添加幻灯片。 另请参阅 使用选择器.
• 在轮播集中对幻灯片重新排序。
• 删除轮播集中的资产。
• 应用查看器预设。
• 删除轮播集。
• 添加或编辑热点和图像映射。 另请参阅 使用选择器.

请注意，如果您正在使用热点编辑交互式图像，并裁剪图像，则您的热点会被删除。

编辑轮播集:

1. 执行以下任一操作：

   • 将鼠标悬停在轮播集资产上，然后点按 编辑 （铅笔图标）。
   • 将鼠标悬停在轮播集资产上，点按 选择 （复选标记图标），然后点按 编辑 中。
   • 点按“轮播集”资产，然后点按页面左上角的 编辑 （铅笔图标）。

2. 要编辑轮播集，请执行以下任一操作：

   • 要添加幻灯片，请点按 添加幻灯片 图标，然后导航到要添加到该幻灯片的资产，并点按复选标记。
   • 要对幻灯片重新排序，请将幻灯片拖到新位置（选择重新排序图标以移动项目）。
   • 要添加热点或图像映射，请点按热点或图像映射图标，然后参阅 添加热点和图像映射.
   • 要编辑轮播集的外观或行为，请点按 外观 选项卡或 行为 选项卡，然后设置所需的选项。
   • 要编辑热点或图像映射，请在相应的幻灯片上选择热点或图像映射，然后根据需要在 操作 选项卡。
   • 要删除幻灯片，请选择它，然后点按 删除幻灯片 中。
   • 要应用预设，请点按页面右上角附近的预设下拉列表，然后选择查看器预设。
   • 要删除整个轮播集，请导航到轮播集，将其选中，然后点按 删除.

（可选）预览传送横幅

您可以使用 预览 要查看您的轮播横幅对客户的外观，并测试轮播横幅热点和图像映射以确保它们按预期行事。

当您对轮播横幅满意时，可以发布该横幅。

• 请参阅 在网页上嵌入视频查看器或图像查看器.
• 请参阅 将URL关联到您的Web应用程序. 请注意，如果您的交互式内容具有包含相对URL的链接，特别是指向AEM Sites页面的链接，则无法使用基于URL的链接方法。
• 请参阅 将Dynamic Media Assets添加到页面。

您可以从轮播编辑器（首选方法）或 查看器 列表。

预览传送横幅:

1. 在 资产，导航到您创建的现有轮播横幅，然后点按以将其打开。

2. 点按 编辑.

3. 在工具栏右角的查看器预设列表中，选择查看器以预览轮播横幅。

   

4. 点按 预览.

5. 点按图像上的热点或图像映射，以测试其关联的操作。

从查看器列表预览轮播横幅:

1. 在 资产，导航到您创建的现有轮播横幅，然后点按以将其打开。
2. 在 预览 页面，点按 内容 图标。
3. 在 查看器 在页面左侧的面板中列出，点按要使用的轮播横幅查看器预设的名称。
4. 点按图像上的热点或图像映射，以测试其关联的操作。

发布传送横幅

您需要发布轮播才能使用它。 发布轮播集时，会激活URL和嵌入代码。 它还会将轮播发到Dynamic Media云，该云与CDN集成以进行可扩展且性能卓越的交付。

如果您在轮播横幅中使用带有热点的现有交互式图像，则在发布轮播横幅后，必须单独发布该交互式图像。

此外，如果您修改了在轮播横幅中使用的已发布的预先存在的交互式图像，则必须先发布该交互式图像，然后才能将这些更改反映在轮播横幅中。

请参阅 发布Dynamic Media Assets 有关如何发布传送横幅的信息。

将轮播横幅添加到您的网站页面

在上传横幅图像以创建轮播、将热点和/或图像映射添加到横幅并发布轮播集后，您现在可以将其添加到现有网站页面。

如果您是AEM Sites客户，则可以通过将交互式媒体组件拖动到页面来直接将轮播横幅添加到您的页面。 请参阅 将Dynamic Media Assets添加到页面。

但是，如果您是独立的AEM资产客户，则可以按照此部分所述，手动将轮播横幅添加到您的网站登录页面。

1. 复制已发布的轮播集的嵌入代码。

   请参阅 在网页上嵌入视频查看器或图像查看器.

2. 将您从AEM Assets复制的嵌入代码添加到您的网页。

   复制的嵌入代码是响应式代码，因此它应该自动适合页面的嵌入区域。

将轮播横幅与现有概览集成

此任务仅在您是独立的AEM Assets客户时才适用。

此过程的最后一个步骤是将轮播横幅与您网站上的现有概览实施集成。 每个概览实施都是独一无二的，需要一种特定的方法，最可能需要前端IT人员的协助。

现有的概览实施通常表示在网页上发生的一系列相互关联的操作，这些操作按以下顺序发生：

1. 用户在网站的用户界面中触发一个元素。
2. 前端代码根据在步骤1中触发的用户界面元素来获取概览URL。
3. 前端代码使用步骤2中获取的URL发送Ajax请求。
4. 后端逻辑会将相应的概览数据或内容返回到前端代码。
5. 前端代码加载概览数据或内容。
6. 或者，前端代码会将加载的概览数据转换为HTML表示。
7. 前端代码显示一个模态对话框或面板，并在屏幕上为最终用户呈现HTML内容。

这些调用可能不代表独立的公共API调用，网页逻辑可以从任意步骤调用这些调用。 相反，它是一个链式调用，其中每个后续步骤都会隐藏在上一步的最后一个阶段（回调）中。

在轮播横幅将替换步骤1和部分步骤2的同时，当用户单击轮播横幅中的热点或图像映射时，查看器将处理此类用户交互。 查看器会向网页返回一个事件，其中包含之前添加的所有热点或图像映射数据。

在此类事件处理程序中，前端代码会执行以下操作：

• 监听轮播横幅发出的事件。
• 根据热点或图像映射数据构建概览URL。
• 触发从后端加载概览并在屏幕上呈现概览以供显示的过程。

由AEM Assets返回的嵌入代码已拥有一个现成的事件处理程序，该处理程序已被注释掉。

因此，只需取消代码注释，并将虚拟处理程序主体替换为特定网页的代码即可。

构建概览URL的过程与之前介绍的用于识别热点和图像映射变量的过程基本上相反。

请参阅 识别热点和图像映射变量.

触发概览URL并激活概览面板的最后一步，很可能需要IT部门的前端IT人员的协助。 他们深知如何通过正确的步骤准确触发概览实施，从而拥有现成的概览URL。

使用概览创建自定义弹出窗口

请参阅 使用概览创建自定义弹出窗口.

Business.Adobe.com 资源

Multichannel Communication Content As A Service Customer Experience Management Headless Cms Digital Signage Content Management System