IBAN-Widget integrieren
Das fertige Mini-Widget lässt sich per <div data-iban-rechner data-mode="…"></div> plus embed.js einbinden – ohne eigenes UI zu bauen. Alternativ steht ein iframe-Widget (widget.html) für Umgebungen ohne eigenes JavaScript zur Verfügung.
| Einbindung | <div data-iban-rechner data-mode="…"> + embed.js |
|---|---|
| Modi | validate, build, lookup |
Für eine schnelle Einbindung ohne eigenes UI markiert man ein <div>-Element mit dem Attribut data-iban-rechner und lädt anschließend embed.js. Der Modus wird über das Attribut data-mode gesteuert und kann die Werte validate (IBAN validieren), build (IBAN aus BLZ + Kontonummer berechnen) oder lookup (BIC-Suche zu BLZ oder IBAN) annehmen.
Beispiel: <div data-iban-rechner data-mode="validate"></div>, gefolgt von <script src="embed.js"></script>. Das Widget rendert daraufhin automatisch ein beschriftetes Eingabefeld mit Ergebnisanzeige in das markierte Element.
Wer kein eigenes JavaScript auf der Zielseite einbinden möchte – etwa in einem CMS mit strikter Content-Security-Policy –, kann stattdessen widget.html per <iframe> einbetten, wobei der Modus über den Query-Parameter ?mode= gesteuert wird, zum Beispiel <iframe src="widget.html?mode=validate" width="420" height="140"></iframe>.
Zur Wahl zwischen embed.js und embed-branded.js: Beide Dateien sind funktional identisch; embed-branded.js ergänzt zusätzlich einen dezenten Herkunftshinweis im Widget (siehe der eigene Ratgeber „IBAN-SDK verwenden" zur Funktions-API und der Widget-Konfigurator auf api.html für eine direkte Vorschau beider Varianten).
Passende Tools
- IBAN-Rechner – Kostenloser IBAN-Rechner: IBAN prüfen, aus BLZ und Kontonummer berechnen, Bank per BIC-Suche finden.
Häufige Fragen
validate (IBAN validieren), build (IBAN berechnen) und lookup (BIC-Suche).
Ja, widget.html lässt sich per iframe einbetten, Modus über den Query-Parameter ?mode=.
Quellen
Repository-Quelle: public/iban-core.js, public/embed.js, public/embed-branded.js, public/widget.html, public/api.html, routes/api.js, server.js (Stand dieser Sitzung, live gegen den tatsaechlichen Code geprueft).