將動態媒體經典功能新增至頁面

Adobe Dynamic Media Classic是代管解決方案,可用來管理、增強、發佈和提供多媒體資產至網路、行動裝置、電子郵件和網際網路連線的顯示和列印。

您可以在各種檢視器中檢視在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使用視訊元件的詳細資訊,請參閱 Video

注意

如果Dynamic Media Classic資產未正確顯示,請確定Dynamic Media is disabled,然後重新整理頁面。

從資產手動發佈至Dynamic Media Classic

您可以按如下方式將數位資產發佈至Dynamic Media Classic:

注意

AEM以非同步方式發佈至Dynamic Media Classic。 按一下​Publish​後,您的資產可能需要數秒鐘才能發佈至Dynamic Media Classic。

Dynamic Media Classic元件

AEM提供下列Dynamic Media Classic元件:

  • 縮放
  • 彈出(縮放)
  • 影像範本
  • 影像
  • 影片
注意

預設情況下,這些元件不可用,在使用之前,需要在​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 Classic(Scene7)元件新增至頁面與將元件新增至任何頁面相同。 Dynamic Media Classic元件將在下列章節中詳細說明。

若要將Dynamic Media Classic(Scene7)元件新增至頁面:

  1. 在AEM中,開啟您要新增Dynamic Media Classic(Scene7)元件的頁面。

  2. 如果沒有可用的Dynamic Media Classic元件,請按一下​Design​模式,點選任何藍邊框的元件,點選​Parent​圖示,然後按一下​Configuration​圖示。 在​Parsys(Design)​中,選擇所有Dynamic Media Classic元件以使其可用,然後按一下​確定

    chlimage_1-224

  3. 按一下​編輯​返回到​編輯​模式。

  4. 將sidekick中的Dynamic Media Classic群組元件拖曳至所需位置的頁面。

  5. 按一下​Configuration​表徵圖以開啟元件。

  6. 根據需要編輯元件,然後按一下​OK​保存更改。

  7. 從內容瀏覽器將您的影像或視訊拖曳至您新增至頁面的Dynamic Media Classic元件。

    注意

    僅在觸控UI中,您必須將影像或視訊拖放至您放在頁面上的Dynamic Media Classic元件上。 不支援選取和編輯Dynamic Media Classic元件,然後選擇資產。

將互動式檢視體驗新增至回應式網站

針對您的資產進行多方互動設計,表示您的資產會依其顯示位置而調整。 透過多方互動設計,可在多種裝置上有效顯示相同的資產。

另請參閱網頁自適應設計

若要將互動式檢視體驗新增至互動式網站:

  1. 登入AEM,並確定您已設定 Adobe Dynamic Media Classic Cloud Services,且Dynamic Media Classic元件已可供使用。

    注意

    如果Dynamic Media Classic元件不可用,請確定要透過設計模式啟用它們。

  2. 在啟用​Dynamic Media Classic​元件的網站中,將​Image​元件拖曳至頁面。

  3. 選取元件並點選設定圖示。

  4. 在​動態媒體經典設定​標籤中,調整中斷點。

    chlimage_1-225

  5. 確認檢視器正在回應性地調整大小,而且所有互動都已針對桌上型電腦、平板電腦和行動裝置最佳化。

所有Dynamic Media Classic元件的常用設定

雖然配置選項不同,但所有Dynamic Media Classic元件都有以下通用選項:

  • 檔案
    引用瀏覽到要引用的檔案。檔案參考會顯示資產URL,但不一定是完整的Dynamic Media Classic URL,包括URL命令和參數。 您無法在此欄位中新增Dynamic Media Classic URL命令和參數。 它們必須透過元件中的對應功能來新增。

  • 度可讓您設定寬度。

  • 度可讓您設定高度。

您可以開啟(按兩下)Dynamic Media Classic元件,例如開啟​Zoom​元件時,設定這些設定選項:

chlimage_1-226

縮放

當您按下​+​按鈕時,HTML5縮放元件會顯示較大的影像。

資產底部有縮放工具。 點選​+​以放大。 點選​-​以減少。 點選​x​或重設縮放箭頭會將影像重新調整為原本匯入的大小。 點選對角線箭頭,讓它成為全螢幕。 點選「編輯」以設定元件。 使用此元件,可以配置所有Dynamic Media Classic元件](#settings-common-to-all-scene-components)的公共[設定。

chlimage_1-227

彈出

在HTML5 Flyout​元件中,資產顯示為分割畫面;將資產保留在指定的大小;右側顯示縮放部分。 點選「編輯」以設定元件。 使用此元件,可以配置所有Dynamic Media Classic元件](#settings-common-to-all-scene-components)的常用設定。[

注意

如果您的​Flyout​元件使用自訂大小,則會使用該自訂大小,並停用元件的回應式設定。

如果您的​Flyout​元件使用預設大小(如​設計檢視​中所設定),則會使用預設大小,而元件會延伸以配合頁面版面大小,並啟用元件的回應式設定。 但請注意,元件的回應式設定有限。 當您使用具有自適應設定的​Flyout​元件時,不應將它用於完整頁面延伸。 否則,Flyout​可延伸超過頁面的右邊框。

chlimage_1-228

影像

Dynamic Media Classic Image​元件可讓您將Dynamic Media Classic功能新增至影像,例如Dynamic Media Classic修飾元、影像或檢視器預設集,以及銳利化。 Dynamic Media Classic Image​元件類似於AEM中具有特殊Dynamic Media Classic功能的其他影像元件。 在此範例中,影像已套用Dynamic Media Classic URL修飾元​&op_invert=1

chlimage_1-229

  • 標題、替代文
    字在「進階」 ​索引標籤中,為影像新增標題,並為關閉圖形的使用者新增替代文字。

  • URL, Open
    inYou can set a sasset from to open a link.設定​URL,並在​的「在​中開啟」中指出您要在相同視窗或新視窗中開啟。

chlimage_1-230

  • 檢視
    器預設從下拉式選單中選取現有的檢視器預設。如果您所尋找的檢視器預設集不可見,您可能需要將它顯示。 請參閱管理檢視器預設集。 如果您使用影像預設集,則無法選取檢視器預設集,反之亦然。

  • Dynamic Media Classic設
    定選擇您要用來從SPS擷取作用中影像預設集的Dynamic Media Classic設定。

  • 影像
    預設集從下拉式選單中選取現有的影像預設集。如果您要尋找的影像預設集不可見,您可能需要將它顯示。 請參閱管理影像預設集。 如果您使用影像預設集,則無法選取檢視器預設集,反之亦然。

  • 輸出
    格式選擇影像的輸出格式,例如jpeg。視您選擇的輸出格式而定,您可能會有其他設定選項。 請參閱影像預設集最佳範例


  • 利化選取影像銳利化的方式。銳利化在影像預設集最佳實務銳利化最佳實務中詳細說明。

  • URL修
    飾元您可以提供額外的Dynamic Media Classic影像指令來變更影像效果。這些說明在影像預設集命令參考中。

  • 中斷
    點如果您的網站是互動式的,您需要調整中斷點。中斷點必須以逗號(,)分隔。

影像範本

Dynamic Media Classic Image Template是分層Photoshop內容,已匯入至Dynamic Media Classic,內容和屬性會因變數而參數化。Image template​元件可讓您在AEM中匯入影像並動態變更文字。 此外,您還可以設定​影像範本​元件,使用用戶端內容的值,讓每位使用者以個人化方式體驗影像。

點選「編輯」以設定元件。 您可以設定所有Dynamic Media Classic元件的常用設定,以及本節所述的其他設定。

chlimage_1-231

  • 檔案參考、寬度、高
    度檢視所有Dynamic Media Classic元件的常用設定。

    注意

    Dynamic Media Classic URL命令和參數無法直接新增至「檔案參考URL」。 它們只能在​參數​面板中的元件UI中定義。

  • 標題、替代文
    字在「動態媒體經典影像範本」標籤中,為影像新增標題,並為已關閉圖形的使用者新增替代文字。

  • URL, Open
    inYou can set a sasset from to open a link.設定URL,並在「開啟於」中指出您要在相同視窗或新視窗中開啟它。

chlimage_1-232

  • 參數
    面板匯入影像時,會預先填入影像的資訊。如果沒有可動態變更的內容,則此視窗為空。

chlimage_1-233

動態變更文字

要動態更改文本,請在欄位中輸入新文本,然後按一下​確定。 在此範例中,Price​現在是$50,而運費是99美分。

chlimage_1-234

影像中的文字會變更。 您可以點選欄位旁的​Reset,將文字重設回原始值。

chlimage_1-235

變更文字以反映用戶端內容值的值

若要將欄位連結至用戶端上下文值,請點選​Select​以開啟用戶端內容功能表,選取用戶端內容,然後點選​OK。 在此示例中,名稱會根據將名稱與配置檔案中的格式化名稱連結而改變。

chlimage_1-236

文字會反映目前登入使用者的名稱。 您可以按一下欄位旁的​Reset,將文字重設回原始值。

chlimage_1-237

  1. 在具有Dynamic Media Classic Image Template​元件的頁面上,點選​Edit

  2. 在​URL​欄位中,輸入在點選影像時使用者前往的URL。 在​​欄位中開啟,選取您要開啟目標(新視窗或相同視窗)。

    chlimage_1-238

  3. 點選​確定

視訊元件

Dynamic Media Classic Video​元件(可從側腳的Dynamic Media Classic區段取得)使用裝置和頻寬偵測,為每個螢幕提供正確的視訊。 此元件為HTML5視訊播放器;它是可跨通道使用的單一檢視器。

它可用於最適化視訊集、單一MP4視訊或單一F4V視訊。

如需有關視訊如何與Dynamic Media Classic整合的詳細資訊,請參閱Video。 此外,請參閱動態媒體經典視訊元件與Foundation Video元件

chlimage_1-239

視訊元件的已知限制

Adobe DAM和WCM會顯示是否上傳主影片。 它們不會顯示下列代理資產:

  • 動態媒體經典編碼轉譯
  • Dynamic Media Classic可調式視訊集

當搭配Dynamic Media Classic視訊元件使用最適化視訊集時,您需要調整元件大小以符合視訊的尺寸。

Dynamic Media Classic內容瀏覽器

Dynamic Media Classic內容瀏覽器可讓您直接在AEM中從Dynamic Media Classic檢視內容。 若要存取內容瀏覽器,請在​Content Finder​中,選取觸控最佳化使用者介面中的​Dynamic Media Classic​或傳統使用者介面中的​S7​圖示。 這兩個使用者介面的功能完全相同。

如果您有多個設定,AEM依預設會顯示預設設定。 您可以直接在下拉式選單的Dynamic Media Classic內容瀏覽器中選取不同的設定。

注意

瀏覽觸控最佳化UI中的內容

您可以在觸控最佳化或傳統UI中存取內容瀏覽器。 目前最佳化觸控功能有下列限制:

  • 不支援Dynamic Media Classic的FXG和Flash資產。

從第三個下拉式選單中選取​Dynamic Media Classic,以瀏覽Dynamic Media Classic資產。 如果您尚未設定Dynamic Media Classic/AEM整合,Dynamic Media Classic不會出現在清單中。

注意
  • Dynamic Media Classic內容瀏覽器會載入約100個資產,並依名稱排序。
  • 如果您已設定安全的預覽伺服器,瀏覽器會使用該預覽伺服器來轉譯縮圖和資產。

chlimage_1-240

此外,您還可以將滑鼠指標暫留在瀏覽器中的資產上,以瀏覽解析度資訊、大小、修改後的天數和檔案名稱。

chlimage_1-241

  • 對於最適化視訊集和範本,不會產生縮圖的大小資訊。
  • 對於最適化視訊集,不會產生縮圖的解析度。

使用內容瀏覽器搜尋Dynamic Media Classic資產

搜尋Dynamic Media Classic資產類似於搜尋AEM資產,但搜尋時,您實際看到的是Dynamic Media Classic系統中資產的遠端檢視,而非直接將資產匯入AEM。

您可以使用傳統UI或觸控最佳化UI來檢視和搜尋資產。 視介面而定,您的搜尋方式略有不同。

在任一UI中搜尋時,您可依下列條件進行篩選(如觸控最佳化UI中所示):

  • 輸入關
    鍵字您可以依名稱搜尋資產。在搜尋您輸入的關鍵字時,檔案名稱的開頭為。 例如,輸入"swimming"會尋找任何以該順序的字母開頭的資產檔案名稱。 在輸入詞語以尋找資產後,請務必點選「輸入」。

chlimage_1-242

  • 資料夾/
    路徑所顯示的資料夾的名稱取決於您選擇的配置。您可以點選資料夾圖示並選取子資料夾,然後點選核取標籤以選取它,以深入探究至較低層級。

如果您輸入關鍵字並選擇資料夾,AEM會搜尋該資料夾和任何子資料夾。 不過,如果您在搜尋時未輸入任何關鍵字,選取檔案夾將只會顯示該檔案夾中的資產,且不會包含任何子檔案夾。

依預設,AEM會搜尋選取的檔案夾和所有子檔案夾。

chlimage_1-243

  • Asset類型選
    取「 動態媒體 類別」以瀏覽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中,您也可以搜尋​Flash​和​FXG。 目前不支援在觸控最佳化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