3 min. czytania

Jeżeli jesteś w trakcie tworzenia swojej pierwszej strony w wordpress i poszukujesz informacji jak stworzyć formularz kontaktowy wordpress to świetnie trafiłeś. Wszystko czego potrzebujesz opisałem w tym wpisie. Klikaj i działaj.

Formularz kontaktowy wordpress uszyty na miarę.

Komunikacja z klientem to jeden z kluczowych elementów prowadzenia biznesu online, dzięki wordpress i odpowiedniej wtyczce możesz bardzo szybko wprowadzić ją na swoją stronę.

Mowa oczywiście o formularzu kontaktowym i wtyczce Contact Form 7. Dzięki swej prostocie jest jedną z popularniejszych. Za sprawą intuicyjnej edycji możesz dopasować formularz idealnie do swoich potrzeb. Jak to zrobić zaprezentuje Ci w dalszej części tego wpisu.

Contact form 7 – twój formularz kontaktowy wordpress na stronie.

Zacznij od instalacji wtyczki, jeśli dopiero zaczynasz przygodę z wordpress to tutaj dowiesz się jak instalować wtyczki: Jak dodać wtyczkę wordpess?

Po udanej instalacji w lewym menu wordpress pojawi się pozycja „Formularze” Screen1. Kliknij „Dodaj nowy” – rozpoczniesz konfiguracje swojego pierwszego formularza.

formularz kontaktowy wordpress
Screen 1

Na ekranie zobaczysz (Screen 2) pole w które możesz wpisać tytuł formularza ( jest on używany przy jego identyfikacji i osadzaniu na stronie ). Pole „Formularz” zawiera elementy konstrukcyjne formularza (domyślnie powinny być tam podstawowe pola takie jak imię i nazwisko, mail, temat, wiadomość oraz przycisk wyślij).

konferujemy formularz kontaktowy
Screen 2

Ponadto są również trzy inne zakładki Email, Komunikaty oraz Ustawienia dodatkowe o których za chwilę.

Nad polem z elementami formularza znajdują się przyciski dzięki którym możesz dodawać do formularza kolejne elementy,  po kliknięciu podajesz nazwę pola oraz opcjonalnie zaznaczasz czy pole ma być wymagane Screen 3

ustawianie pola formularza kontaktowego
Screen 3

Konfiguracja formularza kontaktowego

Kiedy elementy formularza masz już gotowe przejdź do zakładki „Email”. W tym miejscu konfigurujesz techniczne elementy formularza:

Odbiorca – tutaj podajesz email na który ma zostać wysłana wiadomość z formularza (czyli twój)

Nadawca – mail serwera z którego wysyłane są maile. Wystarczy że wpiszesz tutaj jakiegokolwiek maila z domeną na której znajduje się Twój serwis. Mail nie musi istnieć.

Temat – możesz tutaj wpisać coś na stałe np.: „Zapytanie ze strony www” lub użyć znacznika z formularza wtedy wiadomość będzie miała taki tytuł jaki użytkownik wpisze w pole temat.

Dodatkowe nagłówki – polecam pozostawić „Reply-To:” z wstawionym znacznikiem maila użytkownika który poda go w formularzu. Pozwoli Ci to wygenerować odpowiedź bezpośrednio do niego.

Treść wiadomość – to treść którą otrzymasz z formularza. Używanym znacznikom np. [twoj-znacznik] odpowiadają pola które znajdują się w zakładce „Formularz”

Zaznaczając opcję Użyj emaila (2) znajdującego się na końcu tej zakładki, możesz w analogiczny sposób skonfigurować. Wiadomość która będzie wysyłana do użytkownika, np. podziękowanie za wysłanie zapytania z informacją że odezwiesz się wkrótce.

Kolejną zakładką są „Komunikaty” pozwala ona na samodzielne skonfigurowanie pojawiających się informacji. Na przykład takich jak info po wysłaniu maila lub o błędach w formularzu.

Zakładka „Ustawienia dodatkowe” pozwala za pomocą kodów umieszczonych w tym polu uruchomić dodatkowe funkcje.

  • Działanie formularza tylko dla zalogowanych,
  • Przestawienie go w tryb demo, w którym nie będzie wysyłał wiadomość tylko wyświetlał komunikaty.
  • I inne będące bardziej funkcjami testowymi niż dla użytkowników.

Po przejściu przez wszystkie etapy kliknij zapisz. Utworzyłeś właśnie swój pierwszy formularz kontaktowy ale to jeszcze nie koniec. Czeka nas teraz banalnie proste osadzenie na stronie, pod tytułem formularza pojawił się właśnie kod, wklej go w miejsce w którym chcesz aby pojawił się formularz.

Daj znać w komentarzu jak Ci poszło, oczywiście w przypadku problemów nie wahaj się i pisz w komentarzu, napewno pomogę 🙂

Blogujesz? Mam dla Ciebie listę narzędzi które pokochasz.

Pobierz darmowy e-book.