共用方式為


媒體庫模組

本文介紹媒體庫模組並介紹如何將它們新增至網站頁面 Microsoft Dynamics 365 Commerce。

媒體庫模組在圖庫視圖中顯示一張或多張圖像。 媒體庫模組支援縮圖,可以水平排列(作為圖像下方的行)或垂直排列(作為圖像旁邊的列)。 媒體庫模組還提供了縮放(放大)圖像或以全螢幕模式檢視圖像的功能。 要在媒體庫模組中呈現,圖像必須在 Commerce 網站建立器 媒體庫中可用。 目前,媒體庫模組僅支援圖像。

在預設模式下,媒體庫模組使用產品詳細資訊頁面 (PDP) 的頁面上下文中提供的產品 ID 來呈現對應的產品圖像。 在商務總部,必須為所有產品定義媒體檔案路徑。 然後,應根據為 Commerce 總部的產品定義的檔案路徑將映像上傳到 網站建立器 媒體庫。 這些圖像包括產品和任何產品變體的圖像。 有關如何將圖像上傳到網站建立器 媒體庫的更多信息,請參閱 上傳圖像

或者,媒體庫模組可以在圖像庫頁面上託管一組完全策劃的圖像,其中不依賴產品 ID 或頁面上下文。 在這種情況下,映像必須上傳到網站建立器 媒體庫並在網站建立器 中指定。

以下是媒體庫模組的一些使用範例:

  • 在 PDP 上渲染產品影像
  • 在產品行銷頁面上呈現產品圖像
  • 在行銷頁面(例如圖庫頁面)上展示一組精選圖像

在下圖中的範例中,PDP 上的 購買方塊 使用媒體庫模組託管產品映像。

產品詳細資訊頁面上的 購買方塊 範例,該頁面使用媒體庫模組託管產品圖像。

屬性名稱 描述
影像來源 頁面上下文產品 ID 預設值為 頁面上下文。 如果選擇 頁面上下文 ,則模組期望頁面提供產品ID資訊。 如果選擇 產品 ID ,則必須提供影像的產品 ID 作為 產品 ID 的值財產。 此功能在 Commerce 版本 10.0.12 中提供。
產品識別碼 產品 ID 只有當 影像來源 屬性的值為 產品 ID 時,此屬性才適用。
影像縮放 內聯容器 此屬性允許使用者縮放媒體庫模組中的圖像。 影像可以內嵌縮放,也可以在影像旁邊的單獨容器中縮放。 此功能在 10.0.12 中可用。
縮放係數 十進制數 此屬性指定縮放影像的比例因子。 例如,如果該值設定為 2.5,則影像放大2.5倍。
全螢幕 TrueFalse 此屬性指定是否可以在全螢幕模式下檢視影像。 在全螢幕模式下,如果開啟縮放功能,影像還可以進一步放大。 此功能在 Commerce 版本 10.0.13 版本中提供。
縮放影像品質 1 到 100 之間的數字,表示百分比,並使用軌跡欄控制項進行選擇 此屬性定義放大影像的影像品質。 可以將其設為 100%,以確保縮放影像始終使用盡可能高的解析度。 此屬性不適用於 PNG 文件,因為它們使用無損格式。 此功能自 Commerce 版本 10.0.19 版本起提供。
影像 從 網站建立器 媒體庫中選擇的映像 除了從產品中呈現之外,還可以為媒體庫模組策劃圖像。 這些圖像將附加到任何可用的產品圖像中。 此功能在 Commerce 版本 10.0.12 中提供。
縮圖方向 垂直水平 此屬性指定縮圖影像應顯示在垂直條帶還是水平條帶中。
隱藏產品變型的基準產品影響 TrueFalse 如果此屬性設定為 True,則選擇變體時,主產品的影像將被隱藏,除非該變體沒有影像。 此屬性不會影響沒有變體的產品。
選取維度時更新媒體 TrueFalse 如果此屬性設定為 True,則在選擇任何尺寸(例如顏色、樣式 或尺寸)時,並且如果圖像可用。 此屬性有助於簡化瀏覽體驗,因為並非必須選擇每個產品變體尺寸才能更新對應的圖像。 此屬性可在 進階 標籤上找到。

重要

更新維度選擇媒體 屬性自 Commerce 版本 10.0.21 版本起提供。 它要求安裝 Commerce 模組庫 軟體包版本 9.31。

下圖顯示了媒體庫模組的範例,其中提供全螢幕和縮放選項。

媒體庫模組的範例,其中提供全螢幕和縮放選項。

下圖顯示了具有精選圖像的媒體庫模組的範例(即,指定的圖像不依賴產品 ID 或頁面上下文)。

包含精選圖像的媒體庫模組範例。

商務 摺疊面板 互動

當影像來源源自頁面上下文時,PDP 中的產品 ID 用於檢索影像。 媒體庫模組使用 Commerce 級別單位 應用程式介面 (API) 擷取產品的映像檔路徑。 然後從媒體庫中提取圖像,以便可以在模組中渲染它們。

若要將媒體庫模組新增至行銷頁面,請執行 跟隨 這些步驟。

  1. 前往 範本,然後選擇 新建 建立新範本。
  2. 新範本 對話方塊中的 範本名稱下,輸入 行銷範本,然後選擇 確定
  3. 正文 插槽中,選擇省略號 (...),然後選擇 新增模組
  4. 選擇模組 對話方塊中,選擇 預設頁面 模組,然後選擇 確定
  5. 在預設頁面的 插槽中,選擇省略號 (...),然後選擇 新增模組
  6. 選擇模組 對話框中,選擇 容器 模組,然後選擇 確定
  7. 選擇 儲存,選擇 完成編輯 以簽入模板,然後選擇 發佈 以發布它。
  8. 前往 頁面,然後選擇 新建 以建立新頁面。
  9. 在裡面 建立一個新頁面 對話框,在 頁面名稱, 進入 媒體庫頁面,然後選擇 下一個
  10. 選擇範本下,選擇您建立的 行銷範本 ,然後選擇 下一步
  11. 選擇 配置 下,選擇頁面 配置(例如, Flexible 配置),然後選擇 下一步
  12. 查看並完成下,查看頁面配置。 如果您需要編輯頁面訊息,請選擇 返回。 如果頁面資訊正確,請選擇 建立頁面
  13. 在新頁面的 Main 插槽中,選擇省略號 (...),然後選擇 新增模組
  14. 選擇模組 對話框中,選擇 容器 模組,然後選擇 確定
  15. 容器 插槽中,選擇省略號 (...),然後選擇 新增模組
  16. 選擇模組 對話方塊中,選擇 媒體庫 模組,然後選擇 確定
  17. 在媒體庫模組的屬性窗格中,在 圖片來源, 選擇 產品編號。 然後,在 產品編號 欄位中,輸入產品 ID。
  18. 選擇 儲存,然後選擇 預覽版 to 預覽版 頁面。 您應該能夠在圖庫視圖中看到產品的圖像。
  19. 若要僅使用精選影像,請在屬性窗格中的 影像來源下選擇 Productid。 然後,在 圖像下,根據需要多次選擇 添加圖像 以從媒體庫添加圖像。
  20. 設定您想要設定的任何其他屬性,例如 影像縮放縮放係數縮圖方向
  21. 完成後,選擇 儲存,選擇 完成編輯 簽入頁面,然後選擇 發布 發布它。

其他資源

模組資源庫概觀

購買方塊 模組

容器模組

上傳圖像