Formular in Lovable

Der Prompt enthält bereits den Schlüssel, den Endpoint und den Honeypot. Fügen Sie weder Supabase noch einen Resend-Aufruf hinzu. Lovable sollte kein Backend erstellen.

1. Holen Sie sich auf der Startseite einen Zugriffsschlüssel.
2. Öffnen Sie das Lovable-Projekt.
3. Fügen Sie den folgenden Prompt ein.
4. Senden Sie eine Test-Einsendung und öffnen Sie diese im Formgong-Dashboard.
5. Verbinden Sie Telegram über die Formulareinstellungen.

Prompt

Füge ein Kontaktformular hinzu, das Anfragen an Formgong sendet. Erstelle kein Backend, keine Datenbank und keine Secrets.

- POST https://formgong.com/submit
- Verstecktes Feld access_key mit dem Wert fk_your_access_key (der Schlüssel ist öffentlich und gehört in den Frontend-Code)
- Felder: name, email, optional phone, message. Beschriftungen auf Deutsch
- Honeypot: Textfeld botcheck, per CSS außerhalb des sichtbaren Bereichs (position:absolute; left:-10000px), tabindex="-1", autocomplete="off"
- Keine Datei-Uploads und keine Serverfunktionen, kein Resend
- Normales HTML-Formular (method="POST" action="https://formgong.com/submit") oder fetch mit Content-Type application/json und Accept: application/json. Erfolg bedeutet json.success === true
- Nach Erfolg eine Danke-Meldung anzeigen

fetch

async function onSubmit(event) {
  event.preventDefault();
  const fields = Object.fromEntries(new FormData(event.currentTarget));
  const response = await fetch("https://formgong.com/submit", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      Accept: "application/json",
    },
    // _lang: language of Formgong messages and the autoreply (multilingual site: document.documentElement.lang).
    body: JSON.stringify({ _lang: "de", ...fields, access_key: "fk_your_access_key" }),
  });
  const result = await response.json();
  if (!result.success) throw new Error(result.message || "Das Senden ist fehlgeschlagen. Bitte versuchen Sie es erneut.");
  return result.message; // localized "Sent. Thank you!"
}

Schlüssel holen