將Dynamic Media Assets新增至頁面

若要將動態媒體功能新增至您在網站上使用的資產，您可以直接在頁面上新增 Dynamic Media、 Interactive Media、 Media​或 ​​Video 360全景媒體元件。您可以進入「配置」模式並啟用Dynamic Media元件。 接著，您將這些元件新增至頁面，並新增資產至元件。 動態媒體元件是智慧型的——他們知道您是新增影像還是視訊，而可用的設定選項也會隨之變更。

如果您使用，請直接將Dynamic Media資產新增至頁面 Adobe Experience Manager 作為WCM。 如果您使用協力廠商來處理WCM, 連結 或 內嵌 您的資產。 如需回應式第三方網站，請參閱 將最佳化的影像傳送至回應式網站.

新增Dynamic Media元件至頁面

將3D媒體、Dynamic Media、互動式媒體、全景媒體、智慧型裁切視訊或視訊360媒體元件新增至頁面，與將元件新增至任何頁面相同。

若要將Dynamic Media元件新增至頁面：

1. 在 Experience Manager，開啟您要新增Dynamic Media元件的頁面。

2. 在左窗格中，選取 元件 圖示，然後篩選Dynamic Media。

   如果沒有可用的Dynamic Media元件清單，您可能必須啟用您要使用的Dynamic Media元件。 請參閱 啟用Dynamic Media元件.

   

3. 拖曳 Dynamic Media 元件，並將其拖曳至頁面上的所需位置。

4. 將指標直接暫留在元件上。 元件被藍色框包圍時，選取一次以顯示元件的工具列。 選取 配置（扳手） 表徵圖。

   

5. 視您拖放至頁面的Dynamic Media元件而定，會開啟設定對話方塊。 設定元件的選項 視需要。

   下列範例顯示Dynamic Media 影片360媒體 元件對話框和「查看器預設集」下拉清單中可用的選項。

   

   Dynamic Media Video 360媒體元件。

6. 完成後，在對話框的右上角，選擇複選標籤以保存更改。

啟用Dynamic Media元件

如果沒有可新增至頁面的Dynamic Media元件，這可能表示您必須啟用您要使用的元件。

1. 在 Experience Manager，開啟您要新增Dynamic Media元件的頁面。

2. 在工具列的靠近頁面頂端的左側，選取「頁面資訊」圖示，然後選取 編輯範本 從下拉式清單中。

   

3. 在工具列的右側，靠近頁面頂端，從下拉式清單中選取 結構.

   

4. 在頁面底部附近，選取 版面容器 要開啟其工具欄，請選擇「策略」表徵圖。

5. 在 版面容器 頁面下方 屬性 標題，確定 允許的元件 頁簽。

   

6. 捲動直到您看到 Dynamic Media.

7. 選取左側的>圖示 Dynamic Media，然後選取您要啟用的Dynamic Media元件。

   

8. 在 版面容器 頁面，選擇「完成」（複選標籤）表徵圖。

9. 在工具列的右側，靠近頁面頂端，從下拉式清單中選取 初始內容.

10. 新增Dynamic Media元件至頁面 照常。

本地化Dynamic Media元件

您可以透過下列兩種方式之一，將Dynamic Media元件當地化：

• 在「網站」的網頁中，開啟「屬 性 」並選 取「進階 」標籤。選擇所要的本地化語言。

  

• 從網站選擇器中，選取所需的頁面或頁面群組。 選擇 屬性 ，然後選取 進階 標籤。 選擇所要的本地化語言。

  注意

  並非所有可在 語言 功能表目前已指派代號。

可用的Dynamic Media元件

Dynamic Media元件可供您選取 元件 圖示，然後篩選 Dynamic Media.

可用的Dynamic Media元件包括：

• 動態媒體 -用於影像、視訊、eCatalog和回轉集等資產。
• 互動式媒體 — 用於任何互動式資產，例如互動式視訊、互動式影像或輪播集。
• 全景媒體 — 用於全景影像或全景VR影像資產。
• 影片360媒體 — 用於360視訊和360 VR視訊資產。

元件：Dynamic Media

Dynamic Media元件很智慧。 無論您新增影像或影片，您都有各種選項。 元件支援影像預設集、以影像為基礎的檢視器，例如影像集、回轉集、混合媒體集和視訊。 此外，檢視器具有回應性 — 螢幕大小會根據螢幕大小自動變更。 所有檢視器均為HTML5檢視器。

新增Dynamic Media元件時， Dynamic Media設定 空白，或無法正確新增資產，請核取下列項目：

• 影像具有金字塔Tiff檔案。 在啟用Dynamic Media之前匯入的影像沒有金字塔Tiff檔案。

使用影像時

Dynamic Media元件可讓您新增動態影像，包括影像集、回轉集和混合媒體集。 您可以放大、縮小，如果適用，可以在回轉集內開啟影像，或從另一類型的集合中選取影像。

您也可以直接在元件中設定檢視器預設集、影像預設集或影像格式。 若要讓影像具有回應性，您可以設定斷點或套用回應式影像預設集。

您可以選取 編輯 圖示，然後 Dynamic Media設定.

• 檢視器預設集 — 從下拉式清單中選取現有的檢視器預設集。 如果您要尋找的檢視器預設集未顯示，您必須使其顯示。 請參閱管理檢視器預設集。 如果您使用影像預設集，則無法選取檢視器預設集，反之則無法選取。

  如果您正在檢視影像集、回轉集或混合媒體集，此選項是唯一可用的選項。 顯示的檢視器預設集也是僅智慧型的相關檢視器預設集。

• 檢視器修飾元 — 檢視器修飾元採用名稱=值配對和分隔字元的形式，並可讓您依照檢視器參考指南中的概述來變更檢視器。 檢視器修飾詞的範例為 posterimage=img.jpg&caption=text.vtt,1 它為視頻縮略圖設定不同的影像，並將隱藏式字幕/字幕檔案與視頻關聯。

• 影像預設集 — 從下拉式清單中選取現有的影像預設集。 如果您要尋找的影像預設集未顯示，則必須使其可見。 請參閱管理影像預設集。 如果您使用影像預設集，則無法選取檢視器預設集，反之則無法選取。

  如果您正在檢視影像集、回轉集或混合媒體集，則無法使用此選項。

• 影像修飾元 — 可以通過提供更多影像命令來應用影像效果。 這些命令在「影像預設集」和「影像伺服命令」參考中描述。

  如果您正在檢視影像集、回轉集或混合媒體集，則無法使用此選項。

• 斷點 — 如果您在回應式網站上使用此資產，必須新增影像中斷點。 影像斷點必須用逗號(,)分隔。 當影像預設集中未定義高度或寬度時，此選項即可運作。

  如果您正在檢視影像集、回轉集或混合媒體集，則無法使用此選項。

  您可以選取 編輯 在元件中。

• 針對解析度更高的設備進行優化 — 選取（預設）核取方塊，以允許DPR（裝置像素比率）最佳化。

  此 針對解析度更高的設備進行優化 選項只有在下列情況為true時才會顯示：

  • 在「預設類型」下， 影像預設集 ，則 RESS_IP 從中選取 影像預設集 下拉式清單。

  

  另請參閱 關於裝置像素比例最佳化.

  任何 Experience Manager Dynamic Media智慧型影像處理DPR值會遭忽略。

• 標題 — 變更影像標題。

• 替代文字 — 為關閉圖形的用戶添加影像標題。

  如果您正在檢視影像集、回轉集或混合媒體集，則無法使用此選項。

• URL，在中開啟 — 您可以設定資產以開啟連結。 設定URL，然後在「開啟」中（在中）指出您要在相同視窗還是新視窗中開啟它。

  如果您正在檢視影像集、回轉集或混合媒體集，則無法使用此選項。

• 寬度 — 如果希望影像大小固定，請輸入值（像素）。 將此值保留為空白可讓資產最適化。

• 高度 — 如果希望影像大小固定，請輸入值（像素）。 將此值保留為空白可讓資產最適化。

使用視訊時

使用Dynamic Media元件將動態視訊新增至網頁。 編輯元件時，您可以選擇使用預先定義的視訊檢視器預設集來在頁面上播放視訊。

您可以選取 編輯 在元件中。

• 檢視器預設集 — 從下拉式清單中選取現有的視訊檢視器預設集。 如果您要尋找的檢視器預設集未顯示，您必須使其顯示。 請參閱管理檢視器預設集。

• 檢視器修飾元 — 檢視器修飾元採用 name=value 帶 & 分隔字元。 它們可讓您依照「Adobe檢視器參考指南」中的概述來變更檢視器。 檢視器修飾詞的範例為 posterimage=img.jpg&caption=text.vtt,1

  例如，使用檢視器修飾元，您可以執行下列操作：

  • 將字幕檔案與視頻關聯： 字幕

  • 將導覽檔案與視訊建立關聯： 導覽

    您可以選取 編輯 在元件中。

• 標題 — 變更視訊的標題。

• 寬度 — 如果希望影像大小固定，請輸入值（像素）。 將此值保留為空白可讓資產最適化。

• 高度 — 如果希望影像大小固定，請輸入值（像素）。 將此值保留為空白可讓資產最適化。

使用智慧型裁切時

使用Dynamic Media元件將智慧型裁切影像資產新增至網頁。 編輯元件時，您可以選擇使用預先定義的視訊檢視器預設集來在頁面上播放視訊。

請參閱 搭配Experience Manager Assets Dynamic Media使用智慧型裁切

另請參閱 影像設定檔.

您可以選取 編輯 在元件中。

• 影像修飾元 — 可以通過提供更多影像命令來應用影像效果。 這些命令在「影像預設集」和「影像伺服命令」參考中描述。

  如果您正在檢視影像集、回轉集或混合媒體集，則無法使用此選項。

  您可以選取 編輯 在元件中。

• 啟用外觀比例匹配 — 若要讓Dynamic Media挑選外觀比例最符合原始影像外觀比例的智慧型裁切輸出，請選取此選項。

• 針對解析度更高的設備進行優化 — 選取（預設）核取方塊，以允許DPR（裝置像素比率）最佳化。

  此 針對解析度更高的設備進行優化 選項只有在下列情況為true時才會顯示：

  • 在「預設類型」下， 智慧型裁切 選項。

  

  另請參閱 關於裝置像素比例最佳化.

  任何 Experience Manager Dynamic Media智慧型影像處理DPR值會遭忽略。

• 標題 — 變更智慧型裁切影像的標題。

• 替代文字 — 為關閉圖形的用戶添加智慧裁切影像的標題。

  如果您正在檢視影像集、回轉集或混合媒體集，則無法使用此選項。

• URL，在中開啟 — 您可以設定資產以開啟連結。 設定URL，然後在「開啟」中（在中）指出您要在相同視窗還是新視窗中開啟它。

  如果您正在檢視影像集、回轉集或混合媒體集，則無法使用此選項。

• 寬度 — 如果希望影像大小固定，請輸入值（像素）。 將此值保留為空白可讓資產最適化。

• 高度 — 如果希望影像大小固定，請輸入值（像素）。 將此值保留為空白可讓資產最適化。

元件：互動式媒體

互動式媒體元件適用於在這些資產上具有互動的熱點或影像地圖。 如果您有互動式影像、互動式視訊或輪播橫幅，請使用 互動式媒體 元件。

互動式媒體元件是智慧型的。 無論您新增影像或影片，您都有各種選項。 此外，檢視器回應式 — 螢幕大小會根據螢幕大小自動變更。 所有檢視器均為HTML5檢視器。

您可以編輯下列項目 一般 選取 編輯 在元件中。

• 檢視器預設集 — 從下拉式清單中選取現有的檢視器預設集。 如果您要尋找的檢視器預設集未顯示，您必須使其顯示。 必須先發佈檢視器預設集，才能使用。 請參閱管理檢視器預設集。

• 標題 — 變更視訊的標題。

• 寬度 — 如果希望影像大小固定，請輸入值（像素）。 將此值保留為空白可讓資產最適化。

• 高度 — 如果希望影像大小固定，請輸入值（像素）。 將此值保留為空白可讓資產最適化。

  您可以編輯下列項目 添加到購物車 選取 編輯 在元件中。

• 顯示產品資產 — 預設情況下，此值為已選取。 產品資產會依照商務模組中的定義顯示產品的影像。 清除勾號以不顯示產品資產。

• 顯示產品價格 — 預設情況下，此值為已選取。 產品價格顯示商務模組中定義的項目價格。 清除勾號以不顯示產品價格。

• 顯示產品表單 — 預設不會選取此值。 產品表單包含任何產品變體，例如大小和顏色。 清除勾號以不顯示產品變體。

元件：全景媒體

全景媒體元件用於那些為球形全景影像的資產。 這些影像提供360°的房間、屬性、位置或景觀的觀看體驗。 要使影像符合球形全景，它必須具有以下一個或兩個：

• 長寬比為2:1。
• 使用關鍵字加上標籤 equirectangular 或(spherical + panorama)或(spherical + panoramic)。 請參閱 使用標籤.

外觀比例和關鍵字條件都適用於資產詳細資料頁面和全景媒體 ​​WCM元件的全景資產。

您可以選取 設定 在元件中。

• 檢視器預設集 — 從「檢視器預設集」下拉式清單中選取現有的檢視器。

如果您要尋找的檢視器預設集未顯示，請核取以確認其已發佈。 請先發佈檢視器預設集，再加以使用。 請參閱 管理檢視器預設集.

元件：影片360媒體

使用 影片360媒體 在網頁上呈現等長形視訊的元件。 這樣可確保房間、屬性、位置、景觀或醫療程式的沈浸式觀看體驗。

在平面顯示器上播放期間，使用者可控制觀看角度；在行動裝置上播放通常使用其內建的陀螺控制項。

檢視器包含360個視訊資產的原生支援。 依預設，檢視或播放不需要其他設定。 您使用標準視訊副檔名（例如.mp4、.mkv和.mov）來傳送360視訊。 最常見的編解碼器為H.264。

您可以選取 設定 在元件中。

• 檢視器預設集 — 從「檢視器預設集」下拉式清單中選取現有的檢視器。 使用Video360VR，適合使用虛擬現實眼鏡的最終用戶。 包含基本視訊播放控制項和社交媒體功能。 使用Video360_social，其中包含基本視訊播放控制項。 視訊轉譯是以立體模式完成。 手動視點控制關閉，但陀螺儀控制開啟。 沒有社交媒體功能。

如果您要尋找的檢視器預設集未顯示，請核取以確認其已發佈。 請先發佈檢視器預設集，再加以使用。 請參閱 管理檢視器預設集.

使用HTTP/2來傳送Dynamic Media資產

HTTP/2是全新、更新的Web通訊協定，可改善瀏覽器和伺服器的通訊方式。 它提供了更快的資訊傳輸，並降低了所需的處理能力。 Dynamic Media資產的傳送現在可透過HTTP/2，提供更理想的回應和載入時間。

請參閱 HTTP2內容傳送 如需開始使用HTTP/2搭配您的Dynamic Media帳戶的完整詳細資訊。

Business.Adobe.com 資源