如何在 WordPress WooCommerce 設定衣服尺寸和顏色 (可變商品)?
有觀眾在我製作的 免費《WordPress 購物網站架設教學》影片底下留言,想知道要怎麼設定商品的尺寸與顏色。
觀眾留言:

如果你偏好用影片學習,歡迎觀看下面的 YouTube 影片。
如果你喜歡透過圖文學習,請繼續往下閱讀吧 !
圖文版會比較詳細、方便快速瀏覽,還會持續更新與補充內容。
以下是在 WordPress 網站中 (使用 WooCommerce 電商外掛), 設定衣服尺寸和顏色的詳細步驟!
新增可變商品
第 1 步
在 WordPress 後台,點擊左欄的「商品」

第 2 步
點擊「新增」

第 3 步
輸入商品名稱

第 4 步
點開選單

第 5 步
「簡單商品」改成「可變商品」

新增尺寸
第 6 步
點擊「屬性」

第 7 步
選擇「自訂商品屬性」

第 8 步
點擊「新增」

第 9 步
名稱輸入「尺寸」

第 10 步
在數值輸入尺寸,如: S、M、L,並用「 | 」隔開
直接複製 👇
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 步
選取其他商品

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

這樣我們就設定好有不同「尺寸」、「顏色」的商品了!🎉
⭐️ 延伸閱讀