Der Kunde
Der Kunde ist ein mauritischer Beauty-Händler mit drei Ladengeschäften und Lieferung auf der ganzen Insel. Kunden zahlen per Karte, mit MCB Juice oder per Banküberweisung und können ihre Bestellung kostenlos in jeder der drei Filialen abholen.
Die Ladenkassen laufen mit Loyverse POS. Vor dem Neuaufbau lief der Onlineshop auf WooCommerce.
Das Problem
Ein Beauty-Sortiment ändert sich ständig, und jedes im Laden verkaufte Produkt muss im selben Moment von der Website verschwinden. Sonst bestellen Kunden Artikel, die nicht mehr im Regal stehen.
Außerdem brauchte das Unternehmen die Zahlungsarten, die auf Mauritius tatsächlich genutzt werden, einen Onlineshop, den Suchmaschinen Seite für Seite lesen können, und einen Abschied von WooCommerce, bei dem die Produkt-URLs, die Google bereits kannte, nicht verloren gehen.
Was gebraucht wurde
- Kartenzahlung über das MCB-Payment-Gateway, dazu MCB Juice und Banküberweisung
- Lagerbestand im Gleichlauf mit den Loyverse-Kassen in allen drei Filialen
- Click & Collect an drei Standorten und Lieferzonen auf der ganzen Insel
- Aktionen, die das Team selbst durchführen kann: Gutscheincodes, Buy X Get Y, Bundles, Geschenkkarten
- Rechnungen mit Mehrwertsteuer und ein Backoffice mit Mitarbeiterrollen
- Migration von WooCommerce ohne Verlust des bestehenden Suchtraffics
Was wir gebaut haben
Wir haben eine individuelle Storefront in React und Vite auf Basis von Firebase (Firestore und Cloud Functions) gebaut. Bestellungen werden auf dem Server berechnet und angelegt, nie im Browser: Eine einzige Transaktion prüft die Preise, wendet Gutscheincodes und Geschenkkarten an und reserviert den Bestand, sodass nicht zwei Kunden gleichzeitig das letzte Stück kaufen können.
Die Kartenzahlung läuft über den gehosteten Checkout des MCB Mastercard Gateway in MUR. Eine Bestellung gilt erst dann als bezahlt, wenn das Gateway selbst den erfassten Betrag bestätigt. Dass der Kunde auf die „Danke“-Seite zurückkehrt, gilt nicht als Nachweis. Bestellungen per MCB Juice und Banküberweisung durchlaufen einen eigenen Bestätigungsablauf.
Die Loyverse-Integration funktioniert in beide Richtungen. Ein Webhook von Loyverse löst ein erneutes Auslesen der geänderten Artikel über die Loyverse-API für das eigene Geschäft des Händlers aus, und online geänderter Bestand wird nur dann an das Kassensystem zurückgemeldet, wenn er sich tatsächlich geändert hat. Jede Lagerbewegung (Webbestellung, Kassenverkauf, Synchronisierung oder manuelle Änderung) wird mit ihrer Quelle in einem Lagerjournal festgehalten.
Da eine Single-Page-App Suchmaschinen überall dieselbe Seite zeigt, rendert ein Build-Schritt für jede Produkt-, Kategorie-, Marken- und Hauttyp-Seite eine eigene HTML-Seite mit Titel, Beschreibung und strukturierten Daten vor und erzeugt die Sitemap sowie die 301-Weiterleitungen von den alten WooCommerce-URLs.
Gelieferte Funktionen
- MCB-Kartengateway, MCB Juice und Banküberweisung
- Lagerabgleich mit Loyverse POS in beide Richtungen, mit Lagerjournal
- Click & Collect in drei Filialen, Lieferzonen und Versandregeln
- Gutscheincodes, BOGO / Buy X Get Y, Bundles und digitale Geschenkkarten
- Rechnungen mit 15 % MwSt. als PDF
- Regelbasierte Produktempfehlungen mit Klick-Attribution
- E-Mails zu abgebrochenen Warenkörben und zum Geburtstag
- GA4-E-Commerce-Tracking (In den Warenkorb, Checkout, Kauf)
- Backoffice mit rollenbasierten Mitarbeiterrechten und Audit-Log
- WooCommerce-Produktimport und Weiterleitungen alter URLs
- Vorgerenderte SEO-Seiten und automatische Sitemap
- WebP-Bildpipeline mit Vorschaubildern
Gelöste Herausforderungen
Ein Lagerbestand, vier Verkaufsstellen
Drei Kassen und eine Website verkaufen dieselben Artikel. Webhooks allein waren nicht zuverlässig genug. Deshalb löst jeder Webhook nur ein erneutes Auslesen des Artikels aus Loyverse aus, gefiltert auf das Geschäft des Händlers, und jede Änderung wird im Journal erfasst, damit sich jede Abweichung nachverfolgen lässt.
Zahlungen, auf die Verlass ist
Kartenbestellungen werden anhand des Datensatzes im Gateway selbst bestätigt (Status „erfasst“ oder „autorisiert“, in MUR, mindestens in Höhe des Bestellbetrags), und unbezahlte Kartenbestellungen werden automatisch freigegeben, sodass ihr Bestand wieder ins Regal kommt.
WooCommerce verlassen, ohne Google zu verlieren
Rund 227 alte Produkt-URLs wurden einzeln per dauerhafter Weiterleitung ihren neuen Seiten zugeordnet, damit die Links und Rankings des alten Shops erhalten bleiben.
Das Ergebnis
Der Händler führt seinen Onlineshop und seine drei Filialen jetzt mit einem einzigen Lagerbestand. Die Website veröffentlicht mehr als 540 Produktseiten und 50 Kategorieseiten, jede mit eigenem suchmaschinenfähigem HTML, und das Team verwaltet Aktionen, Geschenkkarten und Inhalte selbst, ohne einen Entwickler rufen zu müssen.
Artover hostet, wartet und erweitert die Plattform weiterhin.