Produkt-Variationen in WooCommerce

Ausgangslage

WooCommerce ist die beliebteste Online-Shop-Lösung für WordPress. Die Software wird kontinuierlich weiterentwickelt und es gibt zahlreiche Erweiterungen. Es ist eines der aufwändigsten WordPress Plugins und in der Gratis-Version auf Platz 2 der Top Downloads aus dem offiziellen WordPress Plugin Verzeichnis. Wir sind begeistert von seinem Umfang und setzen immer wieder Online-Shops damit um.

Ein tolles Feature sind die verschiedenen Produkttypen. Neben simplen Produkten mit Preis und anderen Eigenschaften gibt es weitere Produkttypen, nämlich gruppierte Produkte, externe Produkte und variable Produkte. In diesem Post geht es um das variable Produkt, ein sehr praktisches Feature von WooCommerce. Angenommen du verkaufst ein T-Shirt in verschiedenen Farben und Grössen. Das ist ein Paradebeispiel für ein variables Produkt. Das Grundprodukt ist das T-Shirt, welches als einzelnes Produkt in WooCommerce erfasst wird. Die einzelnen Ausprägungen, zum Beispiel die hellblaue Variante in XL, sind Variationen davon.

Produkt-Variationen erstellen

Variables Produkt erstellen: Erstelle ein neues Produkt in WooCommerce.
Auf der Seite zur Bearbeitung findest du einen Abschnitt mit dem Titel Produktdaten. Dort kannst du über das Dropdown den Produkttyp auf Variables Produkt setzen.

WooCommerce Anleitung: Wie man variable Produkte und Produktvarianten hinzufügt. Der erste Schritt zeigt das Dropdown Produktdaten mit den Optionen Einfaches Produkt und Variables Produkt | WebKinder WordPress und WooCommerce Digitalagentur mit Sitz in Luzern, tätig gesamtschweizerisch auch in Zürich, Basel und Bern.
Je nach Anzahl der installierten Plugins wird diese Ansicht zuunterst aufgeführt. Bei uns zum Beispiel unter Yoast SEO, also einfach scrollen bis gefunden.

Attribute und Werte erfassen: Im Dashboard-Menü gibt es unter Alle Produkte den Menüpunkt Eigenschaften. Dort kannst du sämtliche Produkteigenschaften verwalten. Diese Seite funktioniert sehr ähnlich wie die entsprechende Seite für Kategorien von Posts. Eigenschaften können hier erstellt, bearbeitet oder gelöscht werden. Für jede Eigenschaft werden alle möglichen Werte erfasst. Zum Beispiel wäre Farbe eine Eigenschaft und ihre Werte dann entsprechend Schwarz, Grün, Blau und so weiter. Aber an dieser Stelle legst du lediglich fest, welche Werte ganz allgemein erlaubt sind. Nicht jedes Produkt mit dem Attribut Farbe muss sämtliche Werte erlauben, aber hier müssen alle Möglichkeiten definiert werden. Welche auf welchem Produkt effektiv Anwendung finden, klärst du in den nächsten Schritten.

WooCommerce Anleitung für variable Produkte in WooCommerce: Im WordPress Dashboard den Menüpunkt Eigenschaften auswählen um bestehende Eigenschaften wie Farbe und Grösse zu bearbeiten oder neue Eigenschaften hinzuzufügen | WebKinder WordPress, WooCommere und SEO Webagentur aus Luzern, mit Kunden aus Zürich, Basel und Bern.

Attribute und Werte dem Produkt zuordnen: Zurück auf der Seite zur Bearbeitung deines Produkts, gehe wiederum zum Abschnitt Produktdaten. Unter Eigenschaften werden die Eigenschaften für dieses spezifische Produkt verwaltet. Wenn du das Produkt neu erstellt hast, sollten noch keine Attribute vorhanden sein. Im Dropdown findest du jetzt sämtliche Attribute, die du im zweiten Schritt erfasst hast. Eine Auswahl von diesen kannst du jetzt dem Produkt zuordnen. Für jedes Attribut musst du zusätzlich die erlaubten Werte festlegen. Falls du alle verfügbaren auswählen willst, kannst du diese einfach über Alle auswählen hinzufügen. Achtung: Für jedes Attribut musst du den Haken Für Varianten verwendet setzen, damit es tatsächlich für Variationen verwendet wird. Parallel kannst du auch Attribute definieren, die für alle Variationen gleich sind. Bei diesen setzt du den entsprechenden Haken dann einfach nicht.

WooCommerce How-To Variable Produkte und Produktvarienten dritter Schritt: Via Dropdown können die benutzerdefinierten Produkteigenschaften wie Farbe und Grösse nun dem Produkt hinzugefügt und die entsprechenden Werte ausgewählt werden. Ein roter Pfeil zeigt hier auf die Option Für Varianten verwendet | WebKinder WordPress und WooCommerce Digitalagentur aus Luzern, tätig für Kunden schweizweit in Zürich, Bern und Basel.

Variationen aus Kombinationen generieren: Jetzt hast du ein Produkt mit verschiedenen Attributen und entsprechenden Werten. Wenn du mehr als ein Attribut hast, gibt es nun allerlei mögliche Kombinationen. In diesem Schritt legst du fest, welche Kombinationen erlaubt sind, also effektiv wählbar sein sollen. Am selben Ort, wo die Attribute gewählt werden können, gibt es den Menüpunkt Varianten.

WooCommerce Anleitung für Variable Produkte und Produktvarianten: Via Menüpunkt Varianten wird mit dem Dropdown Variante hinzufügen eine einzelne Variante oder "Alle Variationen aus Attribut-Kombinationen erstellen" dem Produkt hinzugefügt | WebKinder Digitalagentur Luzern für WordPress, WooCommerce und Webapplikationen für Zürich, Bern, Basel und Luzern.

Zum Erstellen der Kombinationen gibt es hier zwei Vorgehen. Alle Variationen aus Attribut-Kombinationen erstellen generiert alle möglichen Kombinationen aller erfassten Werte für Attribute. WooCommerce beschränkt das Hinzufügen allerdings auf 50 Variationen auf einmal. Hat man mehr Kombinationen, muss dieser Schritt wiederholt werden, bis alle erfasst sind. Das andere Vorgehen ist das manuelle Hinzufügen einer Variation, bei der die Werte für alle Attribute von Hand gewählt werden.

Prdutkvariationen und variable Produkte in WooCommerce: Unter den Produktvarianten können die Standartwerte gesetzt, vorhandene Varianten bearbeitet und neue Varianten hinzugefügt werden. Hier wurde eine Kombination aus zwei Farben und drei Grössen festgelegt | WebKinder Webagentur für WordPress, WooCommerce und Webapplikationen aus Luzern, für Kunden aus der ganzen Deutschschweiz.
Hier wurden beispielsweise alle Produktvariationen aus den Attribut-Kombinationen erstellt. Da oben zwei Farben und drei grössen festgelegt wurden, haben wir hier ein Total von sechs Kombinationen. Mit einem Klick in die jeweiligen Varianten können die Produktdetails wie der Preis, die Verfügbarkeit, etc. bearbeitet werden.

Fazit

Nun hast du ein Produkt, das in deinem Online Shop in verschiedenen Ausführungen verfügbar ist. WooCommerce generiert jetzt automatisch die entsprechenden Dropdown-Menüs auf der Produktseite, so dass dein Kunde seine Variation wählen kann. Einzelne Variationen können weiter verfeinert werden, zum Beispiel kann der Preis eines Kleidungsstücks abhängig vom Material oder Grösse gemacht werden. So kann man mit einfachen Mitteln eine tolle Konfigurationsoberfläche für relativ komplexe Produkte generieren. Willst du mehr Infos zu WooCommerce und unseren Leistungen, dann schau doch mal auf unserer WooCommerce Seite vorbei.

Enrik Berisha

Ich schreibe meistens über Dinge, die mich begeistern oder eben nicht. Per Mail erreichst du mich über diese Adresse. Mehr zu uns findest du auf der Agentur-Seite.