Ratgeber · 6 Min. Lesezeit
Bestellformulare mit Live-Summe: so bauen Sie eines
Aktualisiert 2026-09-17
Kurz gesagt
Ein Bestellformular mit Live-Summe nutzt Zahlenfelder für Menge und Preis pro Artikel, ein berechnetes Feld, das sie beim Eintippen summiert, und eine klare Formatierung, damit die laufende Summe wie Geld aussieht, nicht nur wie eine Zahl.
Ein Bestellformular ohne sichtbare laufende Summe zwingt Menschen, im Kopf zu rechnen oder auf eine Bestätigungs-E-Mail zu warten, um zu erfahren, was sie zahlen. Eine Live-Summe beseitigt diese Unsicherheit und fängt Eingabefehler (eine überzählige Null bei der Menge) vor dem Absenden ab, statt danach. Dieser Leitfaden erklärt die Struktur: Felder, die Formel und kleine Details, die die Summe vertrauenswürdig machen.
Erst die Felder strukturieren
Jeder bestellbare Artikel braucht ein Mengenfeld (Zahl) und, falls der Preis variiert, ein Preisfeld oder einen festen Wert, auf den Sie direkt in der Formel verweisen. Halten Sie Menge und Preis als getrennte Felder statt eines kombinierten Textfelds, da ein berechnetes Feld saubere numerische Eingaben braucht.
Für einen festen Artikelkatalog ist ein Auswahlfeld pro Artikel, mit dem Preis in der Option eingebaut, plus ein Mengenfeld meist einfacher, als Menschen zu bitten, Preise selbst einzugeben.
Die berechnete Summe aufbauen
Ein berechnetes Feld kann in einer Formel auf jedes Mengen- und Preisfeld verweisen und die Summe live aktualisieren, während jemand das Formular ausfüllt, noch bevor er zum Absenden kommt. Bei mehreren Positionen multipliziert die Formel die Menge jedes Artikels mit seinem Preis und addiert sie dann zusammen.
Wenn Sie Steuer oder eine pauschale Versandgebühr berechnen, fügen Sie diese als eigenen Schritt in der Formel hinzu, statt sie stillschweigend in eine einzige Zeile einzufalten, damit die Aufschlüsselung nachvollziehbar bleibt, falls Sie einer Kundin oder einem Kunden je eine Summe erklären müssen.
Eine Aufschlüsselung zeigen, nicht nur eine Zahl
Eine einzelne Summe ohne Kontext wirkt willkürlich. Zeigen Sie wo möglich Zwischensumme, Steuer und Versand als separate berechnete Werte, auch wenn nur die Endsumme hervorgehoben ist, damit die Zahl selbsterklärend ist, statt etwas, dem Kundinnen und Kunden blind vertrauen müssen.
Eingabefehler verringern
Zahlenfelder sollten sinnvolle Grenzen erzwingen, etwa ein Minimum von 0 und ein vernünftiges Maximum für die Menge, damit ein Tippfehler nicht stillschweigend eine um den Faktor 100 falsche Summe erzeugt. Pflichtfelder für alles, was in die Summe einfließt, verhindern, dass eine leere Mengenangabe die Berechnung zerstört.
Was nach dem Absenden passiert
Ein Bestellformular ist selbst kein Zahlungsabwickler; es erfasst meist die Bestelldetails und die Summe und leitet dann entweder zur Kasse weiter oder sendet die Details an denjenigen, der die Bestellung ausführt (per E-Mail-Benachrichtigung oder Webhook an ein anderes System). Setzen Sie in der Erfolgsmeldung klare Erwartungen, damit Menschen wissen, was als Nächstes passiert, sei es eine Rechnung, ein Zahlungslink oder ein Bestätigungsanruf.
In YeetForm aktualisieren berechnete Felder Summen live, während jemand Mengen und Preise einträgt, mit einer Formel, die direkt auf die anderen Felder verweist, und ein Webhook kann die abgeschlossene Bestellung nach dem Absenden an ein anderes System weiterleiten.