Hybris + CMS | Magnolia CMS und SAP Hybris integrieren

Hybris + CMS | Magnolia CMS und SAP Hybris integrieren

Onlineshops können mithilfe von Storytelling die Customer Experience steigern. Doch bislang setzen nur wenige Unternehmen, wie beispielsweise die Bechtle AG auf die Verbindung zwischen Content und Commerce. Die Herausforderungen dafĂŒr liegen insbesondere auf der technischen Ebene. Sebastian Haftmann und Benjamin Fiebig von Neofonie erklĂ€ren, wie Magnolia CMS und SAP Hybris Commerce vertikal integriert werden können.

Kundenerlebnisse schaffen

FĂŒr einen erfolgreichen Onlineshop steht die Customer Experience im Vordergrund und ist wichtiger denn je: Der Shop-Besucher möchte emotional abgeholt werden, er möchte alles ĂŒber das Produkt erfahren, sei es die geografische Herkunft, die einzelnen Bestandteile oder die Hintergrundgeschichte, bzw. die Vision des GrĂŒnders, warum und wie die Ware entwickelt wurde. Vor allem im B2C-GeschĂ€ft sehnen sich die Konsumenten nach Geschichten und nur so können Unternehmen Wettbewerbsvorteile zielfĂŒhrend ausreizen. Das Konsumerlebnis ist entscheidend und maßgeblich von der Bildhaftigkeit beeinflusst. Mittlerweile möchte der Kunde multimedial Produkte sehen und erleben. Bilder und Videos waren der Anfang, Virtual Reality und Augmented Reality sind die neuesten technischen Kniffe, um den Kunden in eine bunte Produktwelt eintauchen zu lassen.

Auch das vermeintlich starre B2B-GeschĂ€ft kann via Storytelling mit emotionalen visuellen Inhalten aufgefrischt werden und das Kauferlebnis ĂŒber diesen Weg verbessern. Doch bislang setzen nur wenig Unternehmen auf die Verbindung zwischen Content und Commerce. Die HĂŒrden liegen oftmals in den technischen Gegebenheiten. Oft reichen die CMS-FĂ€higkeiten eines Shopsystems nicht aus, um eine echte Customer Experience bieten zu können. Des Weiteren erweist sich die Implementierung mithilfe der shopeigenen CMS-FunktionalitĂ€ten hĂ€ufig als aufwĂ€ndig und unflexibel.

Vor diesem Hintergrund ist es sinnvoll, fĂŒr eine konvergente Shop-Lösung die E-Commerce-FĂ€higkeiten des Shopsystems mit den Content-FĂ€higkeiten eines leistungsfĂ€higen CMS zu integrieren.

Vorteile einer vertikalen Integration

Meist werden Shopsysteme durch eine softwaretechnisch horizontale Integration mittels Export/Import und Nachbildung von Datenstrukturen des Product Information Management (PIM) im CMS erweitert. Bei spĂ€teren Änderungen im E-Commerce-System mĂŒssen diese dann hĂ€ufig im CMS “nachgezogen” werden. Um dies zu vermeiden und um eine grĂ¶ĂŸere UnabhĂ€ngigkeit und FlexibilitĂ€t zu erreichen, bieten sich moderne vertikale Architekturen an. E-Commerce-GrĂ¶ĂŸen wie Amazon, Otto und Zalando vertrauen bei ihren komplexen Onlineshops auf einen vertikalen Systemschnitt. Dabei werden voneinander entkoppelte Systeme, die eigenstĂ€ndige Funktionen erfĂŒllen, zu einer User Experience zusammengefĂŒhrt.

Insgesamt lÀsst sich eine höhere UnabhÀngigkeit und FlexibilitÀt realisieren.

  • Erweiterbarkeit: Neue Aspekte einer E-Commerce-Lösung (z.B. Zahlungsabwicklung, Tracking etc.) können als eigene Vertikale unabhĂ€ngig entwickelt werden und ĂŒber REST-Schnittstellen und dazugehörige Entwicklungstools (Mocks etc.) modular und agil integriert werden.
  • Anpassbarkeit: Ă„nderungen am Produktdatenmodell (z.B. neue Typen, Attribute) auf der einen Seite sowie Frontend-Makeover wie bei dem Layout und Styling der Produktdarstellung auf der anderen Seite, können allein durch Entwicklung an einer Vertikalen realisiert werden. Anpassungen am Gesamtsystem lassen sich aufgrund der weitgehenden technischen Entkoppelung der Vertikalen schneller und risikoĂ€rmer realisieren.
  • FlexibilitĂ€t: Aufgrund der Entkoppelung der Vertikalen und ihrer Integration mittels gĂ€ngiger Standards kann fĂŒr jede Vertikale die geeignete Technologie und Vorgehensweise gewĂ€hlt werden. Die starke ModularitĂ€t des Gesamtsystems vereinfacht Make or Buy-Entscheidungen und reduziert die Wahrscheinlichkeit von Vendor Lock-Ins. Im Zusammenspiel mit dem Aspekt der hohen Anpassbarkeit des Systems lassen sich technologische Entscheidung auch zu einem spĂ€teren Zeitpunkt im Lebenszyklus des Gesamtsystems treffen bzw. revidieren.
  • Personalisierung: Mithilfe des Kundentrackings können Sie individuellen Content und Produktangebote ausspielen, die auf die BedĂŒrfnisse Ihrer Kunden maßgeschneidert sind. Somit schaffen Sie individuelle Kundenerlebnisse und geben dem Kunden höhere Anreize zum Konvertieren!
  • Konsistenz: Mit der Integration zwischen einem CMS und Shop-System bieten Sie dem Kunden konsistente Informationen ĂŒber Ihre Produkte und angebotenen Content.

Containerisierung mit Docker

Um vertikale Services in der Entwicklung, aber auch im Betrieb gerade mit wachsender KomplexitĂ€t effizient handhaben zu können, empfiehlt sich das Setup einer Container-gestĂŒtzten Infrastruktur. Die derzeit beliebte Container-Technologie Docker stellt hierfĂŒr ein vielseitiges und flexibles Toolset bereit, das zum einen eine enge Verzahnung von Entwicklung und Betrieb und zum anderen einen hohen Grad an Automatisierung verschiedener beteiligter Prozesse ermöglicht.

FĂŒr den vertikalen Ansatz werden alle Vertikalen des Gesamtsystems “dockerisiert”, d.h. in einem oder mehreren Docker-Containern bereitgestellt. Die Dockerisierung ermöglicht, dass jede Anwendung eine eigene und fest definierte Laufzeitumgebung unabhĂ€ngig von der Deployment-Umgebung besitzt. Die Dockerisierung der monolithischen Architekturen Magnolia und Hybris erlaubt es zudem, beide Anwendungen als Services in einer verteilten Microservice-Architektur einzusetzen. Die einzelnen Vertikalen-Anwendungen werden dafĂŒr mit Docker Compose technisch zum Gesamtsystem integriert. Diese Vorgehensweise, aber auch der Inhalt aller Docker-Container ist in allen Entwicklungsschritten identisch. Somit kann unter “Live”-Bedingungen entwickelt und getestet werden.

Ein weiterer Vorteil von Docker ist das schnelle Setup von automatisierten Infrastrukturprozessen mit bestehenden Tools. Continuous Integration und Deployment auf eine Staging- oder Production-Umgebung erfolgt z.B. mithilfe von GoCD automatisiert. FĂŒr alle Komponenten können Build- und Deployment-Pipelines vorgesehen werden, die per commit hook auf dem Masterbranch der jeweiligen Komponenten oder manuell ausgelöst werden. Damit werden agile Vorgehen bei der Softwareentwicklung optimal unterstĂŒtzt.

Vertikale Integration am Beispiel einer B2B-Plattform

Die Bechtle AG ist ein fĂŒhrendes IT-Handelsunternehmen in Europa und hat auf ihrer neuen Website alle Informationen zum Unternehmen sowie alle Dienstleistungen und Produkte auf einer Seite vereint. Die zuvor getrennten Webseiten, Shop und Unternehmenswebsite, wurden hierzu zu einer nahtlosen Plattform vereint. Die Basis bildet eine vertikale IT-Systemstruktur, bei der das CMS Magnolia und das Shopsystem SAP Hybris ineinander integriert wurden.

Startseite von Bechtle auf einem Smartphone und Tablet

Dazu musste zunĂ€chst das Gesamtsystem in Vertikale gemĂ€ĂŸ identifizierter Fachlichkeiten aufgeteilt werden. Jede Vertikale stellt eine unabhĂ€ngige Anwendung dar, die ihr eigenes Frontend (sofern notwendig) und ihre eigene Datenhaltung besitzt. Der Datenaustausch zwecks Integration findet ĂŒber REST-Schnittstellen statt.

Die Vertikale “Publishing” mit Magnolia CMS als Kern stellt den Web-Content (BĂŒhnen, Impressum, AGB etc.) des Shops zur VerfĂŒgung. Gleichzeitig wird das Frontend fĂŒr die Auslieferung des Shops integriert. Layout und Styling sowie die Informationsstruktur der Shop-Website sind an dieser Stelle definiert. Fachlich zustĂ€ndig fĂŒr diese Vertikale ist in der RealitĂ€t meist ein Web-Publishing-Team.

In der Vertikale “Commerce” mit Hybris findet das Product-Content-Management statt. In Hybris wird das Produktdatenmodell, Produktkatalog samt Produktattributen und die Produktmedien gepflegt. DarĂŒber hinaus stellt Hybris VerfĂŒgbarkeits-, Warenkorb- und Checkout-FunktionalitĂ€ten bereit. Kommerziell relevante Daten wie Produkt-, Preis- und Nutzerdaten fließen dabei aus vorgelagerten CRM- bzw. ERP-Systemen in Hybris ein.

Weitere Shop-FunktionalitĂ€ten außerhalb der beiden Kern-Fachlichkeiten, wie z.B. eine Produktsuche oder ein Mail-Service fĂŒr das Handling von E-Mail-Kommunikation des Shops lassen sich ĂŒber weitere Vertikalen realisieren.

Anwendungsbeispiel: Redaktionelle Produkt-Teaser

Ein Anwendungsbeispiel fĂŒr eine lose technische Koppelung verschiedener Fachlichkeiten ist die redaktionelle BestĂŒckung von Produkt-Teasern. Im Redaktionssystem von Magnolia, also in der ZustĂ€ndigkeit der Vertikale “Publishing”, können auf einer beliebigen Shop-Seite Produkt-Teaser platziert werden. Dabei legt das Web-Publishing-Team fest, wie viele Produkt-Teaser angezeigt und welche Produkte jeweils angeteasert werden sollen. Letzteres kann fĂŒr jeden Produkt-Teaser in einem zweistufigen Auswahldialog festgelegt werden. Die Auswahlfelder fĂŒr Produktkategorie und Produkt im Dialog werden zur Laufzeit ĂŒber REST/JSON bei Hybris abgefragt. Damit wird gewĂ€hrleistet, dass das Web-Publishing-Team immer auf dem aktuellen Produktdatenstand arbeiten kann, ohne auf Zulieferungen (z.B. Produktdatenimporte von Hybris in Magnolia) der Vertikale “Commerce” warten zu mĂŒssen. Nach erfolgter Auswahl im Dialog wird die entsprechende Produkt-ID persistiert. Bei Abruf der Seite liefert die Vertikale “Commerce” dann die fertige Produktkachel zu der Produkt-ID.

Integration von SAP Hybris Commerce in Magnolia CMS

Die beiden Vertikalen â€žCommerce“ und â€žPublishing“ mussten nun auch funktional miteinander integriert werden. Technisch geschieht dies folgendermaßen: Produktinhalte inklusive Produktmedien werden vom Produktmanagement in Hybris, also der Vertikalen „Commerce“, verwaltet. Auch WarenkorbfunktionalitĂ€t und Order-Management liegen in der fachlichen ZustĂ€ndigkeit dieser Vertikalen. Um die genannten Funktionen fĂŒr andere Services bereitzustellen, können in Hybris fĂŒr Shop-FunktionalitĂ€ten wie Produkt-Teaser, Produktdetailseiten und Warenkorb- sowie Checkout-Seite REST-Schnittstellen implementiert werden, welche semantisches (ungestyltes) HTML zurĂŒckgeben – wenn man so will, als Frontend der Vertikale „Commerce“. Dieses HTML wird von Magnolia beim Rendern der jeweiligen Seite in einen generischen Rahmen aus Header und Footer integriert und dabei mit einem Styling gemĂ€ĂŸ Shop-Design versehen. Die Inhalte und FunktionalitĂ€ten aus der Vertikalen „Commerce“ können dabei auf einer Seite beliebig mit redaktionellen Inhalten aus Magnolia kombiniert werden.

Der Vorteil der Integration von semantischem HTML besteht darin, dass Magnolia bezĂŒglich der von Hybris gelieferten Ressourcen komplett agnostisch ist. Die Vertikale „Commerce“ allein bestimmt den Inhalt und die Struktur der Produktinhalte und „Commerce“-Funktionen ohne technische AbhĂ€ngigkeiten zur Vertikalen „Publishing“. Änderungen an den Attributen einer Produktkategorie oder Reihenfolge deren Darstellung können in Hybris realisiert und ausgerollt werden, ohne dass Magnolia involviert ist. Neben dieser visuellen REST-Integration mittels HTML als Datenformat, werden weitere klassische Shop-FunktionalitĂ€ten als reiner Datenaustausch per REST/JSON-Integration realisiert. Dazu gehören Shop-Funktionen wie beispielsweise der „In den Warenkorb legen“-Button, der Abruf der Anzahl von Produkten im Warenkorb fĂŒr die Darstellung in der Navigation und das Ändern der Produktmenge im Warenkorb. Hier wird Hybris jeweils per AJAX direkt aus dem Frontend angefragt. Das Datenaustauschformat ist JSON.

Die Frontend-Integration der verschiedenen Komponenten aus den Vertikalen und damit die Auslieferung der fertigen Seite ĂŒbernimmt die Vertikale “Publishing”.

Veröffentlicht am 28. MÀrz 2018, aktualisiert am 12. Oktober 2020

Teilen auf

Sebastian Haftmann & Benjamin Fiebig

Benjamin Fiebig ist Technischer Projektleiter bei der Neofonie und hat seinen Schwerpunkt in Enterprise E-Commerce Systemen. Benjamin war zuvor mehrere Jahre in den Bereichen Logistik und E-Commerce tĂ€tig, u.a. beim Aufbau der Digital Commerce Platform fĂŒr die Daimler AG. Sebastian Haftmann ist Project Manager bei Neofonie und berĂ€t Kunden bei der Planung und Realisierung digitaler Lösungen in den Bereichen Portale, Mobile und E-Commerce. In den vergangenen Jahren begleitete er u.a. Olympus Europe, Wort & Bild Verlag sowie Creditreform bei der Umsetzung komplexer Projekte.

Illustration von CRM-Systemen

Neofonie hilft mit CRM-Beratung zur 360° Kundensicht

Neofonie unterstĂŒtzt Sie beim Aufbau eines erfolgreichen Customer Relation Managements.

SEO in bunten Buchstaben

Webinar: Relaunch und SEO – So machen Sie es richtig

Am 25.08. zeigt SEO-Experte Anton Littau, wie die richtige Strategie zum richtigen Zeitpunkt hilft.

SAP Silver Partner Logo

Neofonie ist SAP Silver Partner mit TXTWerk

Als SAP Silver Partner stellt Neofonie das Text Mining Framework TXTWerk im SAP App Center ab sofort bereit.

Ibexa-Logo

Neofonie und Ibexa sind Partner

Neofonie und Ibexa vereinbaren Partnerschaft, um Content und Commerce stÀrker miteinander zu verbinden.

digital-ratgeber.de auf einen Macbook

Wort und Bild Verlag stellt Digital Ratgeber vor

Mit Neofonie als Partner bringt der Wort & Bild Verlag mit dem „Digital Ratgeber“ eine neue Informationsplattform fĂŒr Apotheken und deren Kunden auf den Markt.

Stadtwerke Oranienburg News

Storytelling-Beratung fĂŒr Stadtwerke Oranienburg

Neofonie unterstĂŒtzt die Stadtwerke Oranienburg in einem kreativen Kommunikationsworkshop, um ihr Online-Ableseportal mit einem Kino-Werbespot zu promoten.

Mutter hÀlt Àngstliches Kind in den HÀnden

Spende fĂŒr ein Berliner Kinderhospiz

Mitarbeiter der Neofonie und Neofonie Mobile spenden 1.500 EUR fĂŒr das Berliner Kinderhospiz „Berliner Herz“.

Niedlicher Roboter

Chatbot erstellen in 5 Schritten

Wie ein Chatbot in wenigen Schritten entwickelt werden kann, stellen Bertram SĂ€ndig und Cornelia Werk vor.

Schwarzes Mikrofon

Neofonie Blogcast jetzt auf Google Podcast anhören

Mit der EinfĂŒhrung von Google Podcast in Deutschland, ist jetzt auch der Neofonie Blogcast auf allen Google-GerĂ€ten verfĂŒgbar.

Wann Big Data im Forderungsmanagement sinnvoll ist

Ob Analyseverfahren fĂŒr ein Unternehmen sinnvolle Ergebnisse bringen, kann nicht pauschal beantwortet werden.

Rot-beleuchtete Treppen

FlexibilitÀt als Erfolgsfaktor bei der Shopsystem Auswahl

Welche Punkte Sie bei einer neuen Shoplösung beachten sollten, stellt Michael Vax, VP Product bei Spryker vor.

Jovo Logo

Neofonie Mobile baut Alexa Skills and Google Actions mit Jovo

Neofonie Mobile ist neuer Partner des Entwicklungs-Framework Jovo und erstellt damit Sprachanwendungen fĂŒr Google und Alexa.

Illustration von digitalen Versicherungen

Versicherungen im Vergleich: Apps sind Pflicht

Die aktuelle Marktanalyse des App-Spezialisten Neofonie Mobile belegt Nachholbedarf in der digitalen Transformation unter Versicherern und Krankenkassen.

Text Mining Consulting KI E-Commerce

Wie Onlineshops von KĂŒnstlicher Intelligenz profitieren

Welche Punkte Sie bei einer neuen Shoplösung beachten sollten, stellt Michael Vax, VP Product bei Spryker, vor.

Was eine moderne Suchlösung leisten muss

Eine Suche auf Websites hilft Nutzern, schneller Informationen zu finden. Suchlösungen haben dabei nicht mehr lĂ€nger nur den Anspruch einzelne Begriffe zu finden, sondern relevante Inhalte gezielt auf die BedĂŒrfnisse des Nutzers auszuspielen.

Individual-Commerce: Wie Produktkonfiguratoren Onlineshopper glĂŒcklich machen

Auch Onlineshops können den Kunden mittels smarter Produktkonfiguratoren individuell abholen und ihnen ihr ganz persönliches Shoppingerlebnis ermöglichen.

JĂ€germeister Produktkonfigurator

Wie JĂ€germeister mit neuem Onlineshop mehr Umsatz macht

Das Erfolgsrezept stellt Wiljo Krechting, Manager Public Relations von Shopware, genauer vor.

Mit B2B-Storytelling und UX zu mehr Erfolg

B2B Unternehmen mĂŒssen vom B2C-Nutzererlebnis lernen, um ihre Businesskunden nachhaltig zu begeistern. Dabei stehen User Experience (UX) und Storytelling im Mittelpunkt.

Was sich hinter Headless CMS verbirgt

Das Konzept eines Headless CMS ist nicht neu, aber es wird immer wichtiger fĂŒr Unternehmen – vor allem bei Marketeers, Entwicklern und Business Developern.

Magnolia CMS wird auf einem Tablet bedient

How-to: Magnolia CMS und commercetools in 5 Schritten integrieren

Im Rahmen eines Demo-Shops hat Neofonie das Shopsystem commercetools mit Magnolia CMS integriert und dabei die Vorteile beider Systeme vereint.

Unser Newsletter „Neo Report“ vermittelt konkretes Praxiswissen, Trends und Know-how fĂŒr Ihr digitales Business – quartalsweise und kompakt. Jetzt anmelden.