管理Dynamic Media查看器预设 managing-viewer-presets
Dynamic Media查看器预设是一组设置,用于确定用户在其计算机屏幕和移动设备上查看富媒体资产的方式。 如果您是管理员,则可以创建查看器预设。 设置适用于查看器配置选项数组。 例如,您可以更改查看器的显示大小或缩放行为。
有关创建和自定义您自己的HTML5查看器预设的说明,请参阅AdobeDynamic Media HTML5查看器SDK API文档. 该SDK位于嵌入在SDK中的IS发布服务器上。 每个库版本都包含其自己的SDK文档。
路径: <scene7_domain>/s7sdk/<library_version>/docs/jsdocs/index.html
.
例如,3.10 SDK: https://s7d1.scene7.com/s7sdk/3.10/docs/jsdoc/index.html
另请参阅 AdobeDynamic Media查看器参考指南.
本节介绍如何创建、编辑和管理查看器预设。 无论您何时预览资产,都可以将查看器预设应用到资产。 请参阅 应用查看器预设.
查看器的键盘辅助功能 keyboard-accessibility-for-viewers
所有现成的查看器都支持键盘辅助功能。
另请参阅 键盘辅助功能和导航.
管理Dynamic Media查看器预设 managing-presets
您可以通过点按在AEM中添加、编辑、删除、发布、取消发布和预览查看器预设 工具>资产>查看器预设.
查看器支持响应式设计的网页 viewer-support-for-responsive-designed-web-pages
不同的网页有不同的需求。 例如,有时您希望网页提供一个链接,以在单独的浏览器窗口中打开HTML5查看器。 在其他情况下,可能需要直接将HTML5查看器嵌入到托管页面。 在后一种情况下,网页可以具有静态布局。 或者,可能 响应式 和在不同设备或浏览器窗口大小不同的情况下以不同的方式显示。 为了满足这些需求,Dynamic Media附带的所有预定义开箱即用HTML5查看器都支持静态网页和响应式设计的网页。
请参阅 响应式图像库 在 图像提供API帮助 有关如何将响应式查看器嵌入网页的更多信息。
请参阅 发布查看器预设。
查看器预设系统兼容性 viewer-preset-system-compatibility
Dynamic Media附带的所有现成查看器预设都与以下系统完全兼容:
- 台式机
- AppleiPhone
- AppleiPad
- Android智能手机
- Android平板电脑
- 对于视频,还提供了对MP4播放的其他支持 Blackberry 和 Windows Phone 8.
查看器预设的富媒体类型 rich-media-types-for-viewer-presets
管理员在创建新查看器预设时,可以添加和自定义以下富媒体类型。
要使上传的图像符合球面全景图的条件,该图像必须具有以下任一项或两项:
- 宽高比为2:1。
- 使用等矩形关键字标记,或者使用球面和全景关键字标记,或者使用球面和全景关键字标记。 请参阅 使用标记.
通过垂直缩放查看器,您可以最大化产品图像查看体验,从而让用户更好地呈现产品。 色板的垂直位置可执行以下操作:
- 确保色板位于折页上方。 使用水平色板时,根据用户的桌面屏幕大小,在用户向下滚动页面之前,不会显示色板。 通过将色板垂直放置在查看器中,可确保无论用户的屏幕大小如何,都可以看到这些色板。
- 最大化主图像大小。 使用水平色板时,必须保留页面上的空间,以确保它们可见。 此定位缩小了主图像的大小。 但是,使用垂直色板布局时,您无需分配此空间。 因此,您可以最大化主图像大小。
现成查看器预设列表 list-of-out-of-the-box-viewer-presets
下表标识了Dynamic Media附带的所有预定义现成查看器预设。
另请参阅 实时演示.
有关查看器支持的Web浏览器和操作系统版本的信息,您可以查看查看器发行说明。
请参阅 查看器发行说明 目录 查看器参考指南.
支持的移动查看器手势矩阵 supported-mobile-viewers-gestures-matrix
下表标识了iOS、Android 2.x和Android 3.x设备上支持的移动查看器手势。
增加显示的Dynamic Media查看器预设数 increasing-the-number-of-viewer-presets-that-display
AEM在从以下位置查看资产时,会显示各种查看器预设 详细信息视图>查看器. 您可以增加或减少显示的查看器数量。
要增加显示的Dynamic Media查看器预设数,请执行以下操作:
-
导航到 CRXDE Lite (http://localhost:4502/crx/de)。
-
导航到位于的查看器预设列表节点
/libs/dam/gui/coral/content/commons/sidepanels/viewerpresets/viewerpresetslist
-
在 limit 属性中,将默认设 置为15的Value(值)更改为所需的数字。
-
导航到位于的查看器预设数据源
/libs/dam/gui/coral/content/commons/sidepanels/viewerpresets/viewerpresetslist/datasource
-
在 限制 属性中,例如将数字更改为所需的数字
{empty requestPathInfo.selectors[1] ? "20" : requestPathInfo.selectors[1]}
-
点按 全部保存.
创建新的Dynamic Media查看器预设 creating-a-new-viewer-preset
通过创建查看器预设,您可以应用各种设置来查看资产并与之交互。 但是,您无需创建新的查看器预设。 如果您愿意,可以使用AEM Assets附带的默认现成查看器预设。
如果您选择创建新的查看器预设,则在保存该查看器预设后,查看器的状态将自动激活(设置为 开) 查看器预设 页面。 此状态表示它在 Dynamic Media 组件和 交互式媒体 组件,以及预览图像或视频时的使用说明。
某些查看器预设具有可影响查看器的使用和整体行为的排他设置。 根据您创建的查看器预设,您可能需要注意这些特殊注意事项。
请参阅 创建交互式查看器预设的特殊注意事项.
请参阅 创建轮播横幅查看器预设的特殊注意事项.
创建新的Dynamic Media查看器预设:
-
点按AEM左上角的AEM徽标,然后点按左边栏中的 工具>资产>查看器预设.
-
在 查看器预设 页面,在工具栏中,点按 创建.
-
在 新查看器预设 对话框中 预设名称 字段,输入新预设的名称。 请仔细选择名称 — 在您点按后,这些名称将不可编辑 创建.
当您稍后在这些步骤中保存预设时,该预设的名称会显示在“查看器预设”页面的 预设标题 列标题。
-
在 富媒体类型 下拉菜单中,选择要创建的查看器预设类型,然后点按页面右上角的 创建.
请参阅 查看器预设的富媒体类型.
-
在 编辑查看器预设 页面,点按 外观 选项卡。
-
执行下列操作之一:
-
在 选定类型 下拉菜单中,选择要自定义其可视设计的组件。 或者,您也可以点按查看器中的任何可视元素以选择进行配置。
通过可视编辑器,您可以查看特定属性对样式有何影响。 只需设置或调整任何属性,即可使用编辑器左侧的示例立即查看该属性对查看器有何影响。
每种类型的查看器预设的CSS样式属性在任何“自定义” <viewer_name> 查看者”帮助主题 查看器参考指南.
例如,如果您创建的是类型的查看器预设
Mixed_Media
,请参阅 自定义混合媒体查看器 ,以获取每个属性的列表和描述。 -
如果您在单独的CSS文件中定义了样式设置,则可以将CSS文件上传到AEM Assets。 点按 导入CSS 下面 选定类型 下拉菜单(您可能需要向上滚动可视编辑器才能看到它),以查找上传的CSS文件并将其与查看器预设关联。
导入CSS文件时,可视编辑器会检查CSS是否使用正确的查看器标记。 例如,如果要创建缩放查看器,则必须使用其查看器类名称定义导入的所有CSS规则
.s7mixedmediaviewer
在父查看器元素上定义。只要为给定查看器正确定义CSS标记,就可以导入任意手工CSS。 (CSS标记在任何“自定义” <viewer name=""> 查看者”帮助主题 查看器参考指南. 例如,如果要阅读有关缩放查看器的CSS标记,请参阅 自定义缩放查看器.) 但是,可视编辑器可能无法理解某些CSS值。 在这种情况下,可视编辑器会尝试覆盖错误,以便CSS仍然可以工作。
note note NOTE 如果您希望直接在其原始表单中编辑 CSS,请点按“选定类型”下拉菜单下的 显示/隐藏 CSS(您可能需要向上滚动可视编辑器才能看到此选项)。 与可视编辑器一样,当您直接在CSS中更改属性时,您可以立即查看该属性对查看器示例有何影响。 而且,该同一属性会在可视化编辑器中同时自动更新。 因此,您可以使用原始CSS编辑器或可视编辑器,或者两者交替使用。 note note NOTE 对于按钮图稿,选择2x图像并上传高分辨率艺术品。 使用交互式图像和购物横幅时,您还可以从各种现成的热点按钮中进行选择。 -
-
(可选)靠近 编辑查看器预设 页面,点按 桌面, 平板电脑 或 电话 用于为不同设备和屏幕类型唯一定义可视样式。
-
在 编辑查看器预设 页面,点按 行为 选项卡。 或者,您也可以点按或单击查看器中的任何可视元素,以选择进行配置。
-
从 选定类型 下拉菜单中,选择要更改其行为的组件。
可视化编辑器中的许多组件都有与其关联的详细说明。 当您展开组件以显示其关联参数时,这些描述会显示在蓝色框中。
有些“查看器类型”具有的组件允许您在 IS 命令 文本字段中指定“图像提供”命令。有关可使用的命令列表,请参阅图像提供 API 参考。
note note NOTE 如果您使用的是触控设备,如手机或平板电脑…… 在文本字段中键入值后,点按用户界面中的其他位置,以提交更改并关闭虚拟键盘。 如果您点按 输入,则不会执行任何操作。 -
在页面的右上角附近,点按 保存.
-
发布新查看器预设。 您必须先发布预设,然后才能在您的网站上使用预设。
请参阅 发布查看器预设.
创建交互式查看器预设的特殊注意事项 special-considerations-for-creating-an-interactive-viewer-preset
关于面板中图像缩略图的显示模式
在创建或编辑交互式视频查看器预设时,您可以选择 显示模式 设置 InteractiveSwatches
从 选定的组件 下方的下拉菜单 行为 选项卡。 您选择的显示模式会影响视频播放时缩略图的显示方式和显示时间。 您可以选择 segment
显示模式(默认)或 continuous
显示模式。
关于交互式视频查看器中的自动滚动行为
交互式视频查看器中缩略图的自动滚动行为与您选择的显示模式无关。
在创建或编辑交互式视频查看器预设时,您可以访问 自动滚动 从 行为 选项卡。 在“行为”选项卡的 选定的组件 下拉菜单中,点按 InteractiveSwatches。的 自动滚动 复选框列在“IS命令”文本字段的下方。
如果在查看器预设中禁用 自动滚动(清除复选框),则在用户播放视频时,该面板仅显示整个视频长度的第一个缩略图。但是,如果需要,用户可以使用向上和向下箭头图标手动滚动缩略图。
在查看器预设中启用(选择)自动滚动 后,在视频播放过程中,分配给视频区段的缩略图图像会在区段开始时滚动到视图中。但是,在某些情况下,区段内某些缩略图的显示时间是其之前或之后缩略图显示时间的两倍。发生此行为的原因是区段中缩略图的数量大于面板中可见缩略图的数量,且不可平均分割。
为了说明这一点,假设您有一个30秒的视频区段。 此外,30秒内共显示9个缩略图。 您的浏览器的大小调整为显示面板中有四个可见的缩略图位置。 30秒视频时间段分为三个子段。 下表显示了在给定时间子区段中显示哪些缩略图的划分:
视频子区段3不会超出分配给它的缩略图。 另请注意,缩略图4、6和7在面板中的显示时间是其他缩略图的两倍。
查看器根据可用位置数量在面板中显示缩略图数量的逻辑如下:
-
子区段数量=舍入到下一个子区段(缩略图数量/缩略图面板中的可见版块数量,具体取决于浏览器窗口大小)。
使用上表中的示例,9个缩略图/ 4个版块= 2.25;查看器逻辑会将其舍入为3个子区段。
-
缩略图数量=舍入到下一个缩略图(缩略图数量/视频子区段数量)。
使用上表中的示例,9个缩略图/ 3个视频子区段= 3个缩略图。
-
子区段的持续时间=视频总持续时间/视频子区段的数量。
使用上表中的示例, 30秒/ 3个视频子区段=每个视频子区段的10秒显示。
创建轮播横幅查看器预设的特殊注意事项 special-considerations-for-creating-a-carousel-banner-viewer-preset
创建轮播横幅查看器预设时,可以按如下方式访问更改热点样式:
激活或停用Dynamic Media查看器预设 activating-or-deactivating-viewer-presets
用户界面中可用的查看器预设取决于哪些查看器预设在创作模式下处于活动状态。 默认情况下,查看器预设为 开 创建后。 如果关闭预设,则在“创作”模式下将看不到该预设。 如果预设已发布。 无论是打开还是关闭,都会始终发布该内容。 如果列表变得太笨重,或者您不希望某个查看器预设可供使用,您可能需要停用查看器预设。
激活或停用Dynamic Media查看器预设:
-
点按AEM左上角的AEM徽标,然后点按左边栏中的 工具>资产>查看器预设.
-
在 查看器预设 页面下 州 列标题中,点按切换以激活或停用查看器预设。
已激活的查看器预设在右侧蓝色框中显示切换开关;已停用的查看器预设的切换开关会显示在灰色浅框中的左侧。
发布Dynamic Media查看器预设 publishing-viewer-presets
激活(或车削 开)查看器预设的状态表示该预设在Dynamic Media组件、交互式媒体组件以及您查看资产时均可见。
但是,要交付带有查看器预设的资产,还必须发布查看器预设。 必须激活所有查看器预设 和 发布以获取资产的URL或嵌入代码。 您必须激活并发布Dynamic media附带的所有现成查看器预设。 您创建和添加的自定义查看器预设将自动激活,但也必须发布。
请参阅 激活或取消激活查看器预设.
另请参阅 预览资产.
发布Dynamic Media查看器预设:
- 点按AEM左上角的AEM徽标,然后点按左边栏中的 工具>资产>查看器预设.
- 选择要发布的一个或多个查看器预设。
- 在工具栏中,点按 发布 图标。
为Dynamic Media查看器预设排序 sorting-viewer-presets
对Dynamic Media查看器预设进行排序:
- 点按 AEM 左上角的 AEM 徽标,然后点按左边栏中的 工具(锤子图标)> Assets > 查看器预设。
- 单击 预设标题、类型、已发布 或 状态 来按列标题进行排序。例如,单击 类型 按字母顺序或反向字母顺序对查看器预设类型进行排序。
编辑Dynamic Media查看器预设 editing-viewer-presets
请注意,编辑任意 预定义的现成查看器预设 不支持此方案。 如果您编辑现成的查看器预设,系统会提示您使用新名称保存该查看器预设。
编辑Dynamic Media查看器预设:
-
点按AEM左上角的AEM徽标,然后点按左边栏中的 工具>资产>查看器预设.
-
选中查看器预设标题左侧的框以选择预设。
-
在工具栏中,点按 编辑.
-
在 编辑查看器预设 页面对查看器预设进行所需的更改。
-
执行下列操作之一:
- 点按 保存 ,以保存所做的更改并返回到 查看器预设 页面。
- 点按 取消 撤消您所做的任何更改并返回到 查看器预设 页面。
删除自定义Dynamic Media查看器预设 deleting-custom-viewer-presets
您可以删除已创建并添加到Dynamic Media的查看器预设。
删除自定义Dynamic Media查看器预设:
- 点按AEM左上角的AEM徽标,然后点按左边栏中的 工具>资产>查看器预设.
- 在 查看器预设 页面,检查 预设标题,然后点按 垃圾 图标。
- 点按 删除.
将Dynamic Media查看器预设应用到资产 applying-a-viewer-preset-to-an-asset
如果已发布资产和选定的查看器,则在选择查看器预设后 将显示 “ URL ”和“嵌入”按钮。
将Dynamic Media查看器预设应用到资产:
-
打开资产,在页面的左上角附近,点按下拉菜单,然后选择 查看器.
note note NOTE 如果已发布资产和选定的查看器,则在选择查看器预设后 将显示 “ URL ”和“嵌入”按钮。 -
从左窗格中选择一个查看器预设,以将其应用到资产。
您可以 复制要共享的URL 其他用户。
使用Dynamic Media查看器预设传送资产 delivering-assets-with-viewer-presets
要获取查看器预设的URL,请参阅 将URL关联到您的Web应用程序. 另请参阅 在网页上嵌入视频查看器.
如果您使用AEM作为WCM,则可以直接在页面上使用查看器预设添加资产。 请参阅 将Dynamic Media Assets添加到页面.