使用 Shopify Search & Discovery 新增篩選條件

您可以使用 Shopify Search & Discovery app 為您的網路商店建立篩選條件,讓顧客調整搜尋範圍,決定商品系列頁面與搜尋結果中顯示的商品。例如,販售手錶的商店可以建立品牌名稱、價格、錶面尺寸和防水等級的篩選條件。

需求條件

任何 compatible theme 都可使用篩選條件,使用 filter Liquid APIStorefront API 的自訂線上店面也適用。瞭解how to display filters,適用於您的 compatible theme

如果您的佈景主題不支援篩選條件,您仍可在 Shopify Search & Discovery app 中建立篩選條件,但不會顯示給顧客。

您可以在您的 Shopify 管理介面中的內容 > Menus,判斷您的商店佈景主題是否支援篩選功能。若佈景主題不支援篩選,系統會在商品系列與搜尋篩選條件區塊顯示訊息。

新增篩選條件的注意事項

請留意以下使用 Shopify Search & Discovery app 的注意事項:

  • 包含超過 5,000 件商品的商品系列不會顯示篩選條件。建議將大型商品系列拆分為可以顯示篩選條件的小型商品系列。例如,與其建立單一 Women 時尚商品系列,您可以依服飾類型建立較小的商品系列,例如 TopsJeansBoots
  • 若搜尋結果超過 100,000 筆,則不會顯示篩選條件。
  • 每個篩選條件在您的商店最多可顯示 100 個篩選條件值。若篩選條件的可用值超過 100 個,部分值將不會顯示給顧客。您可以透過 grouping similar values 降低可能的篩選條件值數量。每個篩選群組最多可包含 200 個唯一的篩選條件值,且您的商店在所有已選擇的篩選設定中最多可有 1,000 個篩選群組。
  • 在 Shopify Search & Discovery app 中,每個篩選條件最多可顯示 1,000 個篩選條件值。中繼欄位篩選條件可能顯示少於 1,000 個值,因為系統會限制檢查商店中繼欄位的數量以判定唯一值。即使某些篩選條件值未在 app 中顯示,只要該篩選條件在您的商店上顯示的值少於 100 個,顧客仍可看到這些值。
  • Vendor」與「Tags」的篩選條件值不支援翻譯。產品標籤篩選僅顯示給使用您商店預設語言購物的顧客。Vendor 篩選條件值一律依您商店的預設語言。
  • 篩選條件值的翻譯依您的網路商店已發佈的語言為準,且不會顯示透過 international sales tools 設定的 translations for markets
  • 若使用的幣別不是您的商店預設幣別,則不會顯示價格篩選。

篩選類型

所有商店都能顯示相同的標準篩選條件,您也可以建立專屬於商品目錄的自訂篩選條件。您的商店可同時使用標準與自訂篩選條件,最多可設定 25 個篩選條件。

每個篩選來源在商店中僅能使用一次。例如,若您的商店已啟用 Price 篩選,則 Price 會變成灰色,無法再選為新篩選條件的來源。

標準篩選條件

所有商店都可使用以下標準篩選條件:AvailabilityCategoryPriceProduct typeTagsVendor

自訂篩選條件

自訂篩選條件是根據您商店所使用的商品選項、metafieldsmetaobjects

商品選項篩選條件

商品選項篩選條件是根據您加到商品的商品選項。

例如,若您在服飾商品加入「Size」商品選項,且其值包含「Small」、「Medium」和「Large」,則在 Search & Discovery app 中會提供相對應的「Size」商品選項篩選條件。

商品中繼欄位篩選條件

商品中繼欄位篩選條件是根據指定於商店內所有商品的商品中繼欄位。

類別中繼欄位篩選條件

類別中繼欄位篩選條件是根據指定給特定 product categories 的商品中繼欄位。

子類中繼欄位篩選條件

子類中繼欄位篩選條件是以指派到商店內所有產品子類選項的中繼欄位為基礎。

標準產品屬性

標準產品屬性源自 Shopify 的標準產品分類,當您為商品指派類別時,系統會自動建立對應的商品中繼欄位定義。相關的中繼欄位是 metaobject 參照。相應的 metaobject 定義為標準,因此無法修改(無法新增、移除或編輯欄位)。其中一個欄位包含分類參照值

在 Search & Discovery app 中,這些屬性的來源會顯示為下列其中一種:

中繼欄位篩選條件

所有中繼欄位篩選條件,不論是類別、商品或子類的中繼欄位,皆以中繼欄位定義為基礎。瞭解如何新增中繼欄位定義。您可以針對下列值類型建立中繼欄位篩選條件:

  • 單行文字
  • 單行文字 (清單)
  • 小數
  • 整數
  • 是/否
  • metaobject 參照
  • metaobject 參照 (清單)

在商品或子類上設定好中繼欄位後,您可以在編輯篩選條件時,選取該中繼欄位定義作為篩選條件。

編輯篩選條件

  1. 在 Shopify 管理介面中,前往 Apps > Search & Discovery

  2. 按一下篩選條件,然後按一下新增篩選條件

  3. 按一下來源欄位,然後選取您要提供給顧客的篩選條件來源。

  4. 選用:重新命名篩選條件

  5. 選用:變更篩選條件行為

  6. 選用:變更顯示方式

  7. 選用:選取篩選條件值以合併為單一值

  8. 選用:排序篩選條件值

  9. 按一下儲存

您也可以在篩選條件區段變更篩選條件的順序。按住並拖曳各個篩選條件,排列成您要向顧客顯示的順序。

重新命名篩選條件

您可以變更商店內任何現有篩選條件的顧客端顯示名稱。

變更篩選條件名稱不會變更其來源相關資訊。例如,重新命名以商品選項為基礎的篩選條件,不會變更該選項在各個產品頁面上的名稱。

步驟:

  1. 在 Shopify 管理介面中,前往 Apps > Search & Discovery

  2. 按一下篩選條件,然後按一下您要重新命名的篩選條件。

  3. 篩選條件標籤欄位輸入新標籤。

  4. 按一下儲存

篩選條件值

商店僅會顯示適用於商品系列或搜尋結果內商品的篩選條件值。

篩選條件值會套用不同的排序規則,您也可以使用中繼欄位篩選條件,以更精準地控制排序與顯示的值。

分組篩選條件值

您可以將多個篩選條件值合併,對顧客顯示為單一篩選條件值。例如,某個商品的 Color 選項包含 OnyxEbonyMidnight,您可以將這些值分組為名為 Black 的單一篩選條件。每個篩選群組最多可包含 200 個唯一的篩選條件值,每個商店最多可建立 1,000 個篩選群組。

步驟:

  1. 在 Shopify 管理介面中,前往 Apps > Search & Discovery

  2. 按一下篩選條件,然後按一下新增篩選條件,或按一下現有篩選條件的名稱。

  3. 若該篩選條件是以標準產品屬性為基礎,請按一下管理值並選擇一個選項。深入瞭解分組標準產品屬性篩選條件

  4. 區段中,選取您要分組為單一篩選條件值的各個值。您可以使用搜尋列找出更多篩選條件值。

  5. 按一下建立群組

  6. 輸入群組名稱。這會是顧客看到的單一篩選條件值。

  7. 按一下完成

  8. 按一下儲存

分組標準產品屬性篩選條件

標準產品屬性為基礎的篩選條件提供獨有的分組功能。按一下管理值即可使用,您可以選擇自動手動分組:

  • 自動:系統會依分類的基礎值自動分組。例如,若您的 Color 篩選條件包含 Light redBurgundyRuby,系統會將它們分組到基礎值 Red 之下。您可以自訂群組標籤與色樣,但無法新增或移除值。
  • 手動:初始時不分組,您可以依上述步驟進行分組。

限制

類別篩選條件不支援分組。

排序篩選條件值

您可以依商店需求調整篩選條件值的排序。我們提供兩種排序方式:

自動排序

篩選條件值預設會以字母與數字的遞增順序顯示。例如,Shoe sizes 這類商品選項的篩選條件會由小到大排列。

以數字開頭並以字詞結尾的篩選條件值 (例如 60 watts),會與結尾相同字詞的其他值相鄰顯示。例如,Age 這項商品選項的篩選條件,若其值包含 2 years6 months3 years2 months,排序如下:

  • 2 個月
  • 6 個月
  • 2 年
  • 3 年

對於名稱為 尺寸 的篩選條件,系統會套用自訂排序,讓常見的尺寸術語以正確順序顯示。例如,XS(特小)會排在 S(小)之前。

新的篩選條件值會自動排序。

手動排序

手動排序可讓您自行選擇篩選條件值的顯示順序。儲存手動排序後,任何新的篩選條件值都會顯示在清單末端,直到您更新排序。

步驟:

  1. 在 Shopify 管理介面中,前往 Apps > Search & Discovery

  2. 按一下篩選條件,然後選擇現有篩選條件或 create a new filter

  3. 排序底下,選取手動

  4. 拖曳各個值以重新排列。或者,您也可以選取多個值,按一下移至頂端移至底部,一起調整位置。

  5. 選用:按一下替我重新排序sort with Shopify Magic

  6. 按一下儲存

使用 Shopify Magic 排序

您可以使用 Shopify Magic,依據篩選條件的名稱及其值,以合乎邏輯的順序排序。採用 swatch filters 的篩選條件會考量十六進位色碼及其在色輪上的位置,以決定排序順序。

替我重新排序按鈕會使用 Shopify Magic 為您的值進行排序。若新的順序不符合您的預期,您可以按一下復原重新排序按鈕,還原您手動設定的順序,或重新調整值,以更符合商店需求。

自訂空的篩選條件值

為了協助顧客尋找可供購買的商品,您可以選擇將空的篩選條件值移至清單底部,或完全隱藏。如此一來,顧客能專注於具有相符結果的值。例如,您販售不同顏色與尺寸的 T 恤。除了 紅色 之外的所有顏色皆為無庫存。若您將空值移到清單底部,顏色篩選中會先顯示 紅色。若您隱藏空值,則 顏色篩選中只會顯示 紅色選項。

步驟:

  1. 在 Shopify 管理介面中,前往 Apps > Search & Discovery

  2. 按一下設定

  3. 篩選條件>空值區段中,選取下列其中一個選項:

    • 若要隱藏空的篩選條件值,選取隱藏。如果某個篩選條件的所有值皆為空,該篩選條件會完全隱藏。
    • 若要將空的篩選條件值移至值清單底部,選取顯示在末端
    • 若要依預設排序邏輯保留空的篩選條件值的順序,選取依預設順序顯示
  4. 按一下儲存

排除篩選條件值

若您需要更精確地掌控顯示給顧客的值,您可以使用只包含您想在商店中顯示之值的中繼欄位篩選。

例如,您可能希望將產品標籤用於線上店面篩選條件以外的用途,例如商品系列條件管理介面產品清單篩選。您可以使用單行文字的中繼欄位類型清單類型來取代產品標籤篩選條件類型。

視覺篩選

篩選條件值可以包含視覺元素,例如顏色、圖樣或更細緻的圖像。舉例來說,布料顏色篩選可以為每個值顯示小型色樣。

若要為您的篩選條件值建立視覺呈現,請使用以下任一種以 metaobject 參照為基礎的篩選類型:

新增標準商品屬性的篩選條件

步驟:

  1. 在 Shopify 管理介面中,前往 Apps > Search & Discovery

  2. 按一下篩選條件

  3. 按一下新增篩選條件,或按一下現有的篩選條件。

  4. 按一下來源欄位,然後選取以 standard product attribute 為基礎、類型為「類別中繼欄位」或「商品中繼欄位」的篩選條件。

  5. 按一下管理值

  6. 選擇 Automatic or Manual for grouping

  7. 選取包含色樣。若只需文字,您可以不選此選項。

  8. 若要以圖片作為色樣,選取有圖片時使用圖片

  9. 按一下儲存

新增自訂中繼欄位篩選條件

您可以新增以 metaobject 參照為基礎的 custom metafield filter。在新增自訂中繼欄位篩選條件之前,請先檢閱下列需求與最佳做法:

以自訂中繼欄位為基礎的視覺篩選需求

要為 custom metafield filters 建立視覺呈現,必須符合以下需求:

  • 符合下列條件的 metaobject:
    • 至少包含一個顏色欄位,或一個有圖片的檔案欄位。這兩種欄位都只能支援一個值,不支援值清單。
    • 用來為篩選條件值命名的欄位。此欄位只能允許 一個值,無法以值清單作為篩選名稱。此欄位可為下列任一類型:
      • 單行文字
      • 小數
      • 整數
      • 布林值 (true 或 false)
  • 符合下列條件的中繼欄位定義:
    • 該定義必須用於ProductVariant
    • 中繼欄位的類型為Metaobject,且參照先前步驟建立的 metaobject 定義。
    • 設定中繼欄位是否允許 metaobject 的 單一項目項目清單
  • metaobject 與中繼欄位定義都需要啟用 storefront access

以自訂中繼欄位為基礎的視覺化篩選條件最佳做法

產品子類篩選條件會在搜尋結果與商品系列頁面連結到更相關的子類。例如,當點選紅色的色樣時,只顯示紅色商品。若要使用子類層級篩選,請在 metaobject 參照中使用子類中繼欄位。若您的篩選條件不需要連結到特定子類,則請改用商品中繼欄位。

色樣的 metaobject 定義建議同時包含顏色與圖片欄位。您不必同時提供兩者的值,但這樣做能保留未來使用任一欄位的彈性。

如果您的商品或子類有多種可供篩選的顏色,請將中繼欄位定義設為允許 項目清單。這樣您即可將多個 metaobject 項目指派到同一個品項,每個項目都會在您的商店中顯示為一個篩選條件值。

步驟:

  1. 在 Shopify 管理介面中,前往 Apps > Search & Discovery

  2. 按一下篩選條件

  3. 按一下新增篩選條件,或按一下現有的篩選條件。

  4. 點選 來源 欄位,然後選擇類型為類別、產品中繼欄位或子類中繼欄位的篩選條件。

  5. 標籤 欄位中,選取中繼欄位作為篩選條件值的標籤。

  6. 勾選 包含視覺元素,並選擇視覺樣式:

    • 選擇 色樣 ,適用於小型顏色色樣或圖案。設定色樣內容,請選取:
      • 色樣顏色 選取顏色欄位。
      • 色樣圖案 選取圖片欄位。
    • 若為不應裁切的圖示、標誌或其他圖形,請選擇 圖片。內容可透過為 圖片 選取圖片欄位來設定。

篩選行為

僅顯示可套用至商品系列頁面或搜尋結果中的商品的篩選條件。

從不同篩選條件中選取篩選條件值會採用 條件,可能減少顯示的商品數量。例如,從 顏色 篩選條件選取 紅色,再從 尺寸 篩選條件選取 8,會顯示同時為紅色且尺寸為 8 的商品。

預設情況下,從同一個篩選條件中選取篩選條件值會採用 條件,可能增加結果數量。例如,在 顏色 篩選條件中選取 紅色綠色,會顯示所有紅色或綠色的商品。部分篩選類型也可改用 條件來處理其篩選值。瞭解如何透過 Shopify Search & Discovery app customize filter behavior

顯示的商品數量也取決於篩選條件是屬於商品層級,或子類層級。例如,顧客可能在產品選項篩選條件中選了多個 顏色 值,但仍只顯示一個商品。這是因為產品選項屬於子類層級的篩選條件,所有顏色都屬於同一商品的子類。

自訂篩選行為

針對產品標籤、中繼欄位清單與 metaobject 參照清單篩選條件,您可以選擇值之間採用預設的 條件,或改用 條件。舉例來說,使用 條件時,從產品標籤篩選條件選取 NewSale,只會顯示同時具有這兩個標籤的商品。

步驟:

  1. 在 Shopify 管理介面中,前往 Apps > Search & Discovery

  2. 按一下篩選條件,然後按一下新增篩選條件

  3. 按一下來源欄位,然後選取您要提供給顧客的篩選條件來源。

  4. 邏輯 區段中,選擇要套用至篩選條件值的行為。

  5. 按一下儲存

篩選條件翻譯

您可以將篩選標籤、值與群組翻譯成您商店支援的其他 supported languages。您可以使用翻譯 app 翻譯內容,例如 Shopify Translate & Adapt

若未提供篩選條件的翻譯內容,系統會使用商店的預設語言。

篩選條件值會以您的商品與產品子類的翻譯內容為準。

同一個篩選條件在不同語言中,值的數量可能會不同。例如,您的商店預設語言為英文,並新增法文作為支援語言。您的 顏色 篩選條件包含值 Brown。英文對 brown 的常用字只有一個,而法文常用字有兩個。您的翻譯 app 會在全店商品中自動將 Brown 的篩選值翻譯為 BrunMarron。因此,您的線上店面在英文的 顏色 篩選條件會顯示一個棕色的值,在法文則會顯示兩個棕色的值。

若要讓每個篩選條件值僅保留一種翻譯,您需要使用翻譯 app 編輯商品的翻譯內容。

市場語言

篩選條件值的翻譯不支援在特定市場的 setup for specific markets 中新增同一語言的其他版本。例如,某個網路商店可以提供法文的商品翻譯,並另外為加拿大與法國市場提供兩個法文翻譯。在此情況下,即使顧客在那些特定市場使用法文購物,所有篩選值仍會以一般法文為基準。

篩選標籤與篩選群組支援特定市場的語言翻譯。

篩選條件疑難排解

請參考下列常見篩選問題的解決方法:

多種幣別商店中未顯示價格篩選條件

如果您啟用了 international pricing 或多種幣別,當顧客選擇商店預設幣別以外的任何幣別時,價格篩選條件不會顯示。這是目前價格篩選功能的限制。

排解篩選顯示問題

如果篩選條件存在,但未顯示所有預期的商品或篩選選項,問題可能與您商店的搜尋索引有關。可能發生於:

  • 您最近為商品新增了新的中繼欄位值
  • 商品最近更新了與篩選相關的資訊
  • 您商店的搜尋資料不同步

若要解決索引問題,請嘗試下列步驟:

  1. 等待 24-48 小時,讓系統自動重新索引完成
  2. 對受影響的商品進行小幅更新 (例如在產品名稱中加入一個空格),然後儲存以觸發重新索引
  3. 若問題持續,請聯絡 Shopify 支援服務

產品選項篩選條件顯示非預期的值

產品選項篩選條件會根據您的產品子類選項標題顯示對應的值。如果篩選條件顯示非預期的值或遺漏選項:

  • 請確認所有商品的產品選項名稱完全一致,例如請一律使用「Color」,避免混用「Color」與「Color:」。
  • 請確認使用該篩選條件的商品都已設定該產品選項

篩選條件未顯示

受商品數量上限影響,某些情況下可能不會顯示篩選:

  • 商品系列:若商品系列包含超過 5,000 件商品,系統會隱藏篩選
  • 搜尋結果:若搜尋結果中商品數量超過 100,000 件,系統會隱藏篩選

如果商品系列或搜尋結果超過上述上限,顧客在該頁面將無法使用篩選功能。

篩選條件值缺少或不完整

篩選可顯示的唯一值數量有上限:

  • 產品標籤:最多 5,000 個唯一標籤值
  • 商品選項與屬性:最多 1,000 個唯一值
  • 中繼欄位:部分值可能會遺漏,取決於中繼欄位的結構

若篩選條件值有遺漏,請確認您未超出上述上限。

篩選翻譯問題

如果篩選或篩選條件值在不同語言中顯示不正確:

  • 請確認您的翻譯 app 已翻譯相關內容
  • 請注意,產品標籤與廠商篩選只會以您的商店預設語言顯示
  • 使用中繼欄位篩選,以提升多語言的翻譯支援