Toimii ist im Soft Launch gestartet — diese Anleitungen beschreiben also einen Dienst, für den Sie sich schon heute registrieren und den Sie sofort nutzen können. Ein paar Teile sind noch unterwegs: Die Apps für iOS und Android erscheinen im Laufe des Jahres 2026.

Kontaktformular für Ihre statische Website: Astro, Hugo, 11ty, Jekyll

Ein Snippet in Ihrer Layout-Vorlage. Funktioniert mit Astro, Hugo, 11ty, Jekyll und jedem anderen Static-Site-Generator.

<script src="https://cdn.toimii.io/components/your-code.js" async></script>
<toimii-your-code></toimii-your-code>

Funktioniert das wirklich?

Ja — und statische Websites sind der unkomplizierteste Fall. Keine Plugin-Sandbox, kein Editor, der Scripts entfernt, keine Plan-Einschränkungen. Die zwei Zeilen werden genauso in Ihre Layout-Vorlage eingefügt wie in jede andere HTML-Datei.

Schritt für Schritt

Layout-Vorlage öffnen

Öffnen Sie die Vorlage, die jede Seite umschließt — diejenige, die Ihren <body>-Tag bereits enthält.

Embed-Code einfügen

Fügen Sie die zwei Zeilen von der Seite Ihrer Komponente in Toimii innerhalb von <body> ein. Wenn das Formular nur auf bestimmten Seiten erscheinen soll, umschließen Sie beide Zeilen mit der Bedingung Ihres Generators — Script und Tag gehören zusammen.

Bauen und veröffentlichen

Bauen und veröffentlichen Sie wie gewohnt. Öffnen Sie dann die veröffentlichte Seite und senden Sie eine Testnachricht.

Fallstricke

Setzen Sie den Tag in eine Vorlage, nicht in eine Markdown-Inhaltsdatei. Ob rohes HTML Markdown übersteht, ist eine generatorspezifische Einstellung — in Hugo braucht es dafür markup.goldmark.renderer.unsafe —, während eine Vorlage gar nicht erst durch Markdown läuft.
Astro bündelt Script-Tags, deren einziges Attribut src ist. Unser Tag trägt zusätzlich async, und jedes weitere Attribut neben src sorgt dafür, dass Astro den Tag in Ruhe lässt — er funktioniert also genau so, wie er dasteht. Sollten Sie ihn je auf src allein kürzen, fügen Sie is:inline hinzu.
Statische Hosts fügen standardmäßig keine Content-Security-Policy hinzu. Wenn Sie selbst eine setzen — als HTTP-Response-Header oder als <meta>-Tag —, erlauben Sie cdn.toimii.io in script-src und api.toimii.io in connect-src.

Häufig gefragt

Wie füge ich es in Astro, Hugo, 11ty oder Jekyll hinzu?

Es gibt keinen Unterschied zwischen ihnen — die Schritte oben sind in allen vieren das gesamte Vorgehen. Einen Dateipfad für die Vorlage nennen wir bewusst nicht: Jeder Generator benennt diese Datei anders, und die Namen haben sich zwischen den Versionen geändert — sehen Sie deshalb in der Dokumentation Ihres eigenen Generators nach.

Funktioniert es auf GitHub Pages, Netlify, Vercel oder Cloudflare Pages?

Ja, und bei jedem anderen Anbieter, der statische Dateien ausliefert — auf Ihrer Seite läuft nichts. Wichtiger als der Anbieter ist die Adresse: Einsendungen werden nur von der Domain akzeptiert, die Sie in Toimii hinterlegt haben. Ein Vorschau-Build auf der eigenen Subdomain des Anbieters rendert das Formular also, weist die Nachricht aber ab.

Verlangsamt es meinen Build?

Nein. Das Script wird zur Laufzeit geladen, nicht zur Build-Zeit — Ihr Build gibt das Script-Tag aus, und der Browser lädt die eigentliche Komponente, wenn ein Besucher die Seite aufruft. Astro, Hugo, 11ty, Jekyll: alle bleiben unbeeinträchtigt.

Einbetten auf einer anderen Plattform?

Dieselben zwei Codezeilen, für jede Plattform einzeln erklärt.

WordPress

Benutzerdefinierter HTML-Block, Block-Editor oder Classic Editor. Keine Plugin-Installation. Ein Vorbehalt — Ihre Benutzerrolle benötigt die Berechtigung unfiltered_html.

Vollständige Anleitung lesen

Squarespace

Fügen Sie einen Code-Block auf einer beliebigen Seite ein. Erfordert einen Plan, dessen Code-Blöcke JavaScript ausführen dürfen.

Vollständige Anleitung lesen

Webflow

Ziehen Sie ein Code-Embed-Element hinein und fügen Sie die zwei Zeilen ein. Benutzerdefinierter Code ist in Webflow eine kostenpflichtige Funktion — das ist die einzige Bedingung.

Vollständige Anleitung lesen

Wix

Verwenden Sie das Custom Element von Wix: die Script-URL Ihrer Komponente in Server URL, ihren Tag in Tag Name. Die HTML-Einbettung funktioniert nicht — sie ist ein Sandbox-iframe.

Vollständige Anleitung lesen

Shopify

Fügen Sie im Shopify-Theme-Editor einen Custom-Liquid-Bereich hinzu – keine App-Installation, keine Bearbeitung des Theme-Codes. Checkout-Seiten sind die einzige Stelle, an der das nicht geht.

Vollständige Anleitung lesen

HTML / Benutzerdefiniert

Eine einfache HTML-Seite genügt. Öffnen Sie sie in einem beliebigen Texteditor, fügen Sie den Code ein, speichern Sie, laden Sie hoch. Drei Schritte — und Sie sind live.

Vollständige Anleitung lesen

React / Vue / Angular

Verwenden Sie das Custom Element direkt in JSX, Vue-Templates oder Angular-Komponenten. Kein Wrapper, kein zusätzliches Paket.

Vollständige Anleitung lesen

Bereit zum Ausprobieren?

30 Tage kostenlos testen. Keine Kreditkarte. In wenigen Minuten eingerichtet.

Kostenlose Testversion starten

Keine Kreditkarte nötig. In 2 Minuten startklar.