使用類別中繼欄位新增顏色色樣
類別中繼欄位會對應 Shopify 標準產品分類 中的特定產品類別。這些欄位在該分類中稱為商品屬性,可協助您為商品新增正確資訊,讓訪客在您的網站、市集及搜尋引擎上更容易找到商品。
例如,若您新增產品類別 Apparel & Accessories > Clothing > Clothing Tops > Shirts,就能新增 clothing size、neckline、sleeve length type 等類別中繼欄位。根據 Shopify Magic 的預測,部分類別中繼欄位會預設加入;系統也可能提出其他類別中繼欄位的建議,您可選擇將其加入商店。類別中繼欄位具有預設項目,您可以直接使用或進一步自訂。
您可以將類別中繼欄位連結至商品的子類選項,並將各項目對應到選項值。這表示您可以把顏色 black 更名為 graphite,系統會在所有使用該顏色的地方同步更新子類選項值。當您將顏色項目用作子類選項時,您可以在您的線上店面的產品頁面上將顏色選項顯示為色樣。
您可直接在 Shopify 管理介面為商品新增類別中繼欄位。
要完成所有步驟,您需要支援以色樣呈現子類選項的佈景主題。若您使用的是舊版佈景主題,或想新增目前佈景主題不支援的功能,您可以編輯佈景主題程式碼,或聘請 Shopify Partner協助您。
本教學共5 個步驟,將介紹 Shopify 標準產品分類、新增類別中繼欄位、將子類選項連結至類別中繼欄位、自訂網路商店的顏色色樣,以及搭配 Search and Discovery app 將顏色色樣新增為商店的篩選條件。
本頁內容
步驟 1:新增產品類別
產品類別需從 Shopify 標準產品分類中的預先定義類別選取。
Shopify 標準產品分類的用途如下:
- 啟用對應各產品類別的商品屬性(稱為類別中繼欄位)。
- 在 Shopify 中提供更優質的商品管理方式,例如作為商品系列的條件,或協助您篩選產品清單。
- 讓您更容易在需要標準化產品類型的其他管道(例如 Facebook 或 Google)上銷售商品。
- 您使用 Shopify Tax 時,系統會根據產品類別決定商品的稅率。您的商品可能適用特殊稅率或免稅。當商品歸類正確,結帳頁面會收取最精準的稅率。多收或少收銷售稅都可能為您的業務帶來財務或法律責任。
產品類別的範例為 Apparel & Accessories > Clothing > Clothing Tops > Shirts。本教學將沿用此範例。不過,只要類別中繼欄位具備 color 商品屬性,就能新增顏色色樣。
Apparel & Accessories > Clothing > Clothing Tops > Shirts 的其他類別中繼欄位包括 size、neckline、sleeve length type、top length type、age group、fabric、target gender 與 clothing features。類別中繼欄位具有預設項目,您可以直接使用,或為了維持一致的品牌風格而進一步自訂。例如,若 black 不符您的品牌,您可以將名稱更改為 graphite。
依您提供的商品資訊與多媒體檔案不同,系統可能會自動填入某個類別。您可以變更為其他類別。
步驟:
電腦版
在 Shopify 管理介面中,前往 Products。
按一下某個商品。
在 類別 區段,選取
Apparel & Accessories > Clothing > Clothing Tops > Shirts,或其他具備顏色類別中繼欄位的 類別。按一下 儲存。
行動裝置
- 在 Shopify app 中,點選
圖示 。
- 點選某個商品以進行編輯,或搜尋商品。
- 在 類別 區段,點選 選取類別。
- 選取
Apparel & Accessories > Clothing > Clothing Tops > Shirts,或其他具備顏色商品屬性的 類別。 - 點選 儲存 或 ✓。
步驟 2:新增並編輯類別中繼欄位的項目
新增產品類別後,您可以為商品的子類選項值新增所有需要的項目。
步驟:
電腦版
在 Shopify 管理介面中,前往 Products。
按一下要編輯或新增類別中繼欄位的商品。
若要從預設項目新增項目,請完成下列操作:
- 在 類別中繼欄位 區段,按一下該中繼欄位,然後按一下要編輯的項目。
- 依需要編輯各欄位。
- 按一下 儲存。
若要新增自訂項目,請完成下列操作:
- 在 類別中繼欄位 區段,按一下該中繼欄位,然後按一下 新增項目
- 填寫該項目的各欄位。
- 按一下 儲存。
按一下 儲存。
行動裝置
在 Shopify app 中,點選
圖示 。
點選要編輯或新增類別中繼欄位的商品。
若要從預設項目新增項目,請完成下列操作:
- 在 中繼欄位 區段中,點選 檢視全部。
- 點選類別中繼欄位。選取其他值。
- 點選 儲存 或 ✓。
若要新增自訂項目,請完成下列操作:
- 在 中繼欄位 區段中,點選 檢視全部。
- 點選類別中繼欄位。
- 點選 +。
- 填寫該項目的各欄位。
- 點選 儲存 或 ✓。
步驟 3:將您的類別中繼欄位連結到子類選項
在本教學課程中,您將連結顏色的類別中繼欄位。您也可以視需要連結其他類別中繼欄位。
新增子類時,系統會顯示可連結的類別中繼欄位清單,或是您也可以建立自訂選項。
步驟:
電腦版
在 Shopify 管理介面中,前往 Products。
按一下您要編輯的商品。
在 子類 區段,按一下 + 新增類似尺寸或顏色的選項。
若可連結到某個類別中繼欄位,請選取該欄位。系統會依您在該類別中繼欄位中新增的項目,自動填入選項值。您可以再選取更多選項值,或建立新的值。
選用:若要新增自訂選項值,請按一下 編輯,再按一下 新增新項目。填寫項目欄位後,按一下 儲存。
按一下 儲存 以儲存商品。
行動裝置
- 在 Shopify app 中,點選
圖示 。
- 點選一項商品。
- 如果沒有子類選項,請在 子類 區段點選 + 新增類似尺寸或顏色的選項。如果已有子類選項,請在 選項 區段點選 編輯,再點選 新增選項。
- 若可連結到某個類別中繼欄位,請點選以選取。系統會依您在該類別中繼欄位中新增的項目,自動填入選項值。您可以點選 新增值,再點選要新增的值,以選取更多選項值或建立新值。
- 選用:若要新增自訂選項值,請在 新增值 欄位輸入該選項。點選 + 新增 {option name},填寫項目欄位,然後點選 儲存 或 ✓。
- 點選 儲存 或 ✓。
將您的子類選項移轉到類別中繼欄位
如果您已建立含有子類選項的商品,您可以將這些值移轉到類別中繼欄位,並快速產生多組新的子類組合。若您使用類別中繼欄位建立子類選項,便可在單一位置更新子類選項名稱,且凡是連結到該類別中繼欄位值的地方都會一併更新。
按一下動態來源圖示 ⛁,即可將類別中繼欄位連結到現有選項;
電腦版
步驟:
在 Shopify 管理介面中,前往 Products。
按一下含有您想移轉至類別中繼欄位的子類選項的商品。
選用:如果您的商品沒有 類別,請完成下列其中一個步驟:
- 輸入商品的類別,然後從 商品類別 清單中選取最準確的結果。
- 逐層按一下各級類別與子分類,找出商品類別。
- 按一下 建議 以接受建議的類別。
若要將您的子類選項連結到類別中繼欄位,請完成以下任一作業:
- 按一下現有選項,按一下動態來源圖示,然後按一下您要連結的類別中繼欄位。
- 按一下 新增其他選項,然後按一下您要連結的類別中繼欄位。
按一下 儲存。
行動裝置
- 在 Shopify app 中,點選
圖示 。
- 點選含有您想移轉至類別中繼欄位的子類選項的商品。
- 選用:如果您的商品沒有 類別,請完成下列其中一個步驟:
- 點選 選取類別,輸入商品的類別,然後從 類別 清單中選取最準確的結果。
- 點選 選取類別,逐層點選各級類別與子分類,找出最準確的商品類別,然後點選該類別以選取。
- 在 選項 區段中,點選 編輯。
- 若要將您的子類選項連結到類別中繼欄位,請完成以下任一作業:
- 點選現有選項,點選 沒有已連結的來源,然後點選您要連結的類別中繼欄位。
- 點選 新增選項,然後點選您要連結的類別中繼欄位。
- 系統會顯示一個對話方塊,提示將清除現有的值。點選 繼續。
- 點選 儲存 或 ✓。
步驟 4:自訂網路商店的顏色色樣
接著,您將為網路商店自訂顏色色樣。


在佈景主題中自訂色樣
如果您有 子類選擇器 區塊,色樣會預設顯示。您可以在該區塊的設定中自訂顯示方式。
步驟:
在 Shopify 管理介面,前往 網路商店 > 佈景主題。
按一下 編輯佈景主題。
前往您已新增顏色選項的商品。
選用:若要自訂色樣,請按一下 子類選擇器 區塊。您可以選擇 圓形、方形 或 無,以變更色樣的顯示方式。
按一下 儲存 以儲存佈景主題。
現在您可以前往網路商店的產品頁面,系統會針對您的子類選項值顯示顏色色樣。
步驟 5:將顏色色樣新增為商店搜尋的篩選條件
您也可以透過 Search and Discovery app 將顏色色樣加入商店的篩選條件。瞭解詳情:Search and Discovery app。
如果您的商店尚未安裝 Search and Discovery app,則需要先安裝該 app,才能完成這些步驟。瞭解詳情:安裝 app。
步驟:
- 在 Shopify Search & Discovery app 中,前往 篩選條件,然後按一下 新增篩選條件。
- 按一下 + 選取來源,然後選取類型為 類別中繼欄位 的 顏色。
- 選用:重新命名篩選條件。
- 選用:變更 filter behavior。
- 選用:按一下 管理值,即可變更視覺呈現。接著您可以選取 包含色樣(會顯示預設顏色)與 有可用圖片時使用(會顯示您為顏色新增的任何圖片)。您也可以不勾選這兩個選項,則搜尋中僅顯示文字。
- 選用:選取要 group together as a single value 的篩選條件值。
- 選用:Sort filter values。
- 按一下 儲存。
顏色選項 (含色樣)
更新後的 Shopify product taxonomy 包含標準顏色屬性,可讓您在線上店面加入顏色色樣。若要使用這項標準屬性,請選取包含顏色類別中繼欄位的商品類別。以下 category metafields 支援色樣:
背襯顏色靠背布料顏色錶帶顏色毯子顏色本體顏色尾塞顏色顏色篷頂顏色錶殼顏色核心顏色外蓋顏色錶盤顏色門顏色門墊底色眼鏡框顏色眼鏡鏡片顏色指板顏色花朵顏色沖水面板顏色鞋子顏色粉底顏色框架顏色家具/裝置顏色把手顏色外殼顏色墨水顏色樂器顏色樂器弦顏色彈跳面顏色雷射光顏色支腳顏色鏡片顏色燈光顏色琴頸顏色筆身顏色桿體顏色弓把顏色竿身顏色坐墊底座顏色坐墊座面顏色座椅顏色座椅布料顏色桿身顏色床單顏色層架顏色外殼/框架顏色板條顏色線軸顏色線色吸盤顏色桌面顏色水箱顏色鏡腳顏色頂部顏色布面顏色