Utwórz formularz kontaktowy za pomocą HTML i PHP

Formularz kontaktowy jest bardzo istotną częścią każdej strony internetowej. Odwiedzający witrynę muszą komunikować się z właścicielem witryny w różnych celach. Korzystając z formularza kontaktowego, odwiedzający wysyłają wiadomości do administratora lub właściciela witryny za pomocą danych kontaktowych. Administrator lub właściciel witryny może odpowiedzieć odwiedzającym po przeczytaniu i rozważeniu znaczenia ich wiadomości. Możesz utworzyć formularz kontaktowy dla dowolnej witryny na różne sposoby. Jak utworzyć prosty formularz kontaktowy i responsywny formularz kontaktowy za pomocą HTML, CSS, Bootstrap i PHP, pokazano w tym samouczku.

Prosty formularz kontaktowy

W tej części samouczka pokazano sposób zaprojektowania prostego formularza kontaktowego za pomocą HTML, CSS i PHP.

Kod HTML i CSS:

Utwórz plik PHP o nazwie simple_contact_form.php z następującym skryptem do wyświetlenia formularza kontaktowego za pomocą tylko HTML i CSS. Skrypt PHP zostanie dodany później, aby potwierdzić formularz i wyświetlić przesłane dane formularza.

FORMULARZ KONTAKTOWY

Nazwa


E-mail


Wiadomość

Teraz uruchom simple_contact_form.php Plik z serwera. Następujące dane wyjściowe pojawi się po wykonaniu skryptu.

Odczytaj, sprawdzaj i wydrukuj dane z formularza za pomocą PHP

Teraz dodaj następujący skrypt PHP na początku prostego_contact_form.plik PHP w celu potwierdzenia danych formularza, odczytania danych formularza i wydrukowania danych w przeglądarce. Kiedy użytkownik kliknie przycisk Prześlij, wówczas dane z formularza zostaną sprawdzone pod kątem sprawdzania poprawności za pomocą skryptu PHP. Jeśli przesłane dane zostaną sprawdzone, dane zostaną wydrukowane w przeglądarce.

Kod PHP:

Dodaj następujący kod PHP na początku simple_contact_form.php plik.

$ name = "";
$ nameerr = "";
$ e -mail = "";
$ e -mailerr = "";
$ message = "";
$ messageerr = "";
$ error = false;
/ * Sprawdź wymagane pola */
if (isset ($ _ Post ['prześlij'])))

$ name = $ _post ['name'];
$ e -mail = $ _POST ['e -mail'];
$ message = $ _POST ['message'];
if ($ name == "")

$ nameerr = "pole nie może być puste.";
$ error = true;

w przeciwnym razie if (Strlen ($ name) < 3)

$ nameerr = "Nazwa powinna mieć więcej niż 2 znaki.";
$ error = true;

w przeciwnym razie

$ nameerr = "";

if ($ e -mail == "")

$ e -mailerr = "pole nie może być puste.";
$ error = true;

inaczej, jeśli (!Filter_var ($ e -mail, filtr_Validate_email))

$ e -mailerr = "nieprawidłowy adres e -mail.";
$ error = true;

w przeciwnym razie

$ e -mailerr = "";

if ($ message == "")

$ messageerr = "pole nie może być puste.";
$ error = true;

w przeciwnym razie if (Strlen ($ Message) < 10)

$ messageerr = "wiadomość powinna mieć więcej niż 9 znaków.";
$ error = true;

w przeciwnym razie

$ messageerr = "";

if ($ error == false)

$ name = $ name;
$ do = '[email protected] ';
$ z = $ e -mail;
$ tematy = „zapytanie”;
$ body = 'Hello,

'.$ wiadomość.'

Dzięki,
'.$ nazwa;
echo „to:”.$ do."
Z: ".$ z."
Temat: ".$ Temat."

---

".$ ciało;


Jeśli(!ISSET ($ _ Post ['prześlij']) || $ error == true)

?>

Dodaj następujący kod PHP na końcu simple_contact_form.php plik.

?>

Jeśli formularz zostanie przesłany przez utrzymanie wszystkich pól pustych, wówczas pojawi się następujące dane wyjściowe.

Jeśli formularz zostanie przesłany przez wpisanie mniej niż 9 znaków w polach wiadomości, wówczas pojawi się następujące dane wyjściowe.

Jeśli formularz zostanie przesłany we wszystkich prawidłowych danych, pojawi się następujące dane wyjściowe.

Korzystając z powyższych kodów, możesz łatwo utworzyć bardzo prosty formularz kontaktowy dla Twojej witryny. Ale ten formularz nie jest responsywnym formularzem kontaktowym. Sposób, w jaki reaguje na tę formę, został pokazany w następnej części tego samouczka.

Responsywny formularz kontaktowy

Większość stron internetowych jest teraz zaprojektowana z responsywnymi funkcjami. W tej części samouczka pokazano sposób przekształcenia wcześniej utworzonego prostego formularza kontaktowego w responsywny formularz kontaktowy za pomocą bootstrap.

Kod HTML:

Utwórz plik PHP o nazwie responsive_contact_form.php z następującym skryptem, aby wyświetlić responsywny formularz kontaktowy za pomocą HTML i Bootstrap. Skrypt PHP zostanie dodany później, aby potwierdzić formularz i wyświetlić przesłane dane formularza.

>