Beats online verkaufen mit einem Warenkorb, der funktioniert
Jahrelang hatte jeder Beat in meinem Shop nur einen Button: kaufen. Er öffnete die Lizenzauswahl, du hast eine gewählt, und BeatStars hat dich mit genau diesem einen Beat im Checkout abgeliefert. Es funktionierte, und es kostete still Verkäufe. Wollte ein Produzent zwei Beats, musste er zweimal zahlen, weil jeder Button einen neuen Kauf startete. Das macht niemand. Er kauft einen, sagt, er kommt wegen des anderen zurück, und kommt nicht zurück.
Also habe ich am 22. Oktober einen echten Warenkorb auf die Seite gesetzt. Kein Plugin: Der Shop ist eine statische Seite, mit Astro gebaut, ohne Datenbank und ohne eigenes Admin-Panel. Es ist die größte Veränderung, die dieser Shop seit dem Start erlebt hat, und so funktioniert sie.
Das Problem mit einem Kaufbutton
Ein Beat-Shop ist kein Laden mit Einkaufswagen. Er ist ein Katalog, in dem jeder Artikel sechs Lizenzstufen hat, und der Preis ändert sich mit der Stufe, nicht mit der Menge. Deshalb haben sich die meisten Produzenten nie mit einem Warenkorb beschäftigt: Die Plattform gibt dir einen Link pro Beat, und du schickst den Käufer dorthin.
Der Preis dafür ist unsichtbar, aber real. Jeder zusätzliche Checkout ist eine weitere Chance für den Käufer, es sich anders zu überlegen. Er geht zweimal durch ein Zahlungsformular, gibt zweimal dieselben Daten ein und bekommt zwei getrennte Mails für zwei Dateien. Und wenn er eine Basic-Lizenz auf dem einen Beat mit einer Stems-Lizenz auf einem anderen vergleichen wollte, waren die beiden Käufe völlig unabhängig.
Was BeatStars dir zum Arbeiten gibt
BeatStars veröffentlicht keine Warenkorb-API, aber das Frontend des Shops benutzt eine, und sie ist erreichbar. Drei Aufrufe reichen:
- Einen Warenkorb anlegen mit einer neuen uuid. Jeder Checkout bekommt eine frische, damit ein Käufer nie Artikel aus einem früheren Besuch erbt.
- Eine Position hinzufügen mit der Track-ID und der Contract-ID der gewählten Lizenz. Der Vertrag legt die Stufe und den Preis fest, nicht der Track allein.
- Einen Share-Link anfordern. Wenn der Käufer diese URL öffnet, kopiert sie den Warenkorb in seinen Browser und setzt ihn mit allem geladen in den BeatStars-Checkout.
Der wichtige Teil: Zahlung und Auslieferung bleiben bei BeatStars. Die Seite berührt nie eine Karte, speichert nie einen Käufer und wird nie ein Shop. Sie baut nur den Warenkorb und übergibt ihn, und deshalb kann das Ganze in einer statischen Seite leben.
Eine statische Seite statisch halten
Der Warenkorb lebt im Browser. Er speichert zwei Dinge pro Position: welcher Beat und welche Lizenz. Sonst nichts. Namen, Preise und Contract-IDs werden bei jedem Laden aus der Konfiguration der Seite gelesen, damit eine Preisänderung nie eine veraltete Zahl in einem Warenkorb hinterlässt, den jemand letzte Woche begonnen hat.
Der Zähler im Header, die Buttons zum Hinzufügen und Entfernen und die Summen sind reines JavaScript. Es gibt keine Session, keinen Login und keinen Server von mir dazwischen. Der einzige Moment, in dem die Seite mit jemandem spricht, ist der, in dem der Käufer auf Checkout drückt und der Share-Link gebaut wird.
Zwei kleine Details haben im Test den Unterschied gemacht. Eine Lizenz pro Beat: Der Warenkorb weigert sich, denselben Beat zweimal zu halten, weil die Plattform das auch so macht und ein Käufer, der es versucht, verwirrt wird statt bedient. Und wenn jemand zum Checkout geht und ohne zu zahlen zurückkommt, ist der Warenkorb noch da, wiederhergestellt aus einer Kopie, die kurz vor dem Verlassen gespeichert wurde. Das ist das Nächste an einer Rettung abgebrochener Warenkörbe, was du ohne Kontosystem bauen kannst.
Die Rabatte sind der Teil, den niemand richtig hinbekommt
Meine Lizenzen tragen das Angebot des Shops: eins Basic kaufen und zwei gratis dazu, oder drei Standard und zwei gratis. BeatStars wendet das einmal pro Warenkorb an, im Checkout, auf die günstigsten Positionen. Wenn die Seite 65,90 $ anzeigt und der Checkout 32,95 $ sagt, fühlt sich der Käufer nicht glücklich, sondern reingelegt.
Deshalb bildet der Warenkorb die Regel nach und zeigt dieselbe Rechnung, bevor jemand die Seite verlässt: was gratis ist, was noch fehlt, um die nächste freie Position freizuschalten, und wie hoch die Summe sein wird. Die Leiter ist sichtbar, während der Warenkorb gefüllt wird, statt am Ende als Überraschung aufzutauchen. Sie sagt dem Käufer außerdem die Wahrheit, und das ist die einzige Version eines Rabatts, die den Kontakt mit einer Checkout-Seite übersteht.
Warum du das wahrscheinlich nicht selbst baust
Das sieht nach einem kleinen Feature aus und ist es nicht. Die Seite hat kein Admin-Panel, kein CMS und keine Plugins: Jede Seite wird vorab erzeugt und als reines HTML hochgeladen. Ein Warenkorb, der nur im Browser existiert, muss Summe, Lizenz und Checkout in Übereinstimmung halten, ohne dass ein Server schlichtet.
Auf der Seite von BeatStars wird es schlimmer. BeatStars dokumentiert keine Warenkorb-API, also habe ich die drei Aufrufe dahinter im eigenen Frontend gefunden und einzeln getestet. Jede Position braucht die Track-ID und die Contract-ID der Lizenz, weil der Preis im Vertrag lebt und nicht im Beat. Eine Lizenz, die der Shop für einen Track deaktiviert hat, lässt den ganzen Checkout scheitern, also muss der Fehler mit dem Namen des Beats zurückkommen, der ihn ausgelöst hat, statt mit einem leeren Bildschirm.
Dann ist da der Teil, den niemand sieht: die Rabattleiter nachbilden, bevor der Käufer die Seite verlässt, damit die Summe hier und die Summe im Checkout dieselbe Zahl sind. BeatStars wendet seine Gratis-Positionen einmal pro Warenkorb an, auf die günstigsten. Mach das falsch, und der Warenkorb ist kein Feature, sondern eine Beschwerde.
Deshalb mieten die meisten Produzenten eine Plattform, statt eine zu bauen. Und deshalb läuft diese Seite auf Hosting, das nicht umkippt: Alles andere ist eine statische Datei, und das einzige bewegliche Teil ist die Plattform, die das Geld nimmt.
Die Seite darunter
Nichts davon würde ein WordPress mit fünfzehn Plugins überleben. Der Shop ist eine statische Seite: 430 Seiten, vorab gebaut, ein Stylesheet und ein wenig JavaScript für den Player und den Warenkorb. Wenn ein Besucher landet, wird keine Datenbank um irgendetwas gebeten.
Das Audio folgt derselben Idee: HE-AAC mit 56 kbps statt einer 320-kbps-MP3, mit dem Index am Anfang der Datei, damit die Wiedergabe starten kann, bevor der Beat heruntergeladen ist, und einem Cache-Header, der ihn ein Jahr auf dem Rechner des Besuchers hält.
Was ein Hoster danach tun muss, ist wenig, aber er muss es gut tun: Dateien schnell ausliefern, Byte-Ranges und Cache-Header respektieren, SSL und HTTP/2 mitbringen. Auf so einem läuft diese Seite. Wenn du dieselbe Basis unter deinem Shop willst, ist das das einzige Stück, das du wirklich mieten musst.
Schau dir das Hosting an, das ich nutze
Wenn du auf einer anderen Plattform verkaufst
Dieser konkrete Trick ist BeatStars, weil dort meine Lizenzen und meine Käufer sind. Die Logik reist mit: Jeder Shop, der einen Warenkorb-Endpunkt anbietet, lässt sich auf dieselbe Weise von einer statischen Seite aus steuern. Was nicht mitreist, ist die Abkürzung. Ein Warenkorb ist kein Button mit der Aufschrift "in den Warenkorb", sondern ein Preis, der passt, eine Lizenz, die passt, und ein Checkout, der sich mit genau dem öffnet, was der Käufer gewählt hat.
Wenn du noch einen Beat pro Checkout verkaufst, fang mit dem Katalog und den Lizenzen an und baue dann den Warenkorb. Der komplette Beat-Katalog ist hier, und wenn du hören willst, um welche Art Beat dieser Shop gebaut ist, fang mit diesem Boom-Bap-Instrumental an.
Häufige Fragen
Brauche ich einen Entwickler, um einen Warenkorb in meinen Beat-Shop zu bekommen?
Für eine statische Seite ja, etwas Code. Die Aufrufe sind drei Mutationen gegen den Warenkorb-Endpunkt des Shops, der Rest ist Browser-Zustand, aber jemand muss es schreiben und jede Lizenzstufe gegen die Summe im Checkout testen.
Funktioniert der Warenkorb, wenn der Käufer seine Meinung zur Lizenz ändert?
Ja. Jede Position trägt ihre eigene Lizenz, und sie lässt sich direkt im Warenkorb wechseln. Der Warenkorb erlaubt denselben Beat nicht zweimal, also ersetzt ein Lizenzwechsel die Position, statt eine zweite hinzuzufügen.
Wo findet die Zahlung statt?
Immer bei BeatStars. Die Seite baut nur den Warenkorb und öffnet den Checkout damit. Karten, Rechnungen, Auslieferung und das Lizenz-PDF bleiben in der Plattform.
Warum nicht direkt auf der Seite verkaufen?
Weil die Seite dann einen Zahlungsanbieter, Steuerabwicklung, Rechnungen und eine Kundendatenbank bräuchte. Ein statischer Katalog mit einem Warenkorb, der an die Plattform übergibt, hält den schnellen Teil schnell und lässt den Geldteil denen, die ihn ohnehin legal machen.
