Na każdej stronie powinien znajdować się formularz kontaktowy. Jest kilka wtyczek formularzy wartych polecenia, ale do zwykłego i prostego formularza kontaktowego polecam użyć darmowej wtyczki Contact Form 7.
Contact Form 7 to jedna z najpopularniejszych i najstarszych wtyczek formularzy kontaktowych WordPress. Jednak pomimo popularności wiele osób ma problem z konfiguracją tej wtyczki. Po przeczytaniu tego poradnika będziesz wiedział jak skonfigurować wtyczkę Contact Form 7.
Najważniejsze cechy Contact Form 7
Jest to jedna z najbardziej popularnych wtyczek, ma ponad 5 milionów aktywnych instalacji. Oto niektóre z zalet tej wtyczki:
- Łatwe tworzenie i zarządzanie wieloma formularzami
- Proste ustawianie pól formularza
- Proste znaczniki do zmiany treści
- Możliwość umieszczenia formularza w dowolnej stronie lub poście za pomocą shortcode
- Filtrowanie spamu za pomocą Akismet czy CAPTCHA
- Wiele rozszerzeń innych firm, które dodają dodatkową funkcjonalność
- Bezpłatny
Jak zainstalować Contact Form 7
Pierwszą rzeczą jaką musimy zrobić to pobranie wtyczki z repozytorium WordPress. W kokpicie WordPress wybierz kolejno Wtyczki -> Dodaj nową i w wyszukiwarce wpisz „Contact form 7”, a następnie aktywuj. Po aktywacji możesz znaleźć funkcjonalność wtyczki w nowym obszarze Kontakt na pulpicie nawigacyjnym WordPress.
Jeśli jeszcze nie wiesz jak instalować wtyczki to przeczytaj: Jak zainstalować wtyczkę WordPress
Jak skonfigurować Contact Form 7
Kiedy już pobrałeś i aktywowałeś wtyczkę możesz zająć się stworzeniem swojego formularza. W tym celu wejdź kolejno Formularze -> Dodaj nowy
Nadaj nazwę nowemu formularzowi kontaktowemu, a następnie przewiń w dół do Formularza.
- Zakładka „Formularz”
Tutaj konfigurujemy szablon naszego formularza, jeśli to ma być zwykły formularz kontaktowy to w zupełności wystarczy nam ten domyślny. Możesz jednak dodać dodatkowe pola, w zależności od potrzeb witryny. Aby to zrobić, możesz wybrać odpowiedni przycisk generatora znaczników, aby wygenerować poprawny znacznik formularza. Na przykład, aby dodać pole URL, wystarczy kliknąć przycisk URL.
Przykład:
<label>
Strona WWW:
[url url-716] </label>
Pamiętaj, aby po zakończeniu kliknąć Zapisz u dołu strony.
W tym miejscu możesz edytować szablon email. Jest to szablon wiadomości e-mail, którą otrzymasz po wysłaniu formularza kontaktowego. W polu Do sprawdź, czy adres e-mail jest poprawny, ponieważ tutaj będzie wysyłana korespondencja z formularza kontaktowego.
Contact Form 7 umożliwia bardzo elastyczną edycję szablonów poczty. Możesz edytować nie tylko treść wiadomości, ale także pola nagłówka wiadomości.
Wypełniamy tutaj:
Odbiorca: (wymagane) Tutaj wpisujemy maila na którego mają przychodzić wiadomości wysyłane za pomocą formularza kontaktowego.
Nadawca: (wymagane) Email z którego formularz wysyła wiadomość. Możemy tutaj edytować nazwę która jest przed znacznikiem „<”
Temat: (wymagane) Wpisujemy temat + znacznik „[your-subject]” czyli wpisany tytuł przez osobę wysyłającą wiadomość z formularza.
Treść: Dodaj dodatkowe znaczniki formularza wygenerowane przez Ciebie wcześniej w zakładce „Formularz”. Zapewni to, że po otrzymaniu wiadomości e-mail za pośrednictwem formularza kontaktowego zostaną wyświetlone wszystkie informacje, o które poprosiłeś nadawcę.
- Komunikaty
Konfigurujemy wszystkie komunikaty generowane przez wtyczkę. Możesz dowolnie zmieniać treść komunikatów, ale te domyślne są całkiem okej.
Integracja reCAPTCHA
Konfiguracja reCAPTCHY pomoże Ci w walce ze spamem, aby prawidłowo skonfigurować reCAPTCHE przejdź do Formularze > Integracje.
Będziesz musiał teraz wygenerować klucz API i sekretny klucz. Przejdź do tej strony: reCAPTCHA i kliknij „Admin Console”.
Wygeneruj klucz API oraz Sekretny klucz i wklej w „Setup Integration”
reCAPTCHA v3 nie potrzebuje widgetu CAPTCHA (pole wyboru „Nie jestem robotem” używane w reCAPTCHA v2) do pracy więc nie są potrzebne znaczniki [recaptcha].
Wstaw formularz kontaktowy
Na sam koniec pozostaje Ci wstawić formularz do wpisu lub strony za pomocą wygenerowanego shortcode.
Przejdź kolejno do Strony > Dodaj nową. Wpisz nazwę strony „Kontakt”, a w treści wklej shortcode Twojego formularza. Na koniec kliknij „Opublikuj”.
Teraz możesz dodać stronę swojego formularza kontaktowego do menu, aby to zrobić kliknij: Wygląd > Menu i przeciągnij stronę „Kontakt” do odpowiedniego menu.