Wszystkie wpisy

Jak dodać działający formularz kontaktowy do statycznej strony z AI

Poprosiłeś AI o formularz kontaktowy i dostałeś ładny formularz z polami imię, e-mail i wiadomość. Ale gdy ty albo odwiedzający klikacie „Wyślij”, nic się nie dzieje albo pojawia się błąd. To nie wina AI. Tak po prostu działają strony statyczne, a poniżej pokazujemy, jak to porządnie naprawić.

Dlaczego statyczny formularz sam nie działa

Strona statyczna to same pliki HTML, czyli dokładnie to, co generują narzędzia AI. Nie stoi za nią serwer, który mógłby odebrać wysłany formularz, zapisać go i przesłać ci mailem. Formularz wygląda dobrze, ale przycisk „Wyślij” nie ma dokąd wysłać danych. Żeby formularz naprawdę działał, po drugiej stronie musi być coś, co go obsłuży.

Kiedyś oznaczało to pisanie kodu po stronie serwera (PHP, Node itp.) i utrzymywanie serwera. Dla osoby nietechnicznej to ogromny skok. Dziś rozwiązaniem jest usługa odbierająca formularze (tzw. form endpoint), która zrobi tę część za ciebie.

Proste rozwiązanie: adres odbierający formularz

Form endpoint to adres internetowy, który przyjmuje dane z formularza, zapisuje je i powiadamia cię, a ty nie musisz prowadzić żadnego serwera. Kierujesz formularz na ten adres i wszystko działa. Wiele hostingów ma to w pakiecie. Na Hostilo każda strona ma wbudowany odbiór formularzy, więc nie potrzebujesz osobnej usługi.

Krok po kroku

1. Weź gotowy kod formularza

Skopiuj formularz, który wysyła dane na adres odbiorczy i zawiera unikalny token twojej strony. Wygląda tak:

<form action="https://hostilo.app/api_form.php" method="POST">
  <input type="hidden" name="site_token" value="TWOJ_UNIKALNY_TOKEN">
  <input type="email" name="email" required>
  <textarea name="message" required></textarea>
  <button type="submit">Wyślij</button>
</form>

2. Wstaw swój token

Pole site_token łączy wiadomości z twoją stroną. Gotowy kod z wpisanym tokenem znajdziesz w edytorze strony, w zakładce Ustawienia. To jedyny element, który sprawia, że formularz jest twój.

3. Wklej formularz na stronę

Wstaw formularz w dowolnym miejscu kodu HTML, w którym ma się pojawić, a potem zapisz i opublikuj. Gotowe: formularz jest online i działa.

Wskazówka

Jeśli AI już zaprojektowało ci ładny formularz, możesz zostawić jego wygląd. Upewnij się tylko, że atrybut action wskazuje adres odbiorczy, a formularz zawiera ukryte pole site_token.

Gdzie trafiają wiadomości?

Gdy ktoś wypełni formularz, wiadomość przychodzi do ciebie mailem i zapisuje się w panelu, więc masz ją nawet wtedy, gdy mail gdzieś zginie. Nie musisz sprawdzać osobnej usługi: wszystko jest w jednym miejscu.

A co ze spamem?

Publiczne formularze przyciągają boty spamerskie. Dobry odbiornik formularzy ma pułapkę (honeypot): niewidoczne pole, którego ludzie nigdy nie wypełniają, a boty tak. Gdy pułapka jest wypełniona, wiadomość jest po cichu odrzucana. To blokuje większość automatycznego spamu i nie męczy prawdziwych gości captchą.

Najczęstsze pytania

Czy muszę umieć programować, żeby dodać działający formularz?
Nie. Wklejasz gotowy kod i dodajesz swój token. Bez backendu, bez serwera, bez pisania kodu.

Czy mogę zmienić wygląd formularza?
Tak. To zwykły HTML: ostyluj go jak chcesz albo zostaw projekt od AI. Muszą zostać tylko adres w action i ukryte pole z tokenem.

Czy dostanę wiadomości mailem?
Tak. Wiadomości przychodzą mailem, a dodatkowo zapisują się w panelu jako kopia.

Jak jest obsługiwany spam?
Wbudowane pole-pułapka automatycznie wyłapuje i blokuje większość botów, więc captcha nie jest potrzebna.

Gotowy, żeby opublikować swoją stronę z AI?

Wklej kod z ChatGPT albo Claude, kliknij Zapisz i w kilka sekund masz działający link z HTTPS. Za darmo, bez karty płatniczej.

Opublikuj stronę za darmo

Więcej z bloga