Rozdział 4 · Zadanie 3

Podłączamy formularz do serwisu

Trzy zmiany w tagu

— i przycisk «Wyślij» naprawdę działa.

Zadanie

Weź formularz z Rozdziału 2 (lekcje 10, 25) i zaktualizuj tag <form> wokół niego:

about-me.html
<form action="https://api.web3forms.com/submit" method="POST">
  <input type="hidden" name="access_key" value="TWÓJ_KLUCZ_TUTAJ">

  <input type="text" name="name" class="field" placeholder="Twoje imię">
  <textarea name="message" class="field" placeholder="Twoja wiadomość" rows="4"></textarea>
  <button type="submit" class="btn">Wyślij</button>
</form>
  
Jak to czytać

action="https://api.web3forms.com/submit" — dokąd wysłać dane formularza (zamiast «nigdzie»).

method="POST" — sposób wysyłania danych (standard dla formularzy, które coś zmieniają lub wysyłają).

<input type="hidden" name="access_key" value="..."> — ukryte pole z twoim kluczem z zadania 2. Użytkownik go nie widzi, ale serwis dzięki niemu wie, komu przesłać wiadomość.

name="name" i name="message" — każde pole ma teraz atrybut name. To podpis, pod jakim wartość pola przyjdzie w mailu (bez niego serwis nie będzie wiedział, jak nazwać dane).

Sprawdź

Wypełnij formularz na swojej stronie i kliknij «Wyślij» — po kilku sekundach mail powinien przyjść na adres, który podałeś w Web3Forms.

Kurs powstał dzięki wsparciu biura rachunkowego Galakton, Białystok, Polska