Custom Products

Bei Custom Products für Shopware 6 handelt es sich um eine Erweiterung, das Bestandteil ab dem Plan Shopware Rise ist.

Es bietet Dir die Möglichkeit, Deinen Kunden individualisierbare Produkte anzubieten. Dies ist vor allem für Artikel hilfreich, bei denen die einfache Aufteilung in Varianten nicht ausreicht und eine weitere Individualisierung gewünscht ist. Dies können beispielsweise Artikel sein, bei denen ein individueller Schriftzug, eine spezielle Farbe oder eine bestimmte Datums/Zeit - Angabe verwendet werden soll.

Im Plugin Custom Products legst Du Produktvorlagen mit auswählbaren Optionen an. Diese Vorlagen verknüpfst Du in einem zweiten Schritt dann mit bereits vorhandenen Artikeln. Die auswählbaren Optionen aus der Produktvorlage werden auf der Artikeldetailseite dann angezeigt, sodass der Kunde das Produkt entsprechend individualisieren kann.

Optional kannst Du den einzelnen Optionen frei definierbare Aufschläge hinzufügen.

Installation

Wenn für die Shopdomain mindestens der Rise Plan im Shopware-Account hinterlegt ist, kannst Du das Plugin in der Pluginverwaltung unter Einstellungen > System > Plugins > Einkäufe herunterladen.
Anschließend wird das Plugin unter Meine Plugins aufgelistet und kann über den "..."-Button installiert werden.
Nachdem das Plugin installiert wurde, kannst Du es über den Schalter in der Spalte Status aktivieren.

Das installierte Plugin findest Du in der Shopware Administration unter Kataloge > Custom Products.

Produktvorlagen

Unter Kataloge > Custom Products findest Du die Übersicht der Produktvorlagen. 
 

Hier siehst Du alle bereits angelegten Vorlagen, welche Du Deinen Produkten zuordnen kannst. Jede Vorlage hat dabei einen internen Namen, einen Anzeigenamen und eine Beschreibung. Außerdem wird Dir in der Übersicht angezeigt, wie viele Optionen jede Vorlage besitzt. 
Eine bestehende Vorlage kannst Du über das "..."-Menü auf der rechten Seite Bearbeiten, Duplizieren und Löschen. 
 

Vorlage hinzufügen

Über den Button Vorlage hinzufügen erstellst Du eine neue Vorlage. Hier gibst Du dann zunächst einige Allgemeine Konfigurationen an. 
 

Technischer Name (1): Dieser wird nur intern in der Vorlagen Übersicht angezeigt. Das ist beispielsweise dann sinnvoll, wenn es mehrere Produktvorlagen gibt, die im Frontend gleich heißen sollen. 

Aktiv (2): Mit diesem Schalter lässt sich die Produktvorlage deaktivieren. Die Artikel, in denen diese Vorlage verwendet werden, sind weiterhin verfügbar, können aber nicht mit dieser Vorlage individualisiert werden. 

Anzeigename (3): Dieser Name wird im Frontend auf der Artikeldetailseite verwendet. 

Beschreibung (4): Mit dieser Beschreibung kannst Du auf der Artikeldetailseite für den Kunden zusammenfassen, um welche individuellen Einstellungen man den jeweiligen Artikel erweitern kann.  

Bild (5): Zusätzlich kannst Du optional ein Bild für die Artikeldetailseite hochladen oder aus der Medienverwaltung auswählen. 

Schritt für Schritt Modus (6): Mit dem Schritt für Schritt Modus wird der Kunde im Frontend Schritt für Schritt durch die Optionen geführt, anstatt alle gleichzeitig angezeigt zu bekommen.

Selbst-einklappende Optionen (7): Diese Funktion klappt Optionen wieder ein, sobald vom Kunden eine valide Eingabe vorgenommen wurde. (Steht im Schritt-für-Schritt-Modus nicht zur Verfügung)
 

Optionen

Nachdem Du eine neue Vorlage angelegt und über Speichern abgespeichert hast, steht dir der Bereich Optionen zur Verfügung.
 

In diesem Bereich werden Dir die Optionen angezeigt, die der aktuellen Vorlage hinterlegt sind. Außerdem kannst Du hier auch neue Optionen zur Individualisierung hinzufügen. 
 

Hier gibst Du zunächst einen Namen für die Option an und einen Optionstyp. Es stehen dir folgende Optionstypen zur Verfügung: 
 

Auswahlfeld

In diesem Optionstyp kannst Du dem Kunden eine oder mehrere Auswahlmöglichkeiten anbieten, die dann in einem Fenster zur Verfügung gestellt und per Mausklick selektiert werden können. Dies können beispielsweise individuelle Optionen sein, die dem Produkt hinzugefügt werden können. 
 

In den Einstellungen der Option wählst Du zunächst einen Namen (1), dieser wird in der Storefront und in den Bestell-Dokumenten ausgegeben.
Wenn Du einen Haken bei Pflichtfeld (2) setzt, muss der Kunde im Frontend eine Auswahl treffen, um den Artikel in den Warenkorb legen zu können. Die Möglichkeit Keine Auswahl wird ihm im Frontend dann nicht mehr angezeigt.
Zusätzlich kannst Du optional eine Beschreibung (3) hinterlegen, um den Kunden weitere Informationen zu dieser Option zu bieten.
 
Als nächstes kannst Du angeben, dass die Auswahlmöglichkeiten als Dropdownmenü (4) angezeigt werden sollen und ob eine Mehrfachauswahl (5) möglich sein soll. Im Dropdown Menü ist eine Mehrfachauswahl allerdings nicht möglich.

Optional kannst Du einen Zuschlag hinzufügen, den der Kunde zu zahlen hat, wenn er die Option auswählt.
Weitere Informationen hierzu erhältst Du im Abschnitt Optionsabhängige Zuschläge definieren.

Auf der linken Seite der Optionseinstellungen siehst Du die angelegten Elemente, welche der Kunde auswählen kann. Über den Button Element erstellen (6) kannst Du weitere Elemente hinzufügen. Wenn Du auf eines der Elemente (4) klickst, hast Du die Möglichkeit, weitere Einstellungen zu dem Element zu treffen. 
 

Neben Namen und einer Bestellnummer kannst Du hier, genau wie in den Optionseinstellungen, einen eigenen Zuschlag definieren. Der Zuschlag eines Elements wird zusätzlich zum ggfs. hinterlegten Zuschlag der Option berechnet.

Anzeige im Frontend: 

Handelt es sich um eine Pflichtoption, steht das Element Keine Auswahl nicht zur Verfügung. 

Anzeige im Frontend als Drop-Down-Menü: 
 

Handelt es sich um eine Pflichtoption, steht das Element Keine Auswahl nicht zur Verfügung.
 

Bild-Upload

Der Bild-Upload bietet die Möglichkeit, dass Deine Kunden eigene Bilder hochladen können, um diese z.B. zur Individualisierung des Produkts nutzen zu können.
 

Zunächst vergib einen Namen (1) für die Option. Der Name wird u.A. in der Storefront und auf den Dokumenten zur Bestellung ausgegeben. Die Checkbox Pflichtfeld (2) ermöglicht es Dir festzulegen, ob der Kunde zwingend eine Eingabe vornehmen muss.
Über die optionale Beschreibung (3) kannst Du Deinen Kunden weitere Informationen zu der Option geben.
Zusätzlich kannst Du eine Bestellnummer (4) für die Option angeben, die dann auf den Dokumenten ausgegeben wird.
Für die Konfiguration der Option sind die Angabe Maximale Dateianzahl (5) und Maximale Dateigröße (6) erforderlich.

Weitere Informationen zu den möglichen Zuschlägen für die Option findest Du im Abschnitt Optionsabhängige Zuschläge definieren.

Im Frontend:
 

Als Dateitypen können jpg, png und gif verwendet werden.


Zugriff auf die hochgeladenen Dateien:

Die hochgeladenen Bilder werden in der Bestellung gespeichert. Im Admin kannst Du in der Bestellung im Abschnitt Positionen über das "..."-Menü die Custom Product Konfiguration aufrufen. 

 

Die Informationen zur Konfiguration werden in einem neuen Modal angezeigt und bieten Dir die Möglichkeit, die hochgeladenen Dateien herunterzuladen.
 

Bildauswahl

Die Bildauswahl bietet dir im Vergleich zu dem Auswahlfeld die Möglichkeit eine Auswahl anhand von Bildern zu geben. So hat die Bildauswahl die identischen Einstellungen wie das Auswahlfeld. Der einzige Unterschied ist, dass in den Elementen zusätzlich ein Bild hinterlegt wird, und die Option nicht in einem Dropdown Menü angezeigt werden kann. 

Im Frontend:
 

Mit einem Klick auf das Thumbnail einer Option wird das Bild in Originalgröße eingeblendet.

Handelt es sich um eine Pflichtoption, steht das Element Keine Auswahl nicht zur Verfügung.
 

Checkbox

Mit der Checkbox kannst Du Deinen Kunden eine Option anbieten, welche sie per Checkbox anwählen oder abwählen können. Auch hier kannst Du neben einem Namen und einer Beschreibung eine Bestellnummer hinterlegen und einen entsprechenden Zuschlag hinterlegen. 
 

Im Frontend: 

Datei-Upload

Der Datei-Upload bietet die Möglichkeit, PDF-Dateien hochzuladen. 
 

Die Konfiguration des Datei-Uploads funktioniert identisch zum Bild-Upload.

Im Frontend:
 

Datumsfeld

Mit dem Datumsfeld geben Sie dem Kunden die Möglichkeit, der Bestellung ein Datum hinzuzufügen. Dies kann beispielsweise ein Datum für eine Gravur oder ein Eventdatum sein.  
 

Neben den üblichen Einstellungen dieser Option gibst Du hier einen Platzhalter (1) an, welcher im Datumsfeld angezeigt wird, bevor der Kunde ein Datum ausgewählt hat. Außerdem kannst Du ein frühestens Datum (2) und ein spätestens Datum (3) angeben.

Im Frontend:

Farbauswahl

Über die Farbauswahl gibst Du dem Kunden die Möglichkeit für den Artikel eine oder mehrere Farben aus zu wählen. Ähnlich wie bei dem Auswahlfeld oder der Bildauswahl kannst Du auch bei der Farbauswahl der Option Unterelemente hinzufügen, welche jeweils für eine Farbe steht.

Nachdem Du der Option auf der linken Seite ein oder mehrere Unterelemente hinzugefügt hast, kannst Du neben dem Namen und der Bestellnummer dem Element auch eine Farbe (1) zuweisen. Auch für die Farbauswahl lässt sich sowohl für die komplette Option als auch für die einzelnen Elemente ein Zuschlag definieren. 

Im Frontend:
 

Handelt es sich um eine Pflichtoption, steht das Element Keine Auswahl nicht zur Verfügung.
 

HTML-Editor

Der HTML-Editor bietet die Möglichkeit, einen Text mit einfachen Formatierungsfunktionen einzugeben. Der eingegebene Text wird in der gleichen Form bei der Bestellung übermittelt, eine Konvertierung erfolgt nicht.
 

Neben dem Namen für die Option sind keine weiteren Pflichtangaben notwendig.
Optional kann die Eingabe im HTML-Editor als Pflichtoption markiert werden. In diesem Fall kann der Kunde das Produkt nur zum Warenkorb hinzufügen, wenn er eine Eingabe vorgenommen hat.
Zusätzlich kann eine Beschreibung hinterlegt werden, um dem Kunden weitere Informationen zur Verfügung zu stellen.
Die Options-Produktnummer kann optional gepflegt werden und wird dann in der Bestellbestätigung und der Rechnung ausgewiesen.

Informationen zu den möglichen Zuschlägen für die Option findest Du hier.

Im Frontend:
 

Zugriff auf die vom Kunden eingegebenen Daten:

Die vom Kunden getätigten Eingaben kannst Du in der Bestellung in der entsprechenden Position einsehen. Hierzu kannst Du die Konfiguration über das "..."-Menü aufrufen.

Textbereich

Der Textbereich lässt den Kunden einen Text zu dem Artikel hinzufügen. Im Vergleich zu dem Textfeld werden beim Textbereich auch Umbrüche berücksichtigt. Der Kunde hat hier also die Möglichkeit auch mehrzeilige Texte zu übergeben. 
 

Hierzu gibst Du an, wie kurz (2) bzw. wie lang (3) der vom Kunden einzugebende Text sein darf. Außerdem kannst Du einen Platzhalter (1) angeben, welcher angezeigt wird, solange der Kunde noch keinen Text eingegeben hat. 

Im Frontend:

Textfeld

Mit dem Textfeld bietest Du dem Kunden die Möglichkeit, dem Artikel einen einzeiligen Text hinzuzufügen. Dies kann beispielsweise der Text für eine Gravur oder ähnliches sein.  
 

Hierzu gibst Du wie beim Textbereich an, wie kurz (2) und wie lang (3) der Text maximal sein darf. Wie beim Textbereich gibst Du auch hier einen Platzhalter (1) an, welcher angezeigt wird, solange der Kunde noch keinen Text eingegeben hat. 

Im Frontend:

Zahlenfeld

Mit dem Zahlenfeld stellst Du dem Kunden die Möglichkeit zur Verfügung, dem Produkt eine Zahl hinzuzufügen. Dies kann beispielsweise die Anzahl eines bestimmten Einzelteils oder die Länge einer Zusatzkomponente sein.
 

Der minimale Wert (1) und maximale Wert (2) geben an, welche Daten in dieses Feld vom Kunden eingetragen werden können
Die Schrittweite (3) legt fest, in welchen Schritten die Zahlen eingegeben werden können. Es sind auch Kommastellen möglich. Beispiel: Schrittweite 0,5 - Es können Eingaben 0; 0,5; 1; 1,5; 2; 2,5 usw. verwendet werden.
Der Standardwert (4) gibt an, welcher Wert vorausgewählt ist.

Im Frontend:

Zeitauswahlfeld

Im Zeitauswahlfeld kannst Du den Kunden eine Zeit angeben lassen. Dies kann beispielsweise die Startzeit für ein Event sein.
 

Der Platzhalter (1) gibt an, wie das Feld vor der Eingabe durch den Kunden gefüllt ist. Zudem gibst Du durch die Start- (2) und Endzeit (3) an, in welchem Zeitraum der Kunde sich eine Zeit auswählen darf. 

Im Frontend:

Optionsabhängige Zuschläge definieren

Du hast die Möglichkeit, bei jeder Option zusätzlich Zuschläge zu definieren. Hierzu stehen Dir in der Konfiguration der einzelnen Optionen entsprechende Funktionen zur Verfügung, um entweder absolute oder relative Zuschläge zu erheben.
 

Absolute Zuschläge

Über den Schalter Relativer Zuschlag (1) kannst Du zwischen der Eingabe von absoluten und relativen Zuschlägen für die ausgewählte Option wechseln. Es ist pro Option jedoch immer nur eine der beiden Zuschlagsarten möglich.

Bevor Du die Höhe des Zuschlags eingeben kannst, ist es erforderlich, dass Du den Steuersatz (2) für den Zuschlag auswählst. Anschließend kannst Du den Bruttopreis (3) eintragen. Sollte das Schloss-Symbol zwischen Brutto- und Nettopreis (4) geschlossen sein, wird der Nettopreis automatisch anhand der eingetragenen Werte ermittelt. Um einen abweichenden Nettopreis zu hinterlegen, klicke einmal auf das Schloss-Symbol um dieses zu öffnen. Hierdurch ist der Nettopreis nicht mehr an den Bruttopreis gebunden.

Der Erweiterte Zuschlag (5) steht bei absoluten Zuschlägen erst nach Auswahl eines Steuersatzes zur Verfügung und bietet Dir die Möglichkeit, anhand von Rule-Builder-Regeln für die verschiedenen, im Shop hinterlegten Währungen eigene Aufschläge zu definieren.
 

Über die Checkbox Zuschlag einmal pro Bestellung (6) kannst Du festlegen, ob der Zuschlag in einer Bestellung nur einmal berechnet werden soll, auch wenn die Option mehrfach verwendet wird.


Nachdem Du einen Steuersatz ausgewählt hast, steht Dir zusätzlich die Funktion der Währungsabhängigen Preise (7) zur Verfügung. Hierüber hast Du die Möglichkeit, für jede hinterlegte Währung einen eigenen Zuschlag zu definieren. Im Standard wird der Preis der Standardwährung vererbt und mittels des in den Währungen hinterlegten Umrechnungsfaktors berechnet. Solltest Du abweichende Zuschläge für eine Währung hinterlegen wollen, kannst Du die Vererbung mit einem Klick auf das Ketten-Symbol vor dem Namen der Währung aufheben und einen eigenen Zuschlag eintragen.
 

Relative Zuschläge

Relative Zuschläge berechnen sich dynamisch anhand Produktpreises und des hinterlegten Prozentsatzes für den Zuschlag.
 

Um einen relativen Zuschlag zu verwenden, aktiviere den Schalter Relativer Zuschlag (1).

Zur Berechnung des Zuschlags hinterlege einen Steuersatz (2) und den relativen Zuschlag (3).

Solltest Du tiefergehende Konfigurationen für den Zuschlag verwenden wollen, kannst Du den Erweiterten Zuschlag (4) aktivieren.
Hier hast Du die Möglichkeit, anhand von Rule-Builder-Regeln unterschiedliche Aufschläge zu definieren.
 

Über die Checkbox Zuschlag einmal pro Bestellung (6) kannst Du festlegen, ob der Zuschlag in einer Bestellung nur einmal berechnet werden soll, auch wenn die Option mehrfach verwendet wird.

Optionen untereinander ausschließen

Wenn Du mindestens 2 Optionen angelegt hast, die nicht als Pflichtoption gekennzeichnet sind, wird die Möglichkeit zum gegenseitigen Ausschluss von Optionen eingeblendet.
 

Um eine Ausschluss-Kombination anzulegen, klicke auf den Button Ausgeschlossene Kombination hinzufügen. Im sich nun öffnenden Modal kannst Du die weitere Konfiguration vornehmen.
 

Zunächst vergebe einen Namen für die Kombination, anhand dessen Du auch später noch erkennen kannst, was Du hier genau konfiguriert hast.

Für die eigentliche Konfiguration kannst Du nun aus den angelegten Optionen wählen, die nicht als Pflichtoption oder Mehrfachauswahl angelegt sind.
Bei diesen Optionen wählst Du dann zusätzlich aus, ob der Ausschluss erfolgen soll, wenn der Kunde dort eine Eingabe gemacht hat oder wenn das Feld leer ist. Somit ist es auch möglich, Optionen miteinander zu kombinieren und eine Eingabe bei einem Feld zu fordern, wenn ein anderes Feld ebenfalls gefüllt wurde.
 

Vorlage einem Produkt zuweisen

Nachdem Du eine Vorlage mit den gewünschten Optionen angelegt hast, kannst Du diese nun einem Produkt zuordnen, damit der Kunde dieses Produkt individualisieren kann. 
 

Hierzu öffnest Du die Produktkonfiguration von dem Produkt, welches eine Individualisierungsmöglichkeit erhalten soll. Im Reiter Allgemein findest Du den Menüpunkt Custom Products, in welchem Du nun eine Produktvorlage aus Custom Products zuordnen kannst.
 

Frontend

Normaler Modus

Im Frontend werden die Optionen aus Custom Products im Standard Responsive Theme oberhalb des In den Warenkorb Buttons angezeigt.

 

Hierbei lassen sich die einzelnen Optionen der Produktvorlage vom Kunden ausklappen (1) und einzeln bearbeiten. 
Handelt es sich bei einer Option um ein Pflichtfeld (2), wird dies entsprechend angezeigt. Auch eventuelle Zuschläge (3) für eine Option werden eingeblendet. (Zuschläge für ein Element innerhalb einer Option werden neben dem Element angezeigt). Wenn ein Kunde eine Option bzw. ein Element mit einem Zuschlag ausgewählt hat, wird dies in der unteren Übersicht Pro Stück Aufschläge (4) zusammengefasst.
 

Schritt für Schritt Modus

Wenn Du in der Produktvorlage den Schritt für Schritt Modus aktiviert hast, werden die verfügbaren Optionen im Frontend nicht direkt angezeigt. Stattdessen befindet sich oberhalb des In den Warenkorb Buttons der Bereich für die Individualisierung (1) des Produkts. Über den Button Produkt Konfigurieren (2) wird der Kunde dann Schritt für Schritt durch die Optionen geleitet. Wenn ein Kunde eine Option bzw. ein Element mit einem Zuschlag ausgewählt hat, wird dies in der unteren Übersicht Pro Stück Aufschläge (3) zusammengefasst.
 

Der Kunde wird Schritt für Schritt durch die Optionen geführt und kann den Artikel dann in den Warenkorb legen, sobald alle Pflicht Optionen ausgefüllt wurden. 

Ausgabe von Custom Products Optionen auf der Rechnung

Die einzelnen Custom Products Optionen werden als eigene Positionen in der Rechnung aufgeführt. Solltest Du für die Option eine eigene Produkt-Nummer vergeben haben, wird diese ebenfalls mit angezeigt.