Prompt dla Lovable i Bolt
Wklej ten prompt do Lovable lub Bolt. Prosi o formularz kontaktowy wysyłający zgłoszenia do Formgong i zabrania dodawać bazę albo usługę e-mail.
Co kopiujesz
Ten szablon to prompt dla Lovable albo Bolt. Wklejasz go w czat kreatora. Kreator pisze formularz. Formgong odbiera wysłanie.
Prompt nazywa endpoint, publiczny klucz dostępu, _lang, honeypot i sprawdzenie sukcesu. Mówi kreatorowi, żeby nie dodawał backendu.
Mówi też, żeby nie dodawać Resend, bazy, funkcji edge ani server action dla tego formularza. To częste objazdy w wygenerowanych aplikacjach.
Dodatkowy blok to zwykły HTML zgodny z promptem. Weź go, jeśli wolisz wkleić znaczniki, niż prosić kreatora, żeby je napisał.
Dłuższe instrukcje właśnie dla Lovable i właśnie dla Bolt już są. Ta strona to krótki prompt. Tamte strony wyjaśniają kliknięcia wokół niego.
Co sprawdzić w zmianach
Formularz powinien wysyłać na /submit adresu bazowego Formgong. Jeśli widzisz nową tabelę, sekret albo SDK poczty, poproś kreatora, żeby to usunął.
Klucz dostępu w prompcie to fk_your_access_key, dopóki nie utworzysz formularza. Zastąp go albo użyj przycisku na tej stronie po zalogowaniu.
Nazwy pól mają zostać name, email i message, a phone ma być opcjonalny. Telegram wypisuje te nazwy. Pole o zmienionej nazwie trudniej przejrzeć.
botcheck ma być obecny, pusty i ukryty. Jeśli kreator usunie go jako nieużywany, włóż go z powrotem. To honeypot.
Fetch powinien wysyłać Accept: application/json. Treść JSON potrzebuje też Content-Type: application/json. FormData nie powinien ustawiać tego nagłówka.
Prompt mówi, żeby pominąć Turnstile, dopóki nie podasz klucza witryny. Nie pozwól, żeby kreator wymyślił klucz.
Prompt mówi, żeby nie ładować fontu od strony trzeciej dla formularza. Jeśli aplikacja już ma font, formularz może go odziedziczyć.
Gdy kreator skończy
Opublikuj albo użyj podglądu kreatora, jeśli ma dostęp do internetu, i wyślij test. Potem otwórz skrzynkę Formgong.
Podłącz Telegram w ustawieniach formularza, żeby dostarczenie było natychmiastowe. W darmowym planie e-mail to dzienny przegląd.
Darmowy plan trzyma 300 zgłoszeń miesięcznie przez 30 dni, w UE. Spam jest zapisywany, nie jest dostarczany i nie wlicza się do limitu.
Ustawienia takie jak odbiorcy i Telegram są w Formgong. Możesz je zmienić, nie prosząc kreatora o ponowne wygenerowanie formularza.
Operatorem jest Formgong. Jeśli produkt działa nie tak, jak powinien, napisz na support@formgong.com. Konto w kreatorze to osobna ścieżka wsparcia.
Podgląd
Kod formularza
Dodaj do tego projektu formularz kontaktowy. Zgłoszenia przyjmuje Formgong. Nie dodawaj bazy danych, edge function, server action ani usługi e-mail takiej jak Resend.
Wymagania:
- Zwykły formularz może mieć action="https://formgong.com/submit" i method="POST". Z JavaScript wyślij te same pola na https://formgong.com/submit przez fetch.
- Ukryte pole name="access_key" value="fk_your_access_key". Klucz jest publiczny. Zostaw go we frontendzie. Nie przenoś go do sekretu.
- Ukryte pole name="_lang" value="{lang}". Formgong używa go do strony podziękowania i tekstu błędu. Na stronie wielojęzycznej wstaw język strony.
- Pola: name, email z type="email" i message. Wszystkie trzy są wymagane. phone jest opcjonalny. Nie zmieniaj nazw pól. Telegram drukuje nazwę pola pogrubieniem nad odpowiedzią.
- Honeypot: pole type="text" name="botcheck" tabindex="-1" autocomplete="off" w opakowaniu z aria-hidden="true". Ukryj je CSS-em: position:absolute; inset-inline-start:0; top:0; width:1px; height:1px; overflow:hidden; clip-path:inset(50%). Nie wypełniaj go.
- Sukces fetch: nagłówek Accept: application/json. Dla treści JSON dodaj Content-Type: application/json. Dla FormData nie ustawiaj Content-Type. Jeśli w JSON pole success ma wartość true, pokaż krótkie podziękowanie i wyczyść formularz. W przeciwnym razie pokaż komunikat z odpowiedzi.
- Turnstile tylko wtedy, gdy podano klucz witryny: script src="https://challenges.cloudflare.com/turnstile/v0/api.js" i div z class="cf-turnstile" oraz data-sitekey. W przeciwnym razie pomiń.
- Nie ładuj fontu od strony trzeciej. Nie dodawaj przesyłania plików.
- Pochodzenie endpointu: https://formgong.com.Zwykły HTML, o który prosi prompt
<form action="https://formgong.com/submit" method="POST" style="position:relative"> <input type="hidden" name="access_key" value="fk_your_access_key"> <input type="hidden" name="_lang" value="pl"> <label>Imię <input type="text" name="name" autocomplete="name" required></label> <label>E-mail <input type="email" name="email" autocomplete="email" required></label> <label>Telefon <input type="tel" name="phone" autocomplete="tel"></label> <label>Wiadomość <textarea name="message" required></textarea></label> <div aria-hidden="true" style="position:absolute;inset-inline-start:0;top:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)"> <label>Pozostaw to pole puste <input type="text" name="botcheck" tabindex="-1" autocomplete="off"></label> </div> <!-- Opcjonalnie. Włącz Turnstile dla tego formularza, usuń te znaczniki komentarza i wklej klucz witryny. <script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer></script> <div class="cf-turnstile" data-sitekey="YOUR_TURNSTILE_SITE_KEY" data-language="pl"></div> --> <button type="submit">Wyślij</button> </form>
Pytania i odpowiedzi
Czy ten prompt działa i w Lovable, i w Bolt?
Tak. Nie zależy od jednego układu plików. Jeśli kreator wybierze React, Vue albo zwykły HTML, endpoint i pola zostają te same.
Kreator dodał Supabase albo Resend. Co dalej?
Poproś, żeby usunął ten kod i zostawił tylko wysłanie do Formgong. Powiązane strony Lovable i Bolt opisują tę samą poprawkę dokładniej.
Czy klucz dostępu w prompcie jest bezpieczny?
To klucz publiczny. Każdy może wysłać nim zgłoszenie. Nie da się nim odczytać twojej skrzynki ani zmienić, dokąd idzie poczta.
Gdzie są dłuższe instrukcje?
Na stronach Lovable i Bolt w dziale Dla, do których prowadzi link z tej strony. Ten szablon to sam prompt, a nie zamiennik tamtych instrukcji.