Built on WIX Headless

文件 功能 搜尋與篩選

搜尋與篩選

使用 CMS for Harmony,讓訪客在 Wix Harmony 上搜尋並篩選 CMS Table、Repeater、Calendar、Media Gallery 與 Slideshow 內容。

Table、Repeater、Calendar、Media Gallery 與 Slideshow 支援面向訪客的搜尋與篩選,讓大型集合在正式網站上仍好用。

篩選能力

  • 每個篩選的比對條件:等於、不等於、包含、開頭/結尾為、大於/小於,或介於
  • 同一欄位可套用多個篩選
  • 日期與數字範圍控制
  • Show filter 與 Choose value:顯示訪客控制項,或一律套用固定值且不顯示介面
  • Reference 與 Multi-reference 欄位:等於/不等於,或包含/全部包含,選項來自相關集合——為選項標籤挑選 Display field
  • Color 欄位:以 Color swatches(及其他選擇控制)篩選
  • 使用網站字型設定搜尋與篩選介面樣式

Dependent filters

在選擇型篩選上開啟 Dependent filter,可將選項限制為套用搜尋與列在此篩選上方的篩選後仍存在的值。請將父層篩選放在清單較上方,讓子篩選正確串聯。

相對日期範圍 {#relative-date-ranges}

DATE 或 DATETIME 欄位在 Choose value 模式下,可將 Value type 設為 Relative range,不必手動輸入固定日期。小工具會在正式網站自動套用範圍(訪客無控制項)。

範圍包含內容
Today當天
Next 7 days含今天共 7 天
Next 30 days含今天共 30 天
This calendar week從 Week starts on 所選星期起算 7 天(週日至週六可選)
This calendar month當月 1 日至最後一天

提示: 週五至週四的活動週:條件 Between、Relative range → This calendar week、Week starts on → Friday。

日期邊界(時區) {#relative-date-timezone}

Relative range 時,Date boundaries 決定「今天」與午夜所用的時區:

選項行為
Visitor’s device(預設)訪客瀏覽器日曆。
Site timezoneWix Settings → Website settings → Time zone(例如 America/Denver)。所有訪客同一邊界,含夏令時間。
Fixed timezone從下拉選 IANA 時區(例如 GMT-6 — America/Denver)。

設定範圍、Week starts on 與 Date boundaries 後,面板會顯示即時預覽。

區域活動站: 週次與「僅顯示未來」篩選建議用 Site timezone(或城市的 Fixed timezone),避免 UTC 午夜過早切換。

條件: 整週用 Between + This calendar week;On or after + Today 含今天;After + Today 不含今天。

適用 Table、Repeater、Calendar、Media Gallery、Slideshow,支援 Wix CMS 與外部資料庫。開啟 Add as URL query params 時,相對 Choose value 篩選不會寫入 URL。

Add as URL query params

開啟 Add as URL query params,將搜尋與篩選保存在頁面 URL,方便訪客分享或加入書籤。適用於 Wix CMS 與外部資料庫(Google Sheets、Airtable、Notion)。

Filters display

將 Filters display 設為 Top(內容上方)或 Side(左側邊欄;窄版面會改回上方)。

注意事項

  • 在 Calendar 上,搜尋會查看 Title 與 Details 欄位。
  • 在 Slideshow 上,若已對應,搜尋會使用 Title/Text/Button label 欄位。
  • 你可以篩選顯示元件中未顯示的欄位。
  • 搜尋、排序、Dependent filters 與 Add as URL query params 適用於 Wix CMS 與外部資料庫連線。
  • v6.0 變更了 Table 與 Repeater 搜尋與篩選的儲存方式。重大更新後,請重新檢查既有小工具的篩選設定。
  • Dynamic Page 共用相關格式選項(例如值運算式),但不包含訪客搜尋/篩選。

連接集合後,在各個小工具面板中設定篩選——尋找 Search & filters,包含 Show search bar、Show filters button、Filters display、Add as URL query params,以及每個篩選的 Dependent filter。