Benötige ich eine Astro-Integration oder einen Server-Adapter?

Nein. Das Formular sendet direkt an Formhook, also funktioniert es mit der standardmäßigen statischen Astro-Ausgabe. Kein SSR-Modus, kein @astrojs/node-Adapter erforderlich.

Kann ich mehrere Kontaktformulare auf verschiedenen Astro-Seiten haben?

Ja. Erstellen Sie ein Formhook-Formular pro Anwendungsfall - Kontakt, Bewerbungen, Newsletter - und fügen Sie das action jedes Formulars in die richtige .astro-Seite ein. Die kostenlose Stufe deckt fünf Formulare ab.

Wie zeige ich nach dem Senden eine Dankesseite?

Fügen Sie ein verstecktes _redirect-Input hinzu, das auf Ihre Astro-Dankes-Route zeigt. Die URL muss in der Allowed-Origins-Liste des Formulars stehen. Oder, wenn Sie lieber Inline-Erfolg ohne Seiten-Reload zeigen, verwenden Sie das fetch-Muster aus der Next.js- oder SvelteKit-Anleitung.

← Alle Anleitungen

Anleitung

Astro-Kontaktformular (kein Backend nötig)

Astro rendert standardmäßig zu statischem HTML, was bedeutet, dass ein Astro-Kontaktformular einfach ein normales HTML-Formular mit dem richtigen action-Attribut ist. Sie benötigen keinen Server-Endpoint oder eine Astro-Integration - fügen Sie das Snippet in eine .astro-Seite ein und Sie sind fertig.

Das Snippet

contact.Astro

---
// src/pages/contact.astro
---

<form action="https://formhook.app/f/YOUR_API_KEY" method="POST">
  <label>
    Email
    <input type="email" name="email" required />
  </label>

  <label>
    Message
    <textarea name="message" required></textarea>
  </label>

  <input type="text" name="_gotcha" tabindex="-1" autocomplete="off" hidden />
  <input type="hidden" name="_redirect" value="/thanks" />

  <button type="submit">Send</button>
</form>

So funktioniert es

Da Astro standardmäßig statisches HTML ausliefert, gibt es nichts Client-seitiges zu verkabeln. Das action des Formulars POSTet direkt an formhook.app/f/YOUR_API_KEY, wobei YOUR_API_KEY aus den Einstellungen Ihres Formulars im Formhook-Dashboard stammt. Das _gotcha-Feld ist ein Honeypot - Bots füllen es aus, Menschen sehen es nicht, und alles mit Inhalt dort wird stillschweigend verworfen. Das _redirect-Feld schickt Nutzer nach erfolgreichem POST zu einer Dankesseite, und die URL wird gegen Ihre Allowed-Origins-Liste validiert.

Was als Nächstes passiert

Einsendung erscheint innerhalb einer Sekunde in Ihrem Formhook-Dashboard.
Push-Benachrichtigung wird auf allen Geräten ausgelöst, auf denen Sie sie aktiviert haben.
Antworten Sie direkt aus dem Dashboard (Pro und höher), ohne Ihre echte E-Mail-Adresse preiszugeben.

Veröffentlichen Sie heute Ihr Astro-Kontaktformular.

Kostenlos registrieren, Formular erstellen, API-Schlüssel einfügen. Fünf Minuten.

Kostenlos starten

Kostenlose Stufe: 5 Formulare · 250 Einsendungen/Monat · Keine Kreditkarte.

Astro-Kontaktformular - FAQ

Benötige ich eine Astro-Integration oder einen Server-Adapter?: Nein. Das Formular sendet direkt an Formhook, also funktioniert es mit der standardmäßigen statischen Astro-Ausgabe. Kein SSR-Modus, kein @astrojs/node-Adapter erforderlich.
Kann ich mehrere Kontaktformulare auf verschiedenen Astro-Seiten haben?: Ja. Erstellen Sie ein Formhook-Formular pro Anwendungsfall - Kontakt, Bewerbungen, Newsletter - und fügen Sie das action jedes Formulars in die richtige .astro-Seite ein. Die kostenlose Stufe deckt fünf Formulare ab.
Wie zeige ich nach dem Senden eine Dankesseite?: Fügen Sie ein verstecktes _redirect-Input hinzu, das auf Ihre Astro-Dankes-Route zeigt. Die URL muss in der Allowed-Origins-Liste des Formulars stehen. Oder, wenn Sie lieber Inline-Erfolg ohne Seiten-Reload zeigen, verwenden Sie das fetch-Muster aus der Next.js- oder SvelteKit-Anleitung.

Anleitungen für andere Frameworks

Migrating from Formspree? See how Formhook compares.