Kontaktformular für Eleventy
Eleventy erzeugt statische Seiten und führt nach dem Build keinen Code mehr aus. Das Annehmen eines abgeschickten Formulars übernimmt FormPost und schickt Ihnen die Eingaben per E-Mail.
Vorbereitung: Formular bei FormPost anlegen
Melden Sie sich bei FormPost an, legen Sie ein Formular an und tragen Sie die Domain ein, unter der Ihre Seite erreichbar ist. Danach zeigen wir Ihnen die Adresse Ihres Formulars. Sie ersetzt https://www.formpost.eu/f/abc123 im Code unten – sonst ist nichts anzupassen.
1. Das Formular als Include anlegen
Eleventy sucht Includes standardmäßig im Ordner _includes. Legen Sie das Formular dort als reine HTML-Datei ab.
<form action="https://www.formpost.eu/f/abc123" method="POST">
<label for="email">E-Mail</label>
<input type="email" id="email" name="email" required>
<label for="message">Nachricht</label>
<textarea id="message" name="message" required></textarea>
<input type="text" name="_gotcha" style="display:none;" tabindex="-1" autocomplete="off">
<button type="submit">Absenden</button>
</form>
2. Das Include in eine Seite setzen
Binden Sie das Formular in Ihrer Kontaktseite mit einer Zeile ein. Die Anführungszeichen um den Dateinamen sind nötig.
{% include "contact-form.html" %}
Gut zu wissen
- Markdown-Dateien verarbeitet Eleventy standardmäßig zuerst mit Liquid. Die include-Anweisung funktioniert deshalb in .md-Dateien genauso wie in Nunjucks- oder Liquid-Vorlagen.
- Übermittlungen nehmen wir nur von der eingetragenen Domain an. Vom lokalen Server (eleventy --serve auf localhost) aus werden sie abgelehnt; zum Ausprobieren gibt es das Testformular im Kundenbereich.
- Das Formular bringt kein eigenes CSS mit und übernimmt die Gestaltung Ihrer Seite. Klassen und weitere Felder können Sie im Include frei ergänzen.
Was FormPost heute nicht kann
- Formulare werden klassisch abgeschickt, also mit einem Seitenwechsel. Ein Versand per JavaScript im Hintergrund wird derzeit nicht unterstützt.
- Dateianhänge nehmen wir nicht entgegen.
- FormPost holt keine Einwilligung Ihrer Besucher ein. Der Hinweis in Ihrer Datenschutzerklärung bleibt Ihre Aufgabe – den Textbaustein dafür finden Sie fertig formuliert bei Ihrem Formular.
Weitere Anleitungen und Vergleiche
Formular anlegen und ausprobieren
Der Free-Tarif reicht für ein Formular mit zehn Benachrichtigungen am Tag und kostet dauerhaft nichts.