使用類別中繼欄位新增顏色色樣

類別中繼欄位會對應 Shopify 標準產品分類 中的特定產品類別。這些欄位在該分類中稱為商品屬性,可協助您為商品新增正確資訊,讓訪客在您的網站、市集及搜尋引擎上更容易找到商品。

例如,若您新增產品類別 Apparel & Accessories > Clothing > Clothing Tops > Shirts,就能新增 clothing sizenecklinesleeve 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 的其他類別中繼欄位包括 sizenecklinesleeve length typetop length typeage groupfabrictarget genderclothing features。類別中繼欄位具有預設項目,您可以直接使用,或為了維持一致的品牌風格而進一步自訂。例如,若 black 不符您的品牌,您可以將名稱更改為 graphite

依您提供的商品資訊與多媒體檔案不同,系統可能會自動填入某個類別。您可以變更為其他類別。

步驟:

電腦版
  1. 在 Shopify 管理介面中,前往 Products

  2. 按一下某個商品。

  3. 類別 區段,選取 Apparel & Accessories > Clothing > Clothing Tops > Shirts,或其他具備顏色類別中繼欄位的 類別

  4. 按一下 儲存

行動裝置
  1. Shopify app 中,點選 Products 圖示 。
  2. 點選某個商品以進行編輯,或搜尋商品。
  3. 類別 區段,點選 選取類別
  4. 選取 Apparel & Accessories > Clothing > Clothing Tops > Shirts,或其他具備顏色商品屬性的 類別
  5. 點選 儲存

步驟 2:新增並編輯類別中繼欄位的項目

新增產品類別後,您可以為商品的子類選項值新增所有需要的項目。

步驟:

電腦版
  1. 在 Shopify 管理介面中,前往 Products

  2. 按一下要編輯或新增類別中繼欄位的商品。

  3. 若要從預設項目新增項目,請完成下列操作:

    1. 類別中繼欄位 區段,按一下該中繼欄位,然後按一下要編輯的項目。
    2. 依需要編輯各欄位。
    3. 按一下 儲存
  4. 若要新增自訂項目,請完成下列操作:

    1. 類別中繼欄位 區段,按一下該中繼欄位,然後按一下 新增項目
    2. 填寫該項目的各欄位。
    3. 按一下 儲存
  5. 按一下 儲存

行動裝置
  1. Shopify app 中,點選 Products 圖示 。

  2. 點選要編輯或新增類別中繼欄位的商品。

  3. 若要從預設項目新增項目,請完成下列操作:

    1. 中繼欄位 區段中,點選 檢視全部
    2. 點選類別中繼欄位。選取其他值。
    3. 點選 儲存
  4. 若要新增自訂項目,請完成下列操作:

    1. 中繼欄位 區段中,點選 檢視全部
    2. 點選類別中繼欄位。
    3. 點選 +
    4. 填寫該項目的各欄位。
    5. 點選 儲存

步驟 3:將您的類別中繼欄位連結到子類選項

在本教學課程中,您將連結顏色的類別中繼欄位。您也可以視需要連結其他類別中繼欄位。

新增子類時,系統會顯示可連結的類別中繼欄位清單,或是您也可以建立自訂選項。

步驟:

電腦版
  1. 在 Shopify 管理介面中,前往 Products

  2. 按一下您要編輯的商品。

  3. 子類 區段,按一下 + 新增類似尺寸或顏色的選項

  4. 若可連結到某個類別中繼欄位,請選取該欄位。系統會依您在該類別中繼欄位中新增的項目,自動填入選項值。您可以再選取更多選項值,或建立新的值。

  5. 選用:若要新增自訂選項值,請按一下 編輯,再按一下 新增新項目。填寫項目欄位後,按一下 儲存

  6. 按一下 儲存 以儲存商品。

行動裝置
  1. Shopify app 中,點選 Products 圖示 。
  2. 點選一項商品。
  3. 如果沒有子類選項,請在 子類 區段點選 + 新增類似尺寸或顏色的選項。如果已有子類選項,請在 選項 區段點選 編輯,再點選 新增選項
  4. 若可連結到某個類別中繼欄位,請點選以選取。系統會依您在該類別中繼欄位中新增的項目,自動填入選項值。您可以點選 新增值,再點選要新增的值,以選取更多選項值或建立新值。
  5. 選用:若要新增自訂選項值,請在 新增值 欄位輸入該選項。點選 + 新增 {option name},填寫項目欄位,然後點選 儲存
  6. 點選 儲存

將您的子類選項移轉到類別中繼欄位

如果您已建立含有子類選項的商品,您可以將這些值移轉到類別中繼欄位,並快速產生多組新的子類組合。若您使用類別中繼欄位建立子類選項,便可在單一位置更新子類選項名稱,且凡是連結到該類別中繼欄位值的地方都會一併更新。

按一下動態來源圖示 ,即可將類別中繼欄位連結到現有選項;

電腦版

步驟:

  1. 在 Shopify 管理介面中,前往 Products

  2. 按一下含有您想移轉至類別中繼欄位的子類選項的商品。

  3. 選用:如果您的商品沒有 類別,請完成下列其中一個步驟:

    • 輸入商品的類別,然後從 商品類別 清單中選取最準確的結果。
    • 逐層按一下各級類別與子分類,找出商品類別。
    • 按一下 建議 以接受建議的類別。
  4. 若要將您的子類選項連結到類別中繼欄位,請完成以下任一作業:

    • 按一下現有選項,按一下動態來源圖示,然後按一下您要連結的類別中繼欄位。
    • 按一下 新增其他選項,然後按一下您要連結的類別中繼欄位。
  5. 按一下 儲存

行動裝置
  1. Shopify app 中,點選 Products 圖示 。
  2. 點選含有您想移轉至類別中繼欄位的子類選項的商品。
  3. 選用:如果您的商品沒有 類別,請完成下列其中一個步驟:
    • 點選 選取類別,輸入商品的類別,然後從 類別 清單中選取最準確的結果。
    • 點選 選取類別,逐層點選各級類別與子分類,找出最準確的商品類別,然後點選該類別以選取。
  4. 選項 區段中,點選 編輯
  5. 若要將您的子類選項連結到類別中繼欄位,請完成以下任一作業:
    • 點選現有選項,點選 沒有已連結的來源,然後點選您要連結的類別中繼欄位。
    • 點選 新增選項,然後點選您要連結的類別中繼欄位。
  6. 系統會顯示一個對話方塊,提示將清除現有的值。點選 繼續
  7. 點選 儲存

步驟 4:自訂網路商店的顏色色樣

接著,您將為網路商店自訂顏色色樣。

可選取色樣選項的示範網路商店

示範 Dawn 的色樣設定

在佈景主題中自訂色樣

如果您有 子類選擇器 區塊,色樣會預設顯示。您可以在該區塊的設定中自訂顯示方式。

步驟:

  1. 在 Shopify 管理介面,前往 網路商店 > 佈景主題

  2. 按一下 編輯佈景主題

  3. 前往您已新增顏色選項的商品。

  4. 選用:若要自訂色樣,請按一下 子類選擇器 區塊。您可以選擇 圓形方形,以變更色樣的顯示方式。

  5. 按一下 儲存 以儲存佈景主題。

現在您可以前往網路商店的產品頁面,系統會針對您的子類選項值顯示顏色色樣。

您也可以透過 Search and Discovery app 將顏色色樣加入商店的篩選條件。瞭解詳情:Search and Discovery app

如果您的商店尚未安裝 Search and Discovery app,則需要先安裝該 app,才能完成這些步驟。瞭解詳情:安裝 app

步驟:

  1. Shopify Search & Discovery app 中,前往 篩選條件,然後按一下 新增篩選條件
  2. 按一下 + 選取來源,然後選取類型為 類別中繼欄位顏色
  3. 選用:重新命名篩選條件
  4. 選用:變更 filter behavior
  5. 選用:按一下 管理值,即可變更視覺呈現。接著您可以選取 包含色樣(會顯示預設顏色)與 有可用圖片時使用(會顯示您為顏色新增的任何圖片)。您也可以不勾選這兩個選項,則搜尋中僅顯示文字。
  6. 選用:選取要 group together as a single value 的篩選條件值。
  7. 選用:Sort filter values
  8. 按一下 儲存

顏色選項 (含色樣)

更新後的 Shopify product taxonomy 包含標準顏色屬性,可讓您在線上店面加入顏色色樣。若要使用這項標準屬性,請選取包含顏色類別中繼欄位的商品類別。以下 category metafields 支援色樣:

  • 背襯顏色
  • 靠背布料顏色
  • 錶帶顏色
  • 毯子顏色
  • 本體顏色
  • 尾塞顏色
  • 顏色
  • 篷頂顏色
  • 錶殼顏色
  • 核心顏色
  • 外蓋顏色
  • 錶盤顏色
  • 門顏色
  • 門墊底色
  • 眼鏡框顏色
  • 眼鏡鏡片顏色
  • 指板顏色
  • 花朵顏色
  • 沖水面板顏色
  • 鞋子顏色
  • 粉底顏色
  • 框架顏色
  • 家具/裝置顏色
  • 把手顏色
  • 外殼顏色
  • 墨水顏色
  • 樂器顏色
  • 樂器弦顏色
  • 彈跳面顏色
  • 雷射光顏色
  • 支腳顏色
  • 鏡片顏色
  • 燈光顏色
  • 琴頸顏色
  • 筆身顏色
  • 桿體顏色
  • 弓把顏色
  • 竿身顏色
  • 坐墊底座顏色
  • 坐墊座面顏色
  • 座椅顏色
  • 座椅布料顏色
  • 桿身顏色
  • 床單顏色
  • 層架顏色
  • 外殼/框架顏色
  • 板條顏色
  • 線軸顏色
  • 線色
  • 吸盤顏色
  • 桌面顏色
  • 水箱顏色
  • 鏡腳顏色
  • 頂部顏色
  • 布面顏色