[AEM Assets]{class="badge positive" title="適用於AEM Assets)。"}
管理Dynamic Media範本 dynamic-media-templates
使用Dynamic Media範本（WYSIWYG範本編輯器），為您的橫幅和傳單建立即時可自訂的範本。 發佈您的Dynamic Media範本並在下游應用程式中使用。 Dynamic Media範本包含影像和文字圖層。 新增引數至範本的影像和文字圖層，並使用Dynamic Media URL來重新定位和調整圖層大小，並即時更新其內容。
其中一些主要功能包括：
- Dynamic MediaWYSIWYG範本編輯器：建立可自訂的橫幅（包含影像與文字圖層）。
- 圖層參數化：定義圖層的動態索引鍵值配對，啟用即時更新。
- Dynamic MediaURL支援：使用Dynamic Media URL作為範本，整合來自第一方或第三方應用程式的個人化值。
- 圖層可見度控制：視需要動態收合或展開圖層。
- 智慧調整文字大小：自動調整文字大小，使其符合指定的區域。
Dynamic Media範本的一些主要優點包括：
- 最佳化 1:1 個人化：根據即時客戶訊號量身打造內容。
- 減少手動工作：將內容創作和管理自動化並加速執行。
- 確保一致的全通道體驗：保持管道間的品牌一致性。
- 有效地重複使用內容：避免內容僅使用一次，並透過動態的參數化範本進行擴展。
- 降低風險：即時更新定價、折扣和連結。
- 增強客戶參與度：推動互動式、情境相關的體驗。
瞭解如何在此影片中逐步建立Dynamic Media範本。
開始之前 prerequisites-for-dynamic-media-wysiwyg-template
滿足下列要求以建立Dynamic Media範本並產生其傳遞URL：
-
存取Dynamic Media。
-
在Assets View首頁上，Dynamic Media Assets中有資料夾可儲存您的範本。 在
-
發佈要在建立範本時使用的影像，以在建立範本後產生範本的傳遞URL。 傳遞URL可用於下游應用程式。
-
若要在範本的文字圖層中使用預設Adobe Sans F2字型以外的字型，請同時上傳字型檔案並發佈至AEM和Dynamic Media 。 支援的字型檔案格式為：AFM、OTF、PFB、PFM、PhotoFont、TTC、TTF。 此外，請確定重新處理現有的字型以使用這些字型。 如需詳細資訊，請參閱字型。
-
在觸控式UI中驗證下列專案：
- 在 編輯Dynamic Media設定頁面 上，預設設定為 已停用 的 Dynamic Media同步處理模式 未套用至所有AEM資料夾（同步處理所有內容已取消核取）。 如需詳細資訊，請參閱設定 Dynamic Media 雲端服務。
- 目的地資料夾或子資料夾的 Dynamic Media同步模式 設定為啟用子資料夾，您會在建立後儲存範本。 如需詳細資訊，請參閱設定 Dynamic Media Cloud Service。
建立Dynamic Media範本 how-to-create-dynamic-media-template
執行以下步驟來建立Dynamic Media範本：
建立空白畫布 create-a-canvas
執行以下步驟來建立空白畫布：
-
導覽至Assets View，選取左側面板中可用的Dynamic Media Assets，然後導覽至您的資料夾，將範本儲存在該資料夾中。
-
選取建立範本。 接著出現 新範本 對話框。
note NOTE 範本會儲存在您建立它的位置。 在Assets View首頁上，選取Dynamic Media Assets，然後按一下建立範本，將範本儲存在 Dynamic Media Assets 根資料夾中。 -
指定範本名稱、定義畫布寬度和高度，然後按一下「建立」。 接著顯示空白畫布，其兩側都提供建立範本時可使用的選單選項。 停留在選單選項上即可檢視其工具提示。
note NOTE 允許的寬度和高度範圍是從 50 到 5000。
右側窗格上的選單選項：使用這些選項，將必要的影像和文字圖層新增至畫布。
-
-
-
左窗格上的功能表選項：請將這些選項用於下列一般編輯器動作。
-
-
](Windows)或Cmd +](Mac)，將選取的圖層往前移。 -
[(Windows)或Cmd +[(Mac)以向後傳送選取的圖層。 -
-
-
-
- 如果沒有編輯文字或屬性，請按 退格鍵 或 刪除 刪除選取的圖層。
按一下
將影像新增至畫布 add-images-to-the-canvas
執行以下步驟，將影像新增至畫布：
將文字圖層新增至畫布 add-text-to-the-canvas
執行以下步驟，將文字圖層新增至畫布：
- 按一下「
- 選取圖層並按一下文字進行更新。
- 在「屬性」面板中選取「智慧型文字調整大小」，自動調整文字長度和字型大小，以最佳方式配合指定的區域。
查看 屬性面板 以便移動、縮放、旋轉或刪除圖層。 在面板的 文字 區段下的個別欄位中變更文字的值，將文字格式設定為所需的字型、大小、顏色、樣式、對齊方式（在圖層中）。 字型系列欄位會顯示Adobe Sans F2預設字型、重新處理的現有字型，以及新上傳和發佈的字型。 如需詳細資訊，請參閱上文開始之前一節中的要點5。
格式化選擇性文字 apply-formatting-to-substring
執行以下步驟來格式化字串的特定部分：
-
在字串中選取一個或多個要格式化的字元。
-
使用屬性面板格式化選取範圍。 下列格式選項適用於子字串及其部分：
- 字型樣式：使用 字型樣式 選項的粗體、斜體、底線、下標和上標。
- 字型屬性：使用個別面板選項變更字型系列、顏色、大小和行距。
每個格式化字串部分都會顯示為子字串選取器中的子字串，可在引數面板中使用。 新增引數至這些格式化部分，以使用範本的傳遞URL動態格式化它們。
將圖案新增至畫布 add-shapes-to-the-canvas
執行以下步驟來將圖案新增至畫布：
- 按一下
- 捲動至面板的 樣式 區段，在 圖案色彩 欄位中定義十六進位程式碼，或使用檢色器填入選取圖案的色彩。
- 啟用 統一半徑 切換功能，並使用 圓角半徑 滑桿來統一調整矩形四個角落的圓度。 停用切換功能，藉由指定每個轉角的特定半徑值來自訂轉角圓度。
- 將 隱藏 引數新增至選取的圖層，以使用範本URL即時顯示或隱藏範本中的圖層。
- 選取圖層以新增CTA連結，讓使用者在即時範本中按一下形狀做為超連結。
編輯或刪除圖層 edit-or-delete-a-layer
執行以下步驟來編輯或刪除畫布圖層：
- 按一下
- 按一下更多選項(
- 按一下「刪除」以刪除圖層。
- 按一下「編輯」，使用「屬性面板」編輯圖層。
屬性面板 properties-panel
屬性面板包含區段以重新定位、調整大小和旋轉圖層。 它也會提供圖案圖層的填色選項、文字圖層的文字格式選項，以及將CTA連結新增至任何選取圖層的選項。若要瀏覽至圖層的屬性面板，請按一下
從圖層的屬性面板中，選取畫布上的另一個圖層以瀏覽至其屬性面板。
移動、縮放、旋轉或刪除圖層 reposition-resize-delete-a-layer
查看編輯文字或影像圖層的常見圖層編輯動作：
- 移動圖層：拖曳圖層並移動到畫布上任何位置。 此動作會更新屬性面板中的 X 和 Y 值。 X和Y是畫布平面上圖層中心的座標。
- 縮放圖層：選取圖層並拖曳其邊緣控點進行縮放。 此動作會更新屬性面板中的 W (寬度) 和 H (高度) 值。
- 旋轉圖層：拖曳垂直放置在圖層上方的方形控點，使其繞中心旋轉。 此動作會更新屬性面板中的角度值。
- 刪除圖層：按下 Backspace 鍵或「刪除」，然後按一下「確認」，刪除所選取的圖層。
文字格式選項 text-formatting-options-on-properties-panel
將文字的格式設定為所需的字型、大小、顏色、樣式、對齊方式（在圖層內），方法是在面板的 文字 區段下的個別欄位中變更其值。確定包括智慧文字調整大小。 智慧型文字調整大小適用於Copyfitting演演算法，可在文字區域中以最佳方式填入文字，防止文字溢位，並儘量減少文字底部的額外空間。
將圖層參數化 parameterise-a-layer
建立包含多個影像、文字和形狀圖層的範本後，請引數化選取的圖層。 將圖層或其屬性參數化後，便會取得索引鍵值組 (也稱為參數)。 您可以在範本 URL 中包含這個參數，以便即時更新圖層的位置、大小或內容，達到即時自訂範本的效果。
若要將圖層參數化：
- 按一下
- 切換「包含引數」功能，將屬性參數化。 請參閱引數面板選項，瞭解引數化後的屬性行為。
- 選用：將參數重新命名。 引數名稱具有圖層名稱及尾碼。 所選圖層的所有參數化屬性會使用相同的圖層名稱並在後面加上不同的後綴。 依照語意命名慣例將圖層重新命名，以便在 URL 中加入此參數時，參數名稱本身就能說明圖層的內容或其用途。
- 按一下儲存。
若要在影像和文字圖層的參數面板之間切換，請選取畫布上的圖層，然後按一下「參數」。
參數面板選項 parameterisation-options-or-allowed-parameters
參數化的屬性可做為 URL 參數加入到範本 URL 中，以便使用 URL 即時編輯範本。
圖層引數 layer-parameters
以下是同時套用至影像和文字圖層的圖層引數。
X：包含以變更URL中的引數值，沿圖層中心線水準移動圖層，平行於範本平面的X軸。Y：包含以變更URL中的引數值，沿著圖層的中心線垂直移動圖層，平行於範本平面的Y軸。寬度：包含以變更URL中的引數值來調整圖層的寬度。高度：包含以變更URL中的引數值來調整圖層高度。隱藏：包含以使用0 （顯示）和1 （隱藏）來隱藏或顯示範本中的圖層。
影像引數 image-parameter
加入 Source 引數，變更URL中引數值的影像路徑，以新影像取代圖層的影像。
文字格式設定引數 text-formatting-parameters
納入下列引數，藉由更新URL中的引數值，從傳送URL編輯文字、其字型、顏色和大小：
文字：包含以從URL更新文字。字型系列：包含以從URL更新文字的字型。字型大小：包含以從URL更新文字的字型大小。文字色彩：包含以從URL更新文字的字型色彩。
引數化子字串 substring-parameterisation
在 引數 面板中，捲動至 子字串引數 區段。 此區段包含一個子字串選取器，它會將具有一致格式設定的完整字串（選取的文字圖層）或其格式化部分顯示為個別的子字串。 選取子字串以引數化其文字、字型系列、字型大小及顏色。使用子字串選擇器分割子字串以引數化其個別部分，或合併子字串以套用統一的引數。
分割子字串 split-substring
若要將子字串的特定部分引數化，請拉出該部分，使其成為個別選取和引數化的個別子字串。 執行以下步驟，將子字串分割為個別的子字串：
- 在子字串選取器中，選取子字串內的字元以區隔它。
- 按一下
您可以選取必要的子字串來引數化其文字、字型系列、字型大小及顏色。
合併子字串 merge-substring
合併子字串會移除其現有的個別引數，並可讓您跨新形成的子字串套用一致的引數。執行以下步驟來合併兩個相鄰的子字串，以將統一的引數套用至產生的子字串：
-
在子字串選取器中，選取兩個相鄰子字串間具有相同格式的字元。
-
按一下
您可以將統一的引數套用至新形成的子字串。
note NOTE 只能合併格式相同的子字串。
將圖層分組，以便同時控制其可見度 group-layers
另一種保持範本靈活性的方式是使用單一引數名稱來控制多個圖層。 此策略對於可見度 (收合或展開圖層) 參數有效，可更新單一範本的設計或圖形。
請依照下列步驟，為多重圖層的隱藏引數（
預覽和發佈Dynamic Media範本，以複製傳遞URL preview-and-publish-dynamic-media-template-and-copy-template-deliver-url
執行以下步驟以預覽和發佈範本，並複製傳遞 URL：
-
在畫布頁面上，按一下「預覽」。 您也可以導覽至Assets檢視 > Dynamic Media Assets >尋找並選取您的範本 > 按一下編輯範本 >按一下預覽。 預覽頁面會顯示範本、其參數 (參數化的圖層和屬性)、發佈狀態以及 發佈 選項。
-
從 範本引數 面板中選取引數，以編輯其值，並立即更新預覽中對應範本圖層的內容、大小、位置或文字格式。 例如：
- 選取文字圖層並編輯其文字，或
- 選取影像圖層，按一下
範本會立即更新，顯示編輯過的文字，並將先前的影像替換為新影像。 此外，影像參數值會反映新的影像路徑。 同樣地，您可以調整圖層的值來進行縮放，而相關變更會即時套用至範本。
-
從清單中選取群組圖層的 隱藏 引數，以便在範本中顯示或隱藏它們。
-
選用：變更「收合」參數值為 0 或 1，然後按一下「重新整理」以檢視變更。 具有相同 隱藏 引數的圖層會隱藏或同時顯示。 同樣地，您可以於 URL 控制圖層的可見度。
您也可以切換「包含所有參數」，以編輯顯示的所有參數值，並在範本預覽中檢視更新。 -
若要從預覽頁面發佈範本，請按一下 發佈 並確認發佈。 顯示 發佈完成 訊息，且發佈狀態更新為已發佈。
複製傳遞 URL
在「預覽」頁面上選取的參數會成為範本 URL 中的 URL 參數。
確認範本中的影像已發佈至AEM和Dynamic Media，以產生範本的傳遞URL。
執行以下步驟，複製範本的傳遞URL：
- 按一下「複製 URL」。 接著顯示「複製 URL」對話框。 選取並複製顯示的 URL。 URL中的第一個引數在問號 (？) 之後開始 而索引鍵值組開頭為 $，結尾為 &。 金鑰和值以等號分隔(=)，金鑰在左側，值在右側。
- 將此 URL 貼到瀏覽器分頁中，即可檢視您的即時範本。 直接在 URL 中更新所需參數的值 (索引鍵值)，即可即時自訂範本，如 預覽和發佈 區段的步驟 2 所示。
- 使用此 URL 快速推廣與銷售您的產品或服務。 您可以與客戶共用此 URL，或將 URL 整合至您的網站或任何下游第三方應用程式中，以便顯示橫幅並進行即時更新，藉此反映目前的優惠活動。
從URL即時更新Dynamic Media範本 update-the-template-from-the-url
直接在 URL 中編輯參數可能是很繁瑣的工作。 若要簡化：
-
複製 URL 並貼到記事本中。
-
使用 Cmd+F (Mac) 或 Ctrl+F (Windows) 來尋找及編輯參數值。 例如：
- 尋找和取代影像圖層的影像路徑。
- 尋找圖層的引數化座標、寬度和高度，以調整其值。
- 編輯文字圖層的文字、字型、顏色、大小或對齊方式。
- 以 0 或 1 的值來變更可見度。
將此更新後的 URL 貼到瀏覽器中可檢視變更。
編輯Dynamic Media範本 edit-the-template
依照下列步驟編輯範本：
- 在Assets view上，按一下Dynamic Media Assets。
- 導覽至範本位置。
- 選取範本。
- 按一下「編輯範本」。 範本畫布會在「圖層」面板中顯示範本及其所有圖層的清單。 根據您的需求開始編輯範本。
將Call to action (CTA)連結新增至您的Dynamic Media範本層 add-CTA-in-dynamic-media-templates
將Dynamic Media範本的任何影像、文字或形狀圖層轉換為超連結，方法是新增指向該範本的CTA連結，將使用者導向目標頁面。
執行以下步驟，將CTA連結新增至圖層：
-
導覽至您的範本位置，選取範本並按一下
-
選取範本圖層並導覽至其屬性面板以新增CTA連結至該圖層。
-
在屬性面板上，選取新增CTA，在 URL 欄位中指定目的地URL，然後按一下儲存。
-
按一下[預覽] 並選取[發佈] 以發佈您的範本（若未更早發佈）。
-
導覽至儲存此範本的資料夾，選取此範本並按一下
-
按一下 複製選項 並選取複製內嵌程式碼。 請確定將範本影像發佈至AEM and Dynamic Media以複製內嵌程式碼。
以下是內嵌程式碼的範例：
code language-json <div class="adobe-dynamicmedia-template-embed-container"> <img id="<Image ID>>" src="<Image Source>>" alt="adobe dynamicmedia template" usemap="#adobe-dynamicmedia-template-map" width="800" height="300"> <map name="adobe-dynamicmedia-template-map"> <area shape="rect" coords="417,-60,817,340" href="https://business.adobe.com/tw/products.html" alt="Layer with CTA" title="https://business.adobe.com/tw/products.html" target="_blank"> <area shape="rect" coords="6,206.57,129,231.43" href="https://business.adobe.com/tw/products.html" alt="Layer with CTA" title="https://business.adobe.com/tw/products.html" target="_blank"> </map> </div> -
將複製的內嵌程式碼新增至網站的HTML檔案，並在瀏覽器中執行以顯示範本。
按一下範本上的CTA元素，即可導覽至目的地頁面。
觀看此逐步影片，瞭解如何將CTA連結新增至範本圖層。
需要注意的重要事項 important-points-to-note
- 建立包含參數化影像圖層以供動態更新的範本後，請確保未來將進行更新的圖片與參數化影像具有相同的維度。 這樣能確保影像完美地嵌入圖層中，既不會溢出，也不會留下空白處。 目前，範本不支援自動調整維度讓影像符合圖層規格。
- 文字圖層不支援子字串。 使用者無法在文字圖層的子字串上套用不同的字型屬性。
- Dynamic Media範本目前無法支援多個Dynamic Media公司。
- 若是複製或移動，Destination Selector會顯示所有資料夾（包括非Dynamic Media同步資料夾）。 此外，目前也不會顯示Dynamic Media範本資產（兩者皆為目的地選擇器的限制）。
- 從Assets區段對資料夾執行的任何更新操作（例如「發佈」或「刪除」）都會影響該資料夾中可用的Dynamic Media範本。
- 垃圾桶無法用於Dynamic Media範本。 如果資產移至垃圾桶後還原，資產會在AEM中還原，但不會在Dynamic Media上還原。 Dynamic Media範本也是相同的。
另請參閱
- 探索Dynamic Media 及其功能
- 使用OpenAPI功能探索Dynamic Media