Prawie na każdej stronie internetowej znajduje się formularz kontaktowy. Wykonanie prostego formularza nie należy do zadań trudnych, jednak często przerasta początkujących webmasterów. Przekonuję się o tym prawie codziennie, czytając posty na forum. Postanowiłem napisać i udostępnić za darmo taki skrypt, przy okazji realizując prośbę z Drzewka życzeń.
Wymagania
- serwer z obsługą PHP5
- aktywna funkcja mail() – większość darmowych serwerów nie obsługuje tej opcji, natomiast praktycznie każdy serwer komercyjny ma ją włączoną
- edytor tekstowy – np. darmowy Notepad++
- podstawowa znajomość CSS, żeby nadać odpowiedni wygląd formularzowi
Jeśli masz zamiar wprowadzać zmiany w formularzu i jego działaniu, musisz znać podstawy HTML i PHP.
Sposób użycia
- rozpakuj pliki
- otwórz plik ustawienia.php, musisz podać adres e-mail, na który mają przychodzić maile wysłane ze strony, w tym pliku możesz również ustawić, jakie pola są wymagane oraz treść komunikatów (wszystkie opcje są opisane w komentarzach tego pliku)
- wyślij pliki na serwer do katalogu głównego Twojej strony
- nadaj odpowiedni wygląd formularzowi, używając CSS (szablon znajduje się w pliku formularz.css)
- w miejscu, w którym chcesz umieścić formularz na stronie np. podstrona kontakt.html wstaw kod:
<?php include('mail.php'); ?>
Licencja
Możesz:
- za darmo używać skryptu w projektach niekomercyjnych i komercyjnych (np. na stronach Twoich klientów)
- wprowadzać dowolne zmiany w skrypcie, pamiętając o pozostawieniu danych autora w pliku mail.php, w tej formie, w której są obecnie
Nie możesz:
- sprzedawać, rozdawać, ani dystrybuować tego skryptu jako osobnego produktu, jedyne legalne źródło jego pozyskania to strona Websta.pl
Jeśli potrzebujesz innej wersji formularza, zapraszam Cię do kontaktu przez moją stronę firmową Labsta.com, gdzie możesz złożyć zamówienie na taką jak i inne usługi związane z projektowaniem stron internetowych.
Nie zapomnij zasubskrybować Kanału RSS, żeby zawsze być na bieżąco.
—
Edit:
Ze względu na nieustanne maile, prośby, żądania (!) i wszelkie inne natarczywe formy kontaktu chciałem zaznaczyć, że:
Od teraz przestaje odpowiadać na wiadomości i z automatu usuwam komentarze typu – “Chciałem zrobić z tego ankietę, newsletter, formularz zamówienia itd. Jak mam to zrobić?/Zrób mi to”. Odpowiedź jest zawarta na końcu pkt. Wymagania.
Tagi: CSS, formularz, mail, php, skrypt, webdesign, XHTML, za darmo
Witam,
gratuluje pomysłu na bloga, tym bardziej, że jest on przydatny wielu osobą raczkującym w temacie ;-)
Mam jednocześnie pytanie odnośnie powyższego formularza – umieściłem go na swojej stronie i dość szybko pojawia się na mailu adresata, ale niestety nie widać TREŚCI z formularza. W treści maila pojawia się jedynie od Imie i nazwisko lub nick – czyli kto jest nadawcą tej wiadomości.
Niestety nie jestem w stanie dojść gdzie tkwi błąd, zatem w miarę możliwości proszę o pomoc.
Pozdrawiam,
Jarek
Dzięki za sprawdzenie, mój błąd. Z rozpędu zgubiłem jedną zmienną :). Pobierz jeszcze raz plik.zip i podmień mail.php. Teraz będzie działać :)
Wielkie dzięki !!!!
Już dodałem Cię do moich ulubionych ;-)
Pozdr.
Bardzo fajny i prosty w użyciu formularz – właśnie czegoś takiego szukałem, żeby powoli moje stare rozwiązania wymieniać.
No i podoba mi się idea samego bloga! Będe zaglądał tu częściej.
Zapraszam, postaram się trzymać poziom ;)
Pozdrawiam.
Daj proszę jakieś wskazówki jak przerobić CSS. Skąd mam wiedzieć, który element CSS jest który? Zawsze łapałem się po kodzie html jakie divy są jakie itd.
Będę bardzo wdzięczny za wskazówki bo naprawdę potrzebuję tego formularza.
Pozdrawiam
Tomek
Dlatego w zipie masz czysty arkusz CSS z podstawowymi elementami do ostylowania. Jak podłączysz skrypt to zobaczysz wszystkie div-y. Możesz to zobaczyć jego strukturę w źródle demo: http://demo.websta.pl/formularz/ i w samym arkuszu http://demo.websta.pl/formularz/formularz.css . Mam nadzieję, że to Ci wszystko wyjaśni :)
Dzięki, już załapałem. Jeszcze tylko jedno pytanie. Pole na tresc wyjezdza mi poza div-a bo jest za długie. Które parametry są odpowiedzialne za jego wymiary?
Pewnie chodzi Ci o cols=”27″ rows=”10″ w pliku formularz.php, druga opcja to ustawienia textarea w CSS (to nie jest to samo).
dzieki
nie moge sobie poradzić. pomocy!!! please. na stronie gdzie chce miec formularz umieszczam tylko czy cały kod html formularza?
Przeczytaj jeszcze raz Wymagania i Sposób użycia. Nie wstawiasz, żadnego kodu html formularza, tylko < ?php include('mail.php'); ?> w miejscu gdzie ma się znajdować na stronie.
No właśnie robię jak jest podane ale po wstawieniu tego próbuję w dreamweaverze zrobić podgląd strony i nie pojawia się żaden formularz. Naprawdę strasznie mi zależy zeby to skumać.
Wymagania: (…) serwer z obsługą PHP – co oznacza, że jak nie masz na kompie zainstalowanego serwera, to musisz wrzucić to na swoje konto hostingowe, które obsługuje php.
czyli, że formularz pojawi się na stronie dopiero po wrzuceniu na serwer?
Tak
Witam ponownie,
niespełna 2 tyg. temu pobrałem ten bardzo przydatny mi formularz i umieściłem go na serwerze 000webhost.com, który obsługuje php. Wszystko działało bez zarzutu, wiadomości po kilku sekundach pojawiały się na mailu podanym w ustawieniach. Niestety od wczoraj wiadomości nie dochodzą, a ja nic w międzyczasie nie zmieniałem :-( Wykasowałem cały formularz z serwera, ściągnałem jeszcze raz z bloga, wpisywałem inne adresy mailowe w ustawieniach i to nic nie pomogło.
Czy jest coś jeszcze co mógłbym sprawdzić i mogłoby to sprawić aby to wszystko ponownie działało?
z góry dziękuje za odp.
Ciężko mi coś powiedzieć w przypadku takich serwerów, te firmy pojawiają się i znikają bez ostrzeżenia. Teoretycznie mają włączoną funkcję mail(), ale nigdy nie wiadomo. Raczej nie jest to Twoja wina, ani wina skryptu, lecz serwera (ich strona otwierała mi się prawie 2 minuty z szybkością 954B/s) więc wszystko jest możliwe.
Zrób plik test.php wpisz w nim (podstawa za twoj@adres Twój adres mail):
<?php mail("twoj@adres", "temat", "wiadomosc", "From: adres@mail.com\r\n"); ?>i odpal ten tą stronę z przeglądarki. W ten sposób dowiesz się czy działa ten funkcja mail. Ogólnie to stawiam na to, że mają przeciążone serwery i dlatego Ci nie działa.
Najlepiej jednak mieć komercyjne konto, to naprawdę kosztuje niewiele już od ok. 27z/rok. Przykład: http://www.webmastertalk.pl/-spis-hosting-za-sms-t-60-2.html#pid14024 ( z góry mówię, że nie jestem ich reselerem i ani nie polecam, ani nie nie polecam :) to tylko przykład).
Witam,
Świetny blog…. Czy jest możliwość wrzucenia gotowego projektu do pobrania formularza z tokenem? Próbowałem to połączyć samemu ale cały czas było coś nie tak.
Z góry dziękuje
Ej fajne. A masz może jakieś linki do innych takich gotowych walidjacji danych formularzy?
Ciekawe czy dużo roboty sprawiło by połączenie tego z tolltiami … hm :)
*tooltipami :P
Używam tutaj opcji walidacji wbudowanych do PHP5, więc niestety nie działają one w js. Natomiast jest kilka pluginów do np. jQuery, które robią takie rzeczy. Możesz też poeksperymentować z http://livevalidation.com/examples.
W tym skrypcie zależało mi na uniwersalności i prostocie obsługi oraz użycia na przeróżnych rodzajach stron. Jest to prosty formularz i tylko taką funkcję ma spełniać, czyli działać, fajnie by było, gdyby również kogoś czegoś nauczyło, może się uda :)
No właśnie z takich co szukałem to ten jest najlepszy, fajnie by było jak by ktoś to połączył i wrzucił na stronkę :) ja próbowałem ale niestety cały czas coś było nie tak :/ Byłbym b. wdzięczny….
Pozdrawiam
Uri
Nie widzę sensu dodawania tutaj tokena, a już na bank nie da się po prostu zrobić “ctrl+v jakiś kod” :)
Z góry mówię, że nie będzie niestety takiej wersji. Udostępniam skrypt w celach poznawczo-edukacyjnych, w końcu o tym jest Websta.pl. Przy okazji rozwiązując popularny problem, z którym nie każdy sobie radzi.
Pozdrawiam.
Witam :)
Formularz jest super! Prosty w obsłudze i instalacji w serwisie. Dzięki!
Jest tylko jedno ale jakie nasuwa mi się na myśl… Gdy wyślemy już maila i pojawia się komunikat o wysłaniu wiadomości, można w nieskończoność odświeżać stronę – wysyłając jednocześnie kolejne maile… Może warto by było jeszcze dokleić do skryptu blokadę odświeżania strony po jego wysłaniu?
Mam jeszcze jedno pytanie – jak zrobić, aby główna treść wiadomości nie znikała, gdy np nie uzupełnimy jakiegoś wymaganego pola i wyskakuje komunikat o nie wysłaniu maila?
Liczę na odpowiedź autora :)
Pozdrawiam!
PS: Jeszcze raz dzięki za fajny skrypt! :)
“Blokadę odświeżania” można zrobić na kilka sposobów, możesz np. wysłać header przenoszący na inną podstronę, czy dokleić nawet meta z http-equiv=”Refresh”… W formularzu tego nie ma, gdyż zależało mi na tym, żeby był w miarę uniwersalny.
Co do znikającej treści ja nie widzę tego problemu, u mnie się pojawia treść, przy niedudanej wysyłce.
Pozdrawiam.
Już wszystko gra, mój błąd :) nie dodałem #tresc# miedzy tagi ;)
Super formularz gratulacje !
Jeden problem :
Jak się źle wypełni formularz, lub go nie wypełni to otzymamy:
Wiadomość NIE została wysłana. Popraw poniższe błędy.
* Nick musi mieć min. 2 znaki.
* Podaj poprawny adres e-mail.
* Temat musi mieć min. 3 znaki.
* Treść musi mieć min. 5 znaków
i chodzi mi o pierwszy element listy- gdzie zmienić słowo z “nick” na “imię i nazwisko”
Sorki za zamieszanie – nie doczytałem że mam tu configa
Jeszcze raz przepraszam
i jeszcze raz gratuluje – SUPER FORMULARZ
Będę próbował dorobić selecta z wyborem sugerowanych tematów
jak macie pomysły jak to zrobić to chętnie skorzystam
Hej dzięki za linka jednak mi chodziło o trochę inną metodę komunikowania że jest złe wypełnienie (zamiast napisów chmurki). Tak zaglądam co raz do ciebie i się zastanawiam kiedy będzie nowy tutek ?
Pozdrawiam
Cameyz
No jeśli nie chodziło Ci o to, to niezbyt wiem co masz na myśli. Co do nowych tutków to na pewno będą, ale chwilowo mam dużo pracy w firmie i na dodatek ledwo co się przeprowadziłem :)
Witam mam problem wgrałem te pliki z katalogu zip do katalogu formularz i mi nie działa a dokładnie chodzi o strone http://www.speedhs.cba.pl/formularz
Twoja strona musi być “czytana” jako php. Nie wiem jak masz tam porobione przekierowania, ale nie interpretuje tej strony jako php tylko html, dlatego w źródle widać
includePiecyk moze dlatego ze cba to darmowy hosting ;)
No to może być problem, jeśli mają zablokowaną funkcję mail, ale to już każdy we własnym zakresie musi sprawdzić :)
Ale ja wsadziłem te wszystkie pliki (z katalogu zip) do katalogu formularz i wrzuciłem tylko na serwer. I tylko jeszcze tylko w ustawieniach zmieniłem na mój email…
Tak jak już Ci powiedziałem wyżej. Najprościej będzie jak ustawisz plikowi rozszerzenie .php zamiast html.
Witam mam problem z tym skryptem tzn: formularz.css mam skonfigurowany chyba ok problem wzór z http://www.speedhs.cba.pl/formularz/formularz.css ale mam problem z samym rozruchem na forum. http://pogadajmy.net.pl/formularz/index.html widnieje tylko tło i pasek ramki i nic poza tym! Nie wiem co mam zrobić?
Tak jak kolega powyżej zamiast index.html zrób index.php.
P.S. Gdy dodajesz koment z kilkoma linkami automatycznie musi zostać zatwierdzony ręcznie, więc proszę nie wysyłaj po 3 takie same komentarze.
Przepraszam ale chciałem poprawić adres. Działa świetnie. Dziękuje.
Niestety mnie formularz kontaktowy nie działa. Po prostu nawet się nie wyświetla.
Umieściłem
tam gdzie trzeba i nic.
zmien index.html na index.php (PHP)
A formularz bardzo fajny, dokonalem pare ciekawych zmian,
Wyglada swietnie jak doda sie .$nick. po tym jak wyskakuje ze wyslano,
np dziekuje NICK, twoj formularz zostal wyslany.
Nie bede opisywal z technicznej strony mojej nowosci, jest ona bardzo prosta w budowie ;D
Cieszę się, że ktoś się pokusił o kreatywne użycie. Fajny pomysł.
Pozdrawiam.
Witam. Formularz ma być podstroną. Ze strony głównej zrobionej w html linkiem wchodzimy na subdomenę i do tego właśnie jatalogu na serwerze w rzuciłem pliki formularza, uprzedni dostosowując kolorek do strony głównej Wpisałem tam gdzie trzeba mail odbiorczy. Po wysłaniu wyświetlla się info o wysłaniu wiadomości. Jednak na skrzynkę nie dociera. W spamie również patrzyłem. Czy ten formularz może funkcjonować jako osobna podstrona? JUak w takim przypadku wyśrodkować go bo aktualnie wszystkr pola są w lewej części ekranu.? Poproszę o pomoc. Dopiero się uczę…Pzdr!
twoj server nie obsluguje mail()
Emil podał prawdopodobną przyczynę (no chyba że wysyłasz na gmail). Co do CSS to podglądaj jak to jest zrobione i eksperymentuj. To są sprawy dość podstawowe i łatwo to złapiesz. Więcej to nawet nie mam jak Ci poradzić.
BTW tak formularz może funkcjonować jak osobna strona jeśli jest taka potrzeba, skrypt wstawi formularz gdzie chcesz, ale sam formularz, więc o resztę dokumentu musisz zadbać sam. Taka jest jego funkcja.
witam,
mam problem…robię stronę we flashu, konkretnie Alligator Flash i potrzebuję skryptu do zrobienia logowania i “poleć stronę”.możesz udostępnić mi coś takiego?będę bardzo wdzięczna.pozdr.
Przykro mi, ale nie zajmuję się flashem.
flash przegral bitwe z HTML 5 ;D
co miales na mysli “(no chyba że wysyłasz na gmail)”
sugerujesz ze google banuje, zbanowalo hosting, ktorego king uzywa?
Ja nie mam problemu, byc moze dlatego ze place prawie stowke rocznie ;D
Ah, moja niepochamowana kreatywnosc jednak zatrzymala sie na punkcie chcekbox.
Nie mam aktualnie kodu, (nie ma mnie w domu) ktory i tak jest bledny.
Porazka ;]
Nie chce tu nikogo przymuszac, ale czy ma ktos juz jakies gotowe rozwiazanie? albo fragmet kodu ktorym moglby sie podzielic, dac jakas wskazowke jak przebrnac przez validiate, a potem poprawnie wyslac wartosc yes z reszta formularza?
@Emil
To jest już bardziej skomplikowana sprawa. Samo odczytanie value checkboxa jest proste i chyba umiesz. Co do validacji to też tylko sprawdzisz czy jest “yes” czy nie. Największy problem będzie z samym printem formularza, bo musisz tam zrobić warunek, który po nieudanej wysyłce zaznaczy ponownie checkbox, jeśli był już zaznaczony.
Zrób zmienną np. $ok = ‘checked=”checked”‘ dla zaznaczonego i $ok=” dla nie zaznaczonego. Prostym ifem wstawiaj wartość zmiennej do kodu checkboxa.
Tyle jeśli chodzi o wskazówki.
Pozdrawiam.
co wpisać w PLIKU PHP, by wysyłać maila nie na podany adres, ale na adres wpisany w pole edit:funkcja polecenia strony czy polecenia znajomemu?
ktoś mi powiedział, że: email@domena.pl, ale to nie działa.proszę o pomoc
Przy wysłaniu wypluwa mi coś takiego
Fatal error: Call to undefined function: filter_var() in /var/www/sites/yoyo.pl/f/c/fc-polanowice/mail.php on line 55
Musisz używać php5, poczytaj dokumentacje swojego serwera, żeby dowiedzieć się jak to zrobić.
Wyświetla mi się taki sam komunikat jak Yahoo048, czym to może być spowodowane?
Poradziłam sobie z tym błędem zmieniając 55 linijkę kodu na
if(strlen($_POST['mail']) < $valid['mail'] )
i teraz działa :)
W ten sposób wcale nie walidujesz adresu mail. Jak Yahoo048 musisz używać php5, więc sprawdź jak to się robi na Twoim serwerze.
Witam, bardzo ciekawy formularz, jednak natrafiłem na dziwny błąd. Najprawdopodobniej jest to błąd serwera gdyż formularz zwraca mi komunikat “Przepraszamy wystąpił chwilowy błąd. Spróbuj ponownie później”. Mam komercyjny hosting i nie podejrzewam że byłą by zablokowana funkcja mail(), jednak puszczając:
nie otrzymałem niczego, ani warninga z pasera php ani maila, czy wchodzą jeszcze w grę jakieś inne problemy z php o które powinienem zapytać firme hostingową ?
Pozdrawiam
… hmm zjadło mi kod php – widać że masz zabezpieczenie ;) prawidłowo, ale uzupełniając myśl – puściłem prosty skrypt wysyłający emaila o którym pisałeś wcześniej i nic
php mail (“twoj@adres”, “temat”, “wiadomosc”, “From: adres@mail.com\r\n”)
Hmmm…. No faktycznie ciężko powiedzieć w czym problem, skoro “suchy” mail() nie wychodzi. Komunikat, który otrzymujesz pokazuje się właśnie wtedy, gdy wykonanie mail() nie powiodło się.
Chyba najlepiej będzie jak napiszesz do admina serwera, jeśli nie posiadają jakiegoś FAQ na ten temat, bo jednak to dość dziwny przypadek.
Dzięki za szybką odpowiedź. Skontaktowałem się z firmą hostingującą i mam odpowiedź.
“Witam, pole from musi mieć adres obsługiwany przez serwer.
Może Pan założyć za pomocą DA skrzynkę i wysyłać jako ona.”
czyli jeśli dobrze rozumiem – dla tych co będą mieli podobny problem – trzeba będzie z mail.php zamienić fragment gdzie wrzucany jest mail nadawcy ‘From:’.$_POST['mail'] wstawić na sztywno adres skrzynki na serwerze którą założymy a adres nadawcy wrzucić jako treść w mailu. Niestety takie rozwiązanie nie pozwoli nam odpowiadać automatycznie na maile.
Witam, mam dziwny problem z kodowaniem znaków. Jeśli mam charset windows-1250 to mam poprawne litery na całej stronie a nie mam w formularzu. Jeśli natomiast mam kodowanie utf-8 to jest odwrotnie. Dlaczego formularz nie poddaje się kodowaniu windows-1250 i jak to zmienić? Pozdrawiam
Nie wiem, co oznacza dla Ciebie zmiana kodowania, czy chodzi tylko o metatag? Ogólnie ten formularz działa poprawnie ze stronami kodowanym w UTF-8, co widać w demo. Nie wystarczy zmienić charset, trzeba też przekonwertować pliki i pogrzebać w kodzie php, żeby nie było “krzaków” w mailu.
Plusy za:
- prostotę
- wygląd
- łatwość implementacji
Minusy za:
- wyswietl_forme().. parsowanie pliku?? nie lepiej
- wymagane PHP5, które nie jest wymagane :)
Ujmij całość w klasę to i ja skorzystam.
Pozdrawiam
Wiesz brałem pod uwagę głównie to, kto będzie używać tego formularza i tak dobrałem sposób jego napisania. Może też naiwnie myśląc, że ktoś użyje tego kodu w celach edukacyjnych :] Choćby z tego względu odpada OOP.
Zwróć uwagę, że użyłem filter_var do walidacji adresu, co jest dostępne od 5.2.0. Wiadomo, że można użyć wyrażeń regularnych, ale to kolejne utrudnienie niełatwe do odczytania dla początkujących.
Niezbyt rozumiem co masz na myśli z tym wyswietl_forme(), ale dzięki za uwagi.
Pozdrawiam.
zjadło mi < ?php if ( !empty ( $komunikat) ) e c h o $komunikat ; ? >
Rozumiem tylko po co uczyć rzeczy starych i nie aktualnych- jak programowanie strukturalne?
Co do walidacji maila to faktycznie nie zauważyłem wcześniej, że poszedłeś na łatwiznę :P
A wyswietl_forme() jest totalną pomyłką. Skoro masz formularz zapisany w PHP to nie łatwiej jest do niego wstawić:
{$komunikat},{$imie} itd.
lub
zamiast tych dziwnych #komunikat#, #imie#??.. oszczędzasz czas na parsowaniu całego pliku i podstawianie komunikatów i danych do formularza.
Pozdrawiam
znowu mi zjadło -_-
{$komunikat},{$imie} itd.
lub
,
Skrypt łatwy do modyfikacji, ustawienia, zainstalowania… wielkie dzięki! :)