進階列表與相簿區塊：Query Loop Builder 與 Dynamic Gallery

網站常見的需求：首頁要放「最新 6 篇文章」、商品頁要放「特色商品輪播」、文章內頁底部要放「相關文章」、頁面要放「活動現場照片相簿」。秒站編輯器裡有兩個區塊專門做這些：Query Loop Builder 抓文章或商品做卡片列表，Dynamic Gallery 做頁面相簿。本篇講這兩個怎麼用。

Query Loop Builder｜文章或商品列表#

用一張卡片模板，自動列出多筆文章或商品。每張卡有圖、標題、簡介、日期或價格、點擊跳到對應頁面。

怎麼叫出來#

編輯器裡按「+」或輸入「/」，搜尋「query loop builder」。插入時會跳出預設模板選擇畫面，先選一個接近的（網格卡片、橫向列表、輪播等），插入後再客製比較快。

資料來源設定#

右側面板的「Source」分頁是核心：

抓什麼：文章（post）、頁面（page）、商品（product，需要有開啟商城功能）
顯示幾筆：常見是 3、4、6、8
排序：依日期、選單順序、隨機、留言數等
分類篩選：只要某個分類的內容
排除目前文章：放在文章內頁顯示「相關文章」時必勾，避免自己出現在列表
分頁方式：分頁、看更多按鈕、無限捲動，三選一

三個常用設定#

首頁最新 6 篇文章

抓什麼：文章
顯示幾筆：6
排序：日期、新到舊
排列：網格，電腦版 3 欄、手機 1 欄

文章內頁的相關文章

抓什麼：文章
顯示幾筆：3
分類篩選：當前分類（系統會自動帶入）
排除目前文章：勾

首頁特色商品輪播

抓什麼：商品
顯示幾筆：8
分類篩選：先在後台建一個「特色商品」分類，把要展示的商品歸進去
排列：輪播，電腦版每次 4 張、手機 2 張

Dynamic Gallery｜頁面相簿#

把多張照片排成相簿。例如服務頁底部放團隊照、活動回顧頁放現場照、作品集放成果展示圖、產品頁放多角度展示圖。

怎麼叫出來#

編輯器裡按「+」或輸入「/」，搜尋「dynamic gallery」。插入後選擇相簿來源（直接上傳一組照片或從媒體庫選），系統會自動排版。

常用設定#

排列方式：網格（整齊方塊）、輪播（左右滑）、瀑布流（高低不一最自然）
每行幾張：每個裝置分開設。電腦版 3-4 張、手機 2 張常見
燈箱：點照片彈出大圖、可上下切換瀏覽。相簿幾乎一定要開
滑鼠效果：移上去放大、變暗、加說明文字

適合放什麼#

活動回顧的現場照片牆
作品集、案例的成果圖
產品多角度展示
團隊照、店面環境照
菜單、產品型錄類圖片集

使用建議#

圖片上傳前先壓縮：原始照片可能很大，每張壓到 200-400KB 載入才順
燈箱一定開：沒燈箱點圖會跳到附件頁，體驗很差
手機改輪播：網格在手機上每張會縮太小看不清，改輪播（手指滑動）較好
照片有直有橫：用瀑布流不會互相裁切，每張保留原本比例

該用哪一個#

要列「文章」或「商品」用 Query Loop Builder
要做「相簿照片集」用 Dynamic Gallery

常見問題

Query Loop Builder 跟 Dynamic Gallery 哪個適合作品集？

看作品集的結構。每件作品是一篇文章（有圖、標題、簡介、連結到內頁）→ 用 Query Loop Builder 列卡片；單一頁面要展示一件作品的多角度照片 → 用 Dynamic Gallery 做相簿。實務上常常兩個都用：作品集首頁用 Query Loop Builder 列卡片，每件作品內頁用 Dynamic Gallery 做相簿。

商品輪播抓不到我要的商品？

先確認商品的「分類」與「狀態」。Query Loop Builder 預設只抓「已發佈」狀態；分類篩選如果設了，沒被歸到該分類的商品不會出現。

為什麼隨機排序每次看順序都一樣？

頁面快取造成的。系統把整頁快取下來時，把那一刻的「隨機」順序也存了。要看真的隨機要把這個區塊放在沒快取的頁面，或減少快取時間。

Dynamic Gallery 一次能放幾張照片？

沒硬性上限，但建議單一相簿不超過 30 張。超過會增加頁面載入時間、使用者也很難看完。多照片建議拆成多個相簿或用「分頁」呈現。

燈箱（Lightbox）怎麼開？

在 Dynamic Gallery 的設定面板找到「Lightbox」開關打開即可。預設是關的，相簿幾乎一定要開、不然點圖會跳到附件頁體驗很差。