30. Juli 2019

Shopware Neos Integration

Seit etwa zwei Wochen ist es soweit: Shopware 6 ist der in der Early Access Version verfügbar. Pünktlich zum neuen Release haben wir im Rahmen unseres internen Barcamps vergangene Woche daher eine Neos Integration für Shopware entwickelt. Diese ermöglicht es, aus Neos heraus auf Daten vorhandener Shopware Installationen zuzugreifen und sie über Neos auszugeben.

Bei der Umsetzung haben wir einen etwas abstrakteren Ansatz gewählt, um den Nutzer nicht auf vorgefertigte Content NodeTypes festzulegen, sondern Möglichkeiten der Datensammlung zu schaffen.

Komponenten

NodeType-Mixins

Auf nahezu allen Nodetypes lassen sich dadurch Produkte oder Kategorien verknüpfen. Die Mixins kann man mit jedem Nodetype nutzen, sodass Nutzer dann die Möglichkeit haben auf die Daten des konfigurierten Shops zuzugreifen. Dadurch bekommt der Nutzer in der Auswahlliste sämtliche Produkte bzw. Kategorien ausgegeben, die zur Verfügung stehen - und zwar immer live, sobald der Inspektor geladen wird.

Processor Prototypen

Der zweite Prototyp, den wir entwickelt haben, ist ein Processor. Dieser macht im Grunde nichts anderes, als in Textelementen verwendete Placeholder zu ersetzen. Dieser Vorgang ist im Backend nicht zu sehen, da der Processor nur auf Frontend-Darstellungen angewendet wird. Der Vorteil: Die Placeholder können auch per inline-editing gesetzt werden.
Erst beim Wechsel ins Frontend ersetzt er die Placeholder, wie zum Beispiel Produktname, Kategoriename und Preis.

Datensammler als Fusion-Prototypen

Der dritte Prototyp die Aufgabe Daten zur Verfügung stellen. Gibt man einem der Prototypen beispielsweise eine Produkt ID mit, bezieht er sämtliche Daten zu diesem Produkt und stellt diese als Array zur Verfügung, das entsprechend der Wünsche des Nutzers ausgegeben werden kann.

Shopware Mix-In Darstellung im Neos-Inspektor

NodeType-Mixins

Vergleich Shopware Neos Integration Backend Frontend Ansicht

Neos Shopware Integration: Backend- und Frontend-Ansicht

Realtime-Daten im Frontend

Manche Daten, vor allem Preis oder Verfügbarkeit, lassen sich zudem client-seitig aus Shopware beziehen. Dafür sollte diese natürlich am besten immer aktuell und nicht in Neos gecached sein. Durch dieses Feature lassen sich beispielsweise Detailseiten für Produkte aufbauen.

Außerdem ermöglicht ein von uns entwickeltes Plug-in für Shopware den gesamten Shop in einem ersten Zwischenschritt zu reduzieren, sodass man nur eine minimale Ausgabe der Daten bekommt. Mit anderen Worten: besucht man etwa die Detailseite, werden alle Elemente, die nicht für Shop-Funktion benötigt werden, ausgeblendet, z.B. die Navigation oder Footer-Daten. Dennoch kann man Produkte kaufen und es steht die komplette Funktion eines Shopware-Backends zur Verfügung. Auch der Check-out wird auf die wesentlichen Elemente reduziert, sodass dieser auch in einem iFrame oder einem neuen Tab geöffnet werden kann.

Use cases

Das Plugin lässt sich für verschiedene Anwendungsfälle nutzen, unter anderem

  • als Produktteaser
  • als Slider einer Kategorie, die man beispielsweise als fremden Content auf Neos Websites einbinden kann
  • oder auch für Fälle, in denen bereits individuell aufgebaute Produkte vorhanden sind, und man via Plug-in direkt zum Check-out Prozess des Shops wechselt

Shopware 6

Unserer Arbeit mit der neuen Version von Shopware war große Vorfreude vorausgegangen, da Shopware sich damit rühmt Shopware 6 sei API-first. Während der Entwicklung haben wir aber festgestellt, dass die Shopware Storefront selbst nicht die API konsumiert.

30. Juli 2019