如何在 WordPress WooCommerce 設定衣服尺寸和顏色 (可變商品)？

有觀眾在我製作的 免費《WordPress 購物網站架設教學》影片底下留言，想知道要怎麼設定商品的尺寸與顏色。

觀眾留言：

如果你偏好用影片學習，歡迎觀看下面的 YouTube 影片。

如果你喜歡透過圖文學習，請繼續往下閱讀吧 ！

圖文版會比較詳細、方便快速瀏覽，還會持續更新與補充內容。

以下是在 WordPress 網站中 (使用 WooCommerce 電商外掛)， 設定衣服尺寸和顏色的詳細步驟！

新增可變商品

第 1 步

在 WordPress 後台，點擊左欄的「商品」

第 2 步

點擊「新增」

第 3 步

輸入商品名稱

第 4 步

點開選單

第 5 步

「簡單商品」改成「可變商品」

新增尺寸

第 6 步

點擊「屬性」

第 7 步

選擇「自訂商品屬性」

第 8 步

點擊「新增」

第 9 步

名稱輸入「尺寸」

第 10 步

在數值輸入尺寸，如： S、M、L，並用「 | 」隔開

第 11 步

勾選「用於變化類型」

第 12 步

點擊「儲存屬性」

新增顏色

第 13 步

點擊「新增」

第 14 步

在名稱輸入「顏色」

第 15 步

在數值輸入顏色，如：白色 (素色)、綠色 (圖案)，並用「 | 」隔開。

第 16 步

勾選「用於變化類型」

第 17 步

點擊「儲存屬性」

設定變化類型 (不同尺寸搭配不同顏色)

第 18 步

連結點擊「變化類型」

第 19 步

點開「新增變化類型」選單

第 20 步

選擇「由所有屬性建立變化類型」

第 21 步

點擊「送出」

第 22 步

點擊「確定」

第 23 步

再點擊「確定」

設定商品圖片與價格

第 24 步

點開想編輯的商品

第 25 步

點「上傳圖片」

第 26 步

選擇要上傳的商品圖片

第 27 步

點擊「設定變化類型圖片」

第 28 步

輸入價格，如 $390

📝 每個變化商品都可以設定不同的圖片跟價格 (每樣都必須手動設定)

第 29 步

商品都設定好了之後，點擊「儲存設定」

設定預設顯示的商品圖片

第 30 步

點開尺寸選單

第 31 步

設定預設尺寸

第 32 步

點開顏色選單

33. 選擇預設顏色

設定好之後，客人點擊商品後，會顯示預設的尺寸、顏色

設定彙整頁面的商品圖片

第 34 步

點擊「設定商品圖片」

第 35 步

上傳商品圖片

第 36 步

點擊「設定商品圖片」

這張圖片會顯示在商品頁面

發佈可變商品

第 37 步

點擊「發佈」

成果展示

第 38 步

點擊「預覽變更」

這是預設商品的樣子。

第 39 步

選取其他商品

這是選擇的商品，價格跟圖片會依照我們的設定做正確的顯示

這樣我們就設定好有不同「尺寸」、「顏色」的商品了！🎉

⭐️ 延伸閱讀