如何創建 WooCommerce 產品變體

已發表: 2022-06-08

想了解WooCommerce 產品變化嗎?

在這個完整的指南中,您可以輕鬆了解什麼是WooCommerce 產品變體以及如何創建具有所需變體的可變產品。 並且,不要忘記使用 Variations Swatches 的風格產品變化。

但在深入解釋之前,您應該了解什麼是 WooCommerce 可變產品和變體。

內容隱藏
1什麼是 WooCommerce 可變產品?
2 WooCommerce 產品屬性是什麼?
3 WooCommerce 產品變化是什麼?
4如何設置具有多種變體的 WooCommerce 變量產品
4.1創建和配置產品屬性
5創建變量產品
5.1使屬性可用於變體
5.2從所有屬性創建變體
5.3配置變化
6如何設置不同價格的 WooCommerce 產品
7如何設計 WooCommerce 產品變體
8結論

什麼是 WooCommerce 可變產品?

WooCommerce 可變產品是指店主可以為產品添加多個屬性的產品。 您可以將多種變體添加到特定產品中。 尺寸和顏色是您可以添加到所需產品中最常用的變體。 不僅如此,所有變量都可以有它們的產品圖片、價格和庫存。

什麼是 WooCommerce 產品屬性?

產品屬性是指我們可以配置 WooCommerce 變量產品的術語。 產品屬性包括尺寸、顏色和圖像。 對於這些屬性,我們可以設置多個值。 例如,尺寸屬性的值將是小、中和大。

什麼是 WooCommerce 產品變體?

WooCommerce 變量產品可能具有多個產品屬性。 因此,如果我們將兩個或多個屬性一起用於單個產品,則稱為產品變體。 例如,我們銷售的一件 T 卹可能有多種顏色和尺寸。 所以我們必須對這些屬性進行變化,讓購物者選擇他們想要的 T 卹尺寸和顏色。

如何設置具有多種變體的 WooCommerce 變量產品

現在,您了解了有關 WooCommerce 可變產品的所有基本信息,是時候指導您從頭開始創建可用產品了。 請按照以下步驟進行操作:

創建和配置產品屬性

創建或可變產品的第一個也是最重要的方面是創建產品屬性。 創建屬性有兩種方法,我們可以創建全局屬性或產品級屬性。

全局屬性將適用於所有產品。 另一方面,產品級別屬性是針對特定產品的。 這意味著如果您創建從產品級別創建的屬性,則僅可用於該產品。

我將解釋這兩種方式,以便您可以按照自己想要的方式來決定和創建。

創建全局屬性:要創建全局屬性,您可以按照以下步驟操作:

  • 單擊“產品”部分的“屬性”選項卡
  • 鍵入屬性的名稱
  • 輸入蛞蝓的名稱(可選)
  • 單擊啟用存檔的複選框(可選)
  • 點擊保存按鈕
Create Global Attribute
創建全局屬性

創建全局屬性後,您必須使用值對其進行配置。 例如,如果您創建一個尺寸屬性,您還需要添加可用尺寸,對嗎?

要配置屬性,請按照以下步驟操作:

  • 點擊配置按鈕
  • 添加所需的值名稱
  • 添加 slug 名稱和描述(可選)
  • 點擊添加新按鈕
configure attribute
配置屬性

這就是您想要創建的所有價值都將在右側可用。 同樣,您可以添加所有所需的屬性值。

創建產品級別屬性:現在是討論產品級別屬性創建的時候了。 您可以在創建可變產品時創建它們。 就是這樣:

  • 單擊“屬性”選項卡
  • 選擇自定義屬性並單擊“添加”按鈕
  • 鍵入屬性的名稱
  • 添加屬性值
  • 使其可用於產品頁面和變體

就是這樣,現在您可以創建具有所需變化的可變產品。

創建變量產品

現在,您已經學習了創建屬性和組合的兩種方法。 是時候創建可變產品了。 如果您是第一次這樣做,該過程可能會令人困惑。 不用擔心,只需按照以下步驟操作,您就可以輕鬆創建可變產品。

使屬性可用於變體

正如我所提到的,您必須使屬性可用於變體,如果您想在產品級別創建屬性,則可以跳過此步驟。 但是全局屬性的情況有點不同。

要使全局屬性可用於變體,您可以按照以下步驟操作:

  • 在創建可變產品時單擊屬性
  • 從下拉列表中選擇所需的全局屬性
  • 選擇所需的值或單擊“全選”按鈕
  • 使其可用於產品頁面和變體
Make Attributes Available for Variations
使屬性可用於變體

從所有屬性創建變體

在為變體提供所需的屬性之後,是時候創建具有所有屬性的變體了。 為了那個原因:

  • 單擊變體選項卡
  • 從下拉列表中選擇從所有屬性創建變體的選項
  • 點擊前往按鈕
Create variations from all attributes
從所有屬性創建變體

現在,WooCommerce 將使用組合創建所有可能的變化。 稍後,您使用所需的價格、圖像和庫存配置它們。

注意:不同的變體可能有不同的圖像、價格和庫存。 但是,您為所有可用的變體添加相同的價格。

配置變體

在配置變體時,您必須擴展所有變體選項並添加所需的值。 但是,正如我之前提到的,您可以為所有變體添加相同的價格。 為了那個原因:

  • 做出變化後再次點擊下拉菜單
  • 選擇“設置常規價格”選項
  • 點擊前往按鈕
  • 添加所需的價格
  • 點擊確定按鈕
Set Regular Prices
設置正常價格

現在所有的變化都將具有相同的價格。 正確配置變量產品後,單擊保存更改按鈕並發布帖子。 現在,您可以查看產品頁面的前端。

如何設置不同價格的 WooCommerce 產品

正如我所提到的,您還可以為每個變體設置不同的價格、圖像和庫存,您可以這樣做:

  • 轉到變體選項卡
  • 展開所有變體
  • 添加所需的價格、圖像和庫存
  • 點擊保存更改
  • 發布或更新產品

就是這樣,您的產品變體現在以不同的價格提供。 因此,當購物者選擇他們想要的產品變體時,他們將看到該變體的確切價格。

如何設計 WooCommerce 產品變化的樣式

WooCommerce 變量產品的默認呈現方式很好,但不是最好的。 您會驚訝地發現,前 100 萬個電子商務網站中有 22% 是使用 WooCommerce 製作的。 但這並不意味著默認的 WooCommerce 足以讓他們製作一個美觀且注重轉換的網站。

他們需要聘請開發人員或購買高級主題和插件,以使他們的 WooCommerce 具有視覺吸引力和以轉換為重點。

那麼,您為什麼不嘗試通過使用 WooCommerce 的配套插件來使您的網站更具吸引力呢?

您可能正在考慮應該選擇哪個插件。 嗯,WordPress 中有許多插件可以擴展 WooCommerce 的現有功能。 但是,建議選擇一個多合一的插件,而不是多個插件和針對不同功能的插件。 因為根本不建議在 WordPress 網站上使用多個插件。

它可能會使您的網站變得比以前慢,從而破壞您的網站。

ProductX Gutenberg WooCommerce 插件是 WooCommerce 的最佳伴侶之一。 它帶有產品塊、入門包(預製模板)、基本功能和插件。

Variation Swatches 是 ProductX 的最佳插件之一。 通過它您可以使產品變化在視覺上吸引人。

以下是使用變體樣本插件對產品變體進行樣式設置的可用方法。

將下拉菜單轉換為色板:首先,您將默認的 WooCommerce 變體樣式轉換為漂亮的色板。 如您所知,WooCommerce 的默認產品變體帶有下拉選擇選項。 選項可能是顏色和尺寸的名稱。 但是使用插件,您可以將它們轉換為所需的顏色和標籤,而不是顏色和尺寸的名稱。

Convert Dropdowns to Swatches
將下拉列表轉換為色板

創建色板:一旦開始使用 ProductX 的色板插件,您可以在創建和配置全局屬性時獲得更多選項。 它允許您選擇所需的顏色作為顏色屬性的值。 這樣,顏色將代替顏色名稱顯示。

Color Swatches
色板

創建標籤色板:您還可以在創建和配置尺寸屬性時顯示標籤而不是尺寸名稱。 例如,當您將 size 屬性添加為 Medium 時,您還將獲得一個選項來添加標籤為 M 或任何您想要的。

Labels
標籤色板

創建圖像樣本:您會驚訝地發現,您還可以將產品圖像顯示為產品的變體。 為此,您只需要將圖像設置為顏色屬性類型的類型。 然後您將能夠為所需的圖像分配顏色名稱。

Image Swatches
圖像色板

了解更多:WooCommerce 變化樣本

結論

這就是關於WooCommerce 產品變體以及如何設計它們的全部內容。 現在可以開始創建可變產品並使用變體樣本對其進行樣式設置。 如果您遇到任何困難,請隨時在下面發表評論。

喜歡這篇文章嗎? 傳播這個詞
  • WordPress Menu Customization in 2022 WordPress Theme

    WordPress 菜單自定義二十二十二主題

  • How to Convert Gutenberg Blocks into Shortcode 1

    如何將 Gutenberg 塊轉換為簡碼

  • Security Update: WPXPO Products

    PostX 和 ProductX 的重要安全更新

  • WordPress Gutenberg Tutorial

    最佳 WordPress Gutenberg 教程 2021 [初學者指南]