将 Dynamic Media 资产添加到页面

要将Dynamic Media功能添加到您在网站上使用的资产中，您可以直接在页面上添加​Dynamic Media​或​Interactive Media​组件。 为此，可进入布局模式并启用Dynamic Media组件。 然后，您可以将这些组件添加到页面，并将资产添加到该组件。 Dynamic Media 组件和交互式媒体组件是智能组件，它们知道您添加的是图像还是视频，并能据此相应地更改提供的选项。

如果您使用AEM作为WCM，则可以直接将Dynamic Media资产添加到页面。 如果您为 WCM 使用第三方，请链接或嵌入资产。有关响应式第三方网站，请参阅将优化的图像交付到响应式网站。

将Dynamic Media组件添加到页面

向页面添加Dynamic Media组件与向任何页面添加组件相同。 以下各节详细介绍了Dynamic Media组件。

1. 在 AEM 中，打开您要添加 Dynamic Media 组件的页面。

2. 在页面左侧的面板（您可能需要切换侧面板的显示）中，单击​组件​图标。

3. 在​组件​标题下方的下拉列表中，选择​Dynamic Media。 如果没有可用的Dynamic Media组件列表，您可能需要启用要使用的Dynamic Media组件。 请参阅启用Dynamic Media组件。

   

4. 将您要使用的Dynamic Media组件拖动到页面上所需位置。

5. 将鼠标指针直接悬停在组件上。 当组件被蓝色框包围时，点按一次以显示组件的工具栏。 点按​配置（扳手）图标。

6. 根据需要 编辑组件，然后单击复选标记以保存更改。

启用Dynamic Media组件

如果没有可添加到页面的Dynamic Media组件，则可能意味着您需要首先启用要使用的组件。

1. 在 AEM 中，打开您要添加 Dynamic Media 组件的页面。

2. 在工具栏左侧，点按页面顶部附近的页面信息图标，然后点按下拉列表中的​编辑模板 。

   

3. 在页面顶部附近工具栏右侧的下拉列表中，点按​结构。

   

4. 在页面底部附近，点按​布局容器​以打开其工具栏，然后点按策略图标。

5. 在​布局容器​页面的​属性​标题下，确保选中​允许的组件​选项卡。

   

6. 滚动直到您看到​Dynamic Media。

7. 点按​Dynamic Media​左侧的>图标以展开列表，选择要启用的Dynamic Media组件。

   

8. 在​布局容器​页面的右上角附近，点按完成（复选标记）图标。

9. 在页面顶部附近的工具栏右侧，从下拉列表中，点按​初始内容，然后按将Dynamic Media组件照常添加到页面。

本地化Dynamic Media组件

您可以通过以下两种方式之一将Dynamic Media组件本地化：

• 在“站点”的网页中，打开“属 性 ”，然后选择“ 高级 ”选项卡。 选择所需的本地化语言。

  

• 从站点选择器中，选择所需的页面或页面群组。 点按​属性，然后选择​高级​选项卡。 选择所需的本地化语言。

  注意

  请注意，并非​语言​菜单中提供的所有语言当前都分配了令牌。

Dynamic Media组件

Dynamic Media和交互式媒体位于组件中的Dynamic Media选项卡下。 对于任何交互式资产（例如交互式视频、交互式图像或传送集），请使用交互式媒体组件。对于所有其他 Dynamic Media 资产，请使用 Dynamic Media 组件。

Dynamic Media 组件

Dynamic Media组件是智能的 — 根据您添加的是图像还是视频，您有各种不同的选项。 该组件支持图像预设、基于图像的查看器（例如图像集、旋转集、混合媒体集）和视频。此外，查看器是响应式的。 也就是说，屏幕的大小会根据屏幕大小自动更改。 所有查看器都是 HTML5 查看器。

处理图像时

Dynamic Media 组件允许您添加动态图像，包括图像集、旋转集和混合媒体集。您可以缩放图像，并在适当的情况下在旋转集内旋转图像，或从其他类型的集合中选择图像。

您还可以直接在组件中配置查看器预设、图像预设或图像格式。要使图像成为响应式图像，您可以设置断点，或应用响应式图像预设。

您必须编辑以下Dynamic Media设置，方法是单击组件中的​编辑​图标，然后单击​Dynamic Media设置。

• 查看
  器预设从下拉菜单中选择一个现有的查看器预设。如果未显示您要查找的查看器预设，则可能需要将其显示出来。请参阅管理查看器预设。如果您正在使用图像预设，则无法选择查看器预设，反之亦然。如果您查看的是图像集、旋转集或混合媒体集，这是唯一可用的选项。显示的查看器预设也是智能的 - 仅显示相关的查看器预设。

• 查看
  器修饰符查看器修饰符采用名称=值对和分隔符的形式，并允许您根据《查看器参考指南》中所述更改查看器。查看器修饰符的示例为后景图像=img.jpg&caption=text.vtt，1，该示例为视频缩略图设置不同的图像，并将隐藏式字幕/子标题文件与视频关联。

• 图像
  预设从下拉菜单中选择一个现有的图像预设。如果未显示您要查找的图像预设，则可能需要将其显示出来。请参阅管理图像预设。如果您正在使用图像预设，则无法选择查看器预设，反之亦然。如果您查看的是图像集、旋转集或混合媒体集，则此选项不可用。

• 图像修
  饰符您可以通过提供其他图像命令来应用图像效果。这些内容在图像预设和图像提供命令参考中有介绍。
  如果您查看的是图像集、旋转集或混合媒体集，则此选项不可用。

• ​
  断点如果您在响应式网站上使用此资产，则需要添加图像断点。图像断点之间需要使用逗号 (,) 进行分隔。当图像预设中未定义高度或宽度时，可以使用此选项。如果您查看的是图像集、旋转集或混合媒体集，则此选项不可用。您可以通过单击组件中的​编辑​来编辑以下高级设置。

• ​
  标题更改图像的标题。

• 替
  换文本为关闭了图形的用户在图像中添加标题。如果您查看的是图像集、旋转集或混合媒体集，则此选项不可用。

• URL，打开
  您可以设置资产以打开链接。设置 URL，并在打开方式中指示是要在同一窗口中还是在新窗口中打开该 URL。如果您查看的是图像集、旋转集或混合媒体集，则此选项不可用。

• ​​宽度 ​
  高度如果希望图像具有固定大小，请输入以像素为单位的值。将这两个值留空会使资产成为自适应资产。

处理视频时

使用Dynamic Media组件将动态视频添加到您的网页。 编辑该组件时，您可以选择使用预定义的视频查看器预设，以在页面上播放视频。

必须通过单击组件中的​编辑​来编辑以下Dynamic Media设置。

• 查看
  器预设从下拉菜单中选择一个现有的视频查看器预设。如果未显示您要查找的查看器预设，则可能需要将其显示出来。请参阅管理查看器预设。

• 查看
  器修饰符查看器修饰符采用名称=值对和分隔符的形式，并允许您根据《Adobe查看器参考指南》中所述更改查看器。查看器修饰符的示例为后验图像=img.jpg&caption=text.vtt，1

  例如，通过查看器修饰符，您可以执行以下操作：

  • 将字幕文件与视频字幕关联。
  • 将导航文件与视频导航关联。

您可以通过单击组件中的​编辑​来编辑以下高级设置。

• ​
  标题更改视频的标题。

• ​​宽度高 ​
  度如果您希望视频具有固定大小，请输入以像素为单位的值。将这两个值留空会使视频成为自适应资产。

使用智能裁剪时

使用Dynamic Media组件将智能裁剪图像资产添加到您的网页。 编辑该组件时，您可以选择使用预定义的视频查看器预设，以在页面上播放视频。

另请参阅图像配置文件。

您可以通过单击组件中的​编辑​来编辑以下Dynamic Media设置。

• 图像修
  饰符您可以通过提供其他图像命令来应用图像效果。这些内容在图像预设和图像提供命令参考中有介绍。
  如果您查看的是图像集、旋转集或混合媒体集，则此选项不可用。

您可以通过单击组件中的​编辑​来编辑以下​高级​设置。

• ​
  标题更改智能裁剪图像的标题。

• 替
  换文本为关闭了图形的用户的智能裁剪图像添加标题。如果您查看的是图像集、旋转集或混合媒体集，则此选项不可用。

• URL，打开
  您可以设置资产以打开链接。设置 URL，并在打开方式中指示是要在同一窗口中还是在新窗口中打开该 URL。如果您查看的是图像集、旋转集或混合媒体集，则此选项不可用。

• ​​高度和 ​
  宽度如果您希望智能裁剪图像具有固定大小，请输入以像素为单位的值。将这两个值留空会使视频成为自适应资产。

交互式媒体组件

交互式媒体组件适用于具有交互功能的资产，例如热点或图像映射。如果您具有交互式图像、交互式视频或传送横幅，请使用交互式媒体组件。

交互式媒体组件是智能的 — 根据您添加的是图像还是视频，您可以选择各种选项。 此外，查看器是响应式的 - 其屏幕大小可根据设备屏幕大小自动进行更改。所有查看器都是 HTML5 查看器。

您可以通过在组件中单击​编辑，来编辑以下​常规​设置。

• 查看
  器预设从下拉菜单中选择一个现有的查看器预设。如果未显示您要查找的查看器预设，则可能需要将其显示出来。查看器预设必须先发布，然后才能使用。请参阅管理查看器预设。

• ​
  标题更改视频的标题。

• ​​宽度高 ​
  度如果您希望视频具有固定大小，请输入以像素为单位的值。将这两个值留空会使视频成为自适应资产。

您可以通过在组件中单击​编辑，来编辑以下​添加到购物车​设置。

• 显示产
  品资产默认情况下，此值处于选中状态。产品资产会按“商务”模块中的定义显示产品的图像。清除复选标记不会显示产品资产。

• 显示产
  品价格默认情况下，此值处于选中状态。产品价格会按“商务”模块中的定义显示项目的价格。清除复选标记不会显示产品价格。

• 显示产
  品表单默认情况下，未选择此值。产品表单包含所有产品变量，例如大小和颜色。清除复选标记不会显示产品变量。

全景媒体组件

全景媒体组件适用于那些球面全景图像的资产。 此类图像可提供360°的房间、属性、位置或景观观看体验。 要使图像符合球面全景，它必须具有以下任一或两者：

• 宽高比为2:1。
• 使用关键字“等长方形”、（“球形”+“全景”）或（“球形”+“全景”）进行标记。 请参阅使用标记。

纵横比和关键字条件都适用于资产详细信息页面和“全景媒体”WCM组件的全景资产。

您可以通过点按组件中的​配置​来编辑以下设置。

• 查看
  器预设从查看器预设下拉菜单中选择一个现有的查看器。

如果您要查找的查看器预设不可见，请勾选以确保该查看器预设已发布。 您必须先发布查看器预设，然后才能使用这些预设。 请参阅管理查看器预设。

使用HTTP/2交付Dynamic Media资产

HTTP/2是经过更新的新Web协议，可改进浏览器和服务器的通信方式。 它提供了更快的信息传输，并降低了所需的处理能力。 现在，Dynamic Media资产的交付可以通过HTTP/2进行，从而提供更好的响应和加载时间。

请参阅HTTP2内容交付 ，以了解有关使用Dynamic Media帐户的HTTP/2入门的完整详细信息。