将Dynamic Media经典功能添加到页面

Adobe Dynamic Media Classic是一个托管解决方案,用于管理、增强、发布富媒体资产并将富媒体资产交付到Web、移动设备、电子邮件和连接Internet的显示屏和印刷品。

您可以在各种查看器中视图发布在Dynamic Media Classic中的AEM资产:

  • 缩放
  • 弹出
  • 视频
  • 图像模板
  • 图像

您可以将数字资产从AEM直接发布到Dynamic Media Classic,也可以将数字资产从Dynamic Media Classic发布到AEM。

本文档介绍如何将数字资产从AEM发布到Dynamic Media Classic,反之亦然。 此外,还详细介绍了各种查看器。有关为Dynamic Media Classic配置AEM的信息,请参阅将Dynamic Media Classic与AEM集成。

另请参阅添加图像映射

有关将视频组件与AEM结合使用的详细信息,请参阅视频

注意

如果Dynamic Media Classic资产未正确显示,请确保Dynamic Media已禁用,然后刷新页面。

从资产手动发布到Dynamic Media Classic

您可以按如下方式将数字资产发布到Dynamic Media Classic:

注意

AEM异步发布到Dynamic Media Classic。 单击​发布​后,您的资产可能需要几秒钟时间才能发布到Dynamic Media Classic。

Dynamic Media Classic组件

AEM中提供以下Dynamic Media经典组件:

  • 缩放
  • 弹出(缩放)
  • 图像模板
  • 图像
  • 视频
注意

默认情况下,这些组件不可用,在使用前需要在​Design​模式下选择这些组件。

在​Design​模式中使用这些组件后,您可以像添加任何其他AEM组件一样将这些组件添加到页面。 尚未发布到Dynamic Media Classic的资产会发布到Dynamic Media Classic(如果位于同步文件夹中、页面中或具有Dynamic Media Classic云配置)。

注意

如果要创建和开发自定义查看器,并使用内容查找器,则需要明确添加​allowfullscreen​参数。

Flash 查看器生命周期终止通知

自2017年1月31日起,Adobe Dynamic Media Classic终止了对Flash查看器平台的支持。

将Dynamic Media Classic组件(Scene7)添加到页面

向页面添加Dynamic Media经典(Scene7)组件与向任何页面添加组件相同。 Dynamic Media经典组件在以下部分中有详细说明。

要将Dynamic Media Classic(Scene7)组件添加到页面,请执行以下操作:

  1. 在AEM中,打开要添加Dynamic Media Classic(Scene7)组件的页面。

  2. 如果没有Dynamic Media Classic组件可用,请单击​设计​模式,点按带有蓝色边框的任何组件,点按​父项​图标,然后点按​配置​图标。 在​Parsys(Design)​中,选择所有Dynamic Media Classic组件以使其可用,然后单击​确定

    chlimage_1-224

  3. 单击​编辑​以返回至​编辑​模式。

  4. 将组件从Sidekick中的Dynamic Media经典组拖动到页面的所需位置。

  5. 单击​配置​图标以打开组件。

  6. 根据需要编辑该组件,然后单击​确定​以保存更改。

  7. 将您的图像或视频从内容浏览器拖动到您添加到页面的Dynamic Media Classic组件上。

    注意

    仅在触屏UI中,您必须将图像或视频拖放到您放置在页面上的Dynamic Media Classic组件上。 不支持选择和编辑Dynamic Media经典组件,然后选择资产。

将交互式查看体验添加到响应式网站

如果您的资产具有响应式设计,则意味着您的资产会根据其显示的位置自行进行调整。利用响应式设计,可以在多种设备上有效地显示同一资产。

另请参阅网页响应式设计

要向响应式网站添加交互式查看体验,请执行以下操作:

  1. 登录到AEM,并确保您已配置Adobe Dynamic Media ClassicCloud Services,且Dynamic Media Classic组件可用。

    注意

    如果Dynamic Media Classic组件不可用,请确保通过设计模式启用它们。

  2. 在启用了​Dynamic Media Classic​组件的网站中,将​Image​组件拖动到页面。

  3. 选择组件,然后点按配置图标。

  4. 在​Dynamic Media经典设置​选项卡中,调整断点。

    chlimage_1-225

  5. 确认查看器可实现响应式大小调整,并且所有交互已针对台式机、平板电脑和移动设备进行了优化。

所有Dynamic Media Classic组件的通用设置

尽管配置选项各不相同,但以下是所有Dynamic Media Classic组件的通用选项:

  • 文件
    引用浏览到要引用的文件。文件引用显示资产URL,但不一定显示完整的Dynamic Media经典URL(包括URL命令和参数)。 无法在此字段中添加Dynamic Media经典URL命令和参数。 必须使用组件中的相应功能才能添加这些命令和参数。

  • 度允许您设置宽度。

  • 度允许您设置高度。

通过打开(按多次单击)Dynamic Media Classic组件(例如,打开​Zoom​组件时),可以设置这些配置选项:

chlimage_1-226

缩放

按​+​按钮时,HTML5缩放组件会显示一个更大的图像。

缩放工具位于资产底部。点按​+​可放大。 点按​-​可减少。 点按​x​或重置缩放箭头可将图像恢复为导入时的原始大小。 点按对角箭头可全屏显示。 点按​编辑​以配置组件。 通过此组件,可以配置所有Dynamic Media Classic组件](#settings-common-to-all-scene-components)通用的[设置。

chlimage_1-227

弹出

在HTML5 弹出​组件中,资产显示为拆分屏幕;使资产保持指定的大小;右侧将显示缩放部分。 点按​编辑​以配置组件。 通过此组件,您可以配置所有Dynamic Media Classic组件](#settings-common-to-all-scene-components)通用的[设置。

注意

如果您的​弹出​组件使用自定义大小,则会使用该自定义大小,并禁用该组件的响应式设置。

如果​弹出​组件使用默认大小(如​设计视图​中所设置),则使用默认大小,组件拉伸以在启用组件的响应设置的情况下调整页面布局大小。 但是,请注意,组件的响应设置存在限制。 当您将​弹出​组件与响应式设置结合使用时,不应将其用于整页拉伸。 否则,弹出​可以扩展到页面右边框之外。

chlimage_1-228

图像

Dynamic Media Classic Image​组件允许您向图像添加Dynamic Media Classic功能,如Dynamic Media Classic修饰符、图像预设或查看器预设,以及锐化。 Dynamic Media Classic Image​组件类似于AEM中具有特殊Dynamic Media Classic功能的其他图像组件。 在此示例中,图像应用了Dynamic Media经典URL修饰符​&op_invert=1

chlimage_1-229

  • 标题、替
    换文本在“ ​高级”选项卡中,为图像添加一个标题,为关闭了图形的用户添加替代文本。

  • URL,打开
    位置您可以设置资产以打开链接。设置 URL,并在​打开方式​中指示是要在同一窗口中还是在新窗口中打开该 URL。

chlimage_1-230

  • 查看
    器预设从下拉菜单中选择现有的查看器预设。如果未显示您要查找的查看器预设,则可能需要将其显示出来。请参阅管理查看器预设。如果您正在使用图像预设,则无法选择查看器预设,反之亦然。

  • Dynamic Media经
    典配置选择要从SPS中获取活动图像预设的Dynamic Media经典配置。


  • 像预设从下拉菜单中选择现有的图像预设。如果未显示您要查找的图像预设,则可能需要将其显示出来。请参阅管理图像预设。如果您正在使用图像预设,则无法选择查看器预设,反之亦然。


  • 出格式选择图像的输出格式,例如jpeg。根据所选的输出格式,您可能会有额外的配置选项。请参阅图像预设最佳实践


  • 化选择锐化图像的方式。图像预设最佳实践锐化最佳实践中详细介绍了锐化。

  • URL修
    饰符您可以通过提供其他Dynamic Media经典图像命令来更改图像效果。相关内容在图像预设命令参考中进行了介绍。


  • 点如果您的网站是响应式的,您需要调整断点。断点之间必须使用逗号 (,) 分隔。

图像模板

Dynamic Media经典图 像模板是已导入到Dynamic Media Classic的分层Photoshop内容,其中内容和属性经过参数化以实现可变性。通过​图像模板​组件,您可以在 AEM 中导入图像并对文本进行动态更改。此外,您还可以配置​图像模板​组件,以使用 Client Context 中的值,从而让每个客户获取个性化的图像体验。

点按​编辑​以配置组件。 您可以配置所有Dynamic Media Classic组件](#settings-common-to-all-scene-components)通用的[设置以及本节中介绍的其他设置。

chlimage_1-231

  • 文件引用、宽度、高
    度请参阅所有Dynamic Media Classic组件通用的设置。

    注意

    Dynamic Media经典URL命令和参数不能直接添加到文件引用URL。 只能在组件 UI 的​参数​面板中定义这些命令和参数。

  • 标题、替代文
    本在Dynamic Media经典图像模板选项卡中,为图像添加一个标题,并为关闭了图形的用户添加替代文本。

  • URL,打开
    位置您可以设置资产以打开链接。设置 URL,并在打开方式中指示是要在同一窗口中还是在新窗口中打开该 URL。

chlimage_1-232


  • 数面板导入图像时,参数会预填充图像中的信息。如果没有可以动态更改的内容,则此窗口将是空的。

chlimage_1-233

动态更改文本

要动态更改文本,请在字段中输入新文本,然后单击​确定。在此示例中,价格​现在为 50 美元,运费为 99 美分。

chlimage_1-234

图像中的文本发生了更改。通过点按字段旁边的​重置,可将文本重置回原始值。

chlimage_1-235

更改文本以反映 Client Context 值

要将字段链接到Client Context值,请点按​选择​以打开Client Context菜单,选择Client Context,然后点按​确定。 在此示例中,由于已将名称与个人资料中设置的格式化名称链接在一起,因此名称会相应地发生更改。

chlimage_1-236

文本反映了当前已登录用户的名称。您可以通过单击相应字段旁边的​重置,将文本重置为原始值。

chlimage_1-237

  1. 在具有Dynamic Media Classic 图像模板​组件的页面上,点按​编辑

  2. 在​URL​字段中,输入用户点击图像后转到的URL。 在​打开方式​字段中,选择您希望在新窗口中还是在同一窗口中打开目标。

    chlimage_1-238

  3. 点按​确定

视频组件

Dynamic Media Classic Video​组件(可从Sidekick的Dynamic Media Classic部分获得)使用设备和带宽检测为每个屏幕提供正确的视频。 此组件是一种 HTML5 视频播放器,它是可以跨渠道使用的单一查看器。

它可用于自适应视频集、单个MP4视频或单个F4V视频。

有关视频如何与Dynamic Media Classic集成结合使用的更多信息,请参阅视频。 此外,请参阅Dynamic Media Classic Video组件与Foundation Video组件

chlimage_1-239

视频组件的已知限制

Adobe DAM 和 WCM 会显示是否上传了主视频。但它们不会显示以下代理资产:

  • Dynamic Media Classic编码再现
  • Dynamic Media经典自适应视频集

在使用带有Dynamic Media Classic视频组件的自适应视频集时,您需要调整组件大小以适合视频的尺寸。

Dynamic Media Classic内容浏览器

通过Dynamic Media Classic内容浏览器,您可以直接在AEM中视图Dynamic Media Classic中的内容。 要访问内容浏览器,请在​内容查找器​中,选择触屏优化用户界面中的​Dynamic Media Classic​或经典用户界面中的​S7​图标。 这两种用户界面的功能是相同的。

如果您有多个配置,默认情况下,AEM 会显示默认配置。您可以直接在Dynamic Media Classic内容浏览器中的下拉菜单中选择不同的配置。

注意
  • 位于临时文件夹中的资产不会显示在Dynamic Media Classic内容浏览器中。
  • 启用安全预览后,Dynamic Media Classic上已发布和未发布的资产都会显示在Dynamic Media Classic内容浏览器中。
  • 如果内容浏览器中未显示​Dynamic Media Classic​或​S7​图标作为选项,则需要配置Dynamic Media Classic以与AEM一起使用。
  • 对于视频,Dynamic Media Classic内容浏览器支持:
  • 自适应视频集:一种容器,包含在多种屏幕上实现无缝播放所需的所有视频呈现
  • 单个 MP4 视频
  • 单个F4V视频

在触屏优化UI中浏览内容

您可以在触屏优化UI或经典UI中访问内容浏览器。 目前,触屏优化具有以下限制:

  • 不支持Dynamic Media Classic中的FXG和Flash资源。

从第三个下拉菜单中选择​Dynamic Media Classic,浏览Dynamic Media Classic资产。 Dynamic Media Classic不显示在列表中(如果尚未配置Dynamic Media Classic/AEM集成)。

注意
  • Dynamic Media Classic内容浏览器可加载约100个资源,并按名称对它们进行排序。
  • 如果您设置了安全的预览服务器,浏览器将使用该预览服务器来呈现缩略图和资产。

chlimage_1-240

此外,您还可以通过将鼠标悬停在浏览器中的资产上方来浏览分辨率信息、大小、修改后的天数和文件名。

chlimage_1-241

  • 对于自适应视频集和模板,不会为缩略图生成大小信息。
  • 对于自适应视频集,不会为缩览图生成任何分辨率。

使用内容浏览器搜索Dynamic Media Classic资产

搜索Dynamic Media经典资产与搜索AEM资产类似,只是搜索时,您实际上看到的是Dynamic Media经典系统中资产的远程视图,而不是直接将资产导入AEM。

您可以使用经典 UI 或触屏优化 UI 来查看和搜索资产。根据所用的界面,搜索方式会略有不同。

在任一 UI 中进行搜索时,您都可以按以下条件进行筛选(此处显示的是触屏优化 UI):

  • 输入关
    键字您可以按名称搜索资产。搜索时,您输入的关键字是文件名称的开头。例如,键入“swimming”一词后,将在该文件夹中查找任何以这些字母开头的资产文件名。键入词后,请务必点按Enter以查找资产。

chlimage_1-242

  • 文件夹/
    路径显示的文件夹名称基于您选择的配置。您可以通过点按文件夹图标并选择子文件夹,然后点按复选标记以选择它,进而向下展开到更低级别。

如果您输入了关键字并选择了文件夹,则 AEM 会搜索此文件夹及其所有子文件夹。但是,如果您在搜索时未输入任何关键字,则选择文件夹后,只会显示此文件夹中的资产,而不会包括所有子文件夹。

默认情况下,AEM 会搜索选中的文件夹及其所有子文件夹。

chlimage_1-243

  • 资产类
    型选择 Dynamic Media 类可浏览Dynamic Media Classic内容。此选项仅在配置了Dynamic Media Classic时可用。

chlimage_1-244


  • 置如果您在Cloud Services中定义了多个Dynamic Media Classic配 置,则可以在此处选择它。根据您选择的配置,文件夹会相应地进行更改。

chlimage_1-245

  • 资产
    类型在Dynamic Media Classic浏览器中,您可以筛选结果以包括以下任一内容:图像、模板、视频和自适应视频集。如果您没有选择任何资产类型,则默认情况下,AEM 会搜索所有资产类型。

chlimage_1-246

注意
  • 在经典 UI 中,您还可以搜索 FlashFXG。在触屏优化 UI 中,当前并不支持筛选这两项。

  • 搜索视频时,您搜索的是单个视频呈现。结果返回原始再现(仅*.mp4)和编码的再现。

  • 在搜索自适应视频集时,您正在搜索文件夹和所有子文件夹,但前提是您已向搜索添加了关键字。 如果您没有添加关键字,则 AEM 不会搜索子文件夹。

  • 发布
    状态您可以根据发布状态筛选资产: 发布或 已发布。如果未选择任何​发布状态,则默认情况下,AEM会搜索所有发布状态。

chlimage_1-247

在此页面上

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