360° 圖片庫元件

這個元件不適用於 AMP HTML 廣告、影片廣告和圖像廣告。

「360° 圖片庫」元件可讓您使用多張圖片，呈現出可立體旋轉的物件。元件預設為將最後一張圖片與第一張圖片重合，因此使用者可以將物件往任一方向旋轉。

以下範例包含 7 張來源圖片：

選擇適合的圖片庫

Google Web Designer 有四種不同的圖片庫元件：

• 360° 圖片庫可顯示各種角度的物件圖片，您只需前後滑動即可旋轉物件。這種圖片庫無法顯示群組或導覽元素。
• 滑動式圖片庫會顯示簡潔的平面畫面，讓您在圖片或群組之間縱向/橫向滑動。
• 輪轉式圖片庫與滑動式圖片庫類似，但會以 3D 形式顯示鄰近圖片，就像在展示轉盤上一樣。
• 轉換式圖片庫可在切換圖片時顯示各式各樣的動畫效果。

如何在專案中使用 360° 圖片庫：

1. 依序開啟「元件」面板和「圖片庫」資料夾。

2. 將「360° 圖片庫」元件 拖曳至中心區域。

3. 在「屬性」面板的「360° 圖片庫」屬性部分中指定元件名稱。

4. 使用下列其中一項做法，將圖片新增至圖片庫：

   • 在「屬性」面板的「360° 圖片庫」屬性部分中找出 [圖片] 欄位，按一下其中的 [選取圖片庫中的圖片]按鈕 。您可以按一下 [選擇圖片] 按鈕來瀏覽圖片檔，或是將檔案直接拖曳到對話方塊中。
   • 在「屬性」面板的「360° 圖片庫屬性」部分中找出 [圖片] 欄位，於其中新增圖片網址 (以逗號分隔)。

5. 視需求調整其他元件屬性 (如下所述)。

如何重新排序或移除圖片庫中的圖片：

1. 在「屬性」面板的「360° 圖片庫」屬性部分中，按一下「選取圖片庫中的圖片」按鈕 。
2. 如要重新排序圖片，可直接將圖片拖曳到新的位置。如要將圖片從圖片庫中移除，則可將游標懸停在圖片上，然後按一下「刪除」按鈕 。
3. 按一下 [確定]。

屬性

屬性	說明
名稱	元件名稱。
圖片	要在圖片庫中顯示的圖片網址 (以逗號分隔)。可繫結至動態資料。
自動播放	如果勾選這個屬性，圖片庫中的圖片就會自動依序播放。
納入	如果勾選這個屬性，圖片庫中的圖片就會收納至任一端 (第一張和最後一張圖片)。

事件和動作

360° 圖片庫傳送的事件

您可以透過下列 360° 圖片庫元件事件觸發其他動作：

事件	說明
首次互動	使用者首次與圖片庫互動時傳送。
已檢視所有畫格	圖片庫中的每個畫格均已顯示過至少一次後傳送。
已載入圖片	圖片庫中的所有畫格皆已載入後傳送。
已顯示畫格	每個新畫格均已完整顯示後傳送。
畫格已啟用	畫格變更開始後傳送。
輕觸畫面格	使用者按一下畫格之後傳送。

如要在「事件」對話方塊中選擇以上任一事件，請將 360° 圖片庫元件設為「目標」。

360° 圖片庫元件執行的動作

以下 360° 圖片庫元件動作可透過其他事件觸發：

動作	設定選項
移至畫格	畫面編號 動畫 -「無」或「投影片」 輪播方向 -「向前」或「向後」
輪播一次	輪播時間 - 以毫秒為單位 輪播方向 -「向前」或「向後」
向前	無
向後	無

在「事件」對話方塊中選擇以上任一事件時，請將 360° 圖片庫元件設為「接收端」。

瞭解如何設定事件。

預覽

360° 圖片庫元件在中心區域僅會顯示起始畫格，讓您大致瞭解元件的顯示方式。如要查看元件的完整運作情形，您可以按一下右上角的「預覽」按鈕，在自己慣用的瀏覽器中預覽文件。