媒體 — 影像

在Page Builder面板中，展開​ Media ​並將​ Image ​預留位置拖曳至目標容器。

您可以將影像新增至列、欄或索引標籤。 在下列範例中，將影像拖曳至空白欄。

{width="600" modal="regular"}

使用下列其中一種方法來新增影像資產：

{width="500" modal="regular"}

• ​ 上傳新影像 ​：使用此方法從您的系統上傳新影像檔案。

  • 按一下​ Upload Image。

  • 找出並選擇影像，將其新增至相簿和目標容器。

  或者，您也可以從系統拖曳影像檔案，並將它拖放到​ 攝影機 （ {width="20"} ）圖示上。

• ​ 選取現有資產 ​：使用此方法從媒體儲存/媒體集選取現有影像資產。

  • 按一下​ Select from Gallery。

  • 使用樹狀結構導覽至影像。

  • 按一下縮圖並按一下​ Add Selected。

    {width="600" modal="regular"}

• ​ 搜尋並選取Adobe Stock影像 ​：使用此方法從Adobe Stock尋找影像。

  note note
  NOTE
  此方法需要為您的管理員設定Adobe Stock整合。

  • 按一下​ Search Adobe Stock ​並搜尋影像。

  • 將預覽或授權的影像儲存至相簿。

    如需使用Adobe Stock資產的詳細資訊，請參閱使用Adobe Stock影像。

  • 選取相簿中的資產縮圖，然後按一下​ Add Selected。

影像會顯示在預留位置的目標容器中。 不同於背景影像，您可以將影像移至目前容器內的不同位置或不同容器。

{width="500" modal="regular"}

將滑鼠懸停在影像容器上以顯示工具方塊，並選擇​ 設定 （ {width="20"} ）圖示。
檔案名稱、尺寸和檔案大小會顯示在目前影像的下方。

{width="600" modal="regular"}

若要變更目前的​ Image，請執行下列其中一個動作：

• ​ 上傳新影像 ​：使用此方法從您的系統上傳新影像檔案。

  • 按一下​ Upload Image。

  • 找出並選擇影像，將其新增至相簿和目標容器。

• ​ 選取現有資產 ​：使用此方法從媒體儲存/媒體集選取現有影像資產。

  • 按一下​ Select from Gallery。

  • 使用樹狀結構導覽至影像。

  • 按一下縮圖並按一下​ Add Selected。

    {width="600" modal="regular"}

• 搜尋並選取Adobe Stock影像：使用此方法從Adobe Stock尋找影像。

  note note
  NOTE
  此方法需要為您的管理員設定Adobe Stock整合。

  • 按一下​ Search Adobe Stock ​並搜尋影像。

  • 將預覽或授權的影像儲存至相簿。

    如需使用Adobe Stock資產的詳細資訊，請參閱使用Adobe Stock影像。

  • 選取相簿中的資產縮圖，然後按一下​ Add Selected。

若要新增​ Mobile Image，請使用上一步所述的相同方法，選取要在行動裝置上顯示的影像。

{width="600" modal="regular"}

如有需要，請為影像指定​ Link。

連結是客戶按一下影像時顯示的目的地頁面。 您可以使用下列三種連結型別之一：

• URL — 連結至相對或完整URL。

• Product — 根據產品名稱或SKU識別目的地頁面。 根據部分或完整名稱依名稱搜尋產品。 從搜尋結果清單中選擇產品。

  {width="600" modal="regular"}

• Category — 將目的地頁面識別為類別樹狀結構中的特定類別或子類別。 根據部分或完整名稱搜尋類別。 從所顯示樹狀結構的展開區段中選擇類別。

  {width="600" modal="regular"}

• Page — 將目的地頁面識別為特定內容頁面。 根據部分或完整名稱來搜尋頁面。 從搜尋結果清單中選擇頁面。

  {width="600" modal="regular"}

如果您要防止訪客離開您的商店，請選取「Open in new tab」核取方塊。 清除核取方塊後，連結的目的地會在相同的瀏覽器標籤中開啟，這樣可以有效地導覽訪客離開您的商店。

若要新增​ Image Caption，請輸入您要顯示在影像下方的文字。

註解的格式由與目前主題關聯的樣式表決定。

註解通常會顯示在影像下方，為訪客和搜尋引擎提供有關影像的資訊。 如果您的網站提供多種語言版本，您可以使用相同的影像，但需翻譯標題。 在HTML中，<figcaption>標籤是<figure>標籤的子集。<figcaption>This is the image caption</figcaption>

視需要更新任何其他設定：

• 搜尋引擎最佳化
• 進階

完成後，按一下​ Save ​套用設定並返回Page Builder工作區。

將滑鼠停留在影像容器上以顯示工具箱，然後選擇​ 移動 （ {width="20"} ）圖示。

{width="500" modal="regular"}

選取並將影像拖曳到新的位置，正好在紅色指引的下方。

{width="500" modal="regular"}

將滑鼠懸停在影像容器上以顯示工具箱，然後選擇​ 移除 （ {width="20"} ）圖示。

提示確認時，按一下​ OK。