TechBlogSD - Wszystko do WordPressa i tworzenia stron internetowych
Instrukcje WEB i WordPress, nowości, recenzje motywów i wtyczek

Jak dodać formularz kontaktowy w WordPressie?

12

Jako właściciel witryny internetowej możesz pozwolić swoim czytelnikom na interakcję z Tobą na wiele sposobów. Włączanie komentarzy na blogu, odpowiadanie na profilach społecznościowych i wysyłanie kampanii e-mail to jedne z najpopularniejszych sposobów. Oprócz wszystkich tych opcji, w każdej witrynie WordPress jest jedna najważniejsza strona. To jest strona kontaktowa umożliwiająca użytkownikom wysyłanie do Ciebie e-maili. W tym artykule dowiemy się, jak dodać formularz kontaktowy w witrynie WordPress.

Powiązane: Jak dodać i dostosować formularz kontaktowy w witrynie Weebly?

Dlaczego warto mieć stronę kontaktową w WordPressie?

Podstawową potrzebą strony kontaktowej jest umożliwienie czytelnikom wysyłania do Ciebie wiadomości e-mail. Istnieje jednak kilka innych zalet posiadania strony kontaktowej w Twojej witrynie.

  • Wiarygodność – posiadanie strony kontaktowej zwiększa wiarygodność Twojej strony internetowej. Ludzie będą wierzyć, że jesteś prawdziwą osobą lub firmą, która odpowiada na pytania.
  • Widoczność – formularz kontaktowy zwiększa widoczność Twojej strony zarówno w wyszukiwarkach, jak i wśród użytkowników. Możesz łatwo przyciągnąć użytkowników do swojej strony kontaktowej i zachęcić ich do podzielenia się swoimi potrzebami.
  • Biznes – jeśli nie masz czasu na odpowiedź na czacie na żywo, kolejną najlepszą opcją prowadzenia biznesu jest skorzystanie z formularza kontaktowego. Działa to dobrze w branżach usługowych, takich jak pisanie CV i tworzenie oprogramowania.

Różnica między formularzem kontaktowym a e-mailami

Wielu z was może pomyśleć, dlaczego trzeba mieć osobny formularz kontaktowy zamiast bezpośrednio podawać swój adres e-mail w sekcjach stopki i paska bocznego.

  • Pokazywanie swojego adresu e-mail publicznie spowoduje problemy z prywatnością. Otrzymasz setki wiadomości spamowych, ponieważ każdy może wysłać wiadomość, klikając Twój adres e-mail.
  • Natomiast formularze kontaktowe nie ujawnią czytelnikom Twojego adresu e-mail. WordPress przetworzy wiadomość i wyśle ​​do Ciebie bez użytkowników znających Twój adres e-mail. W ten sposób będziesz otrzymywać wiadomości tylko od zainteresowanych użytkowników i unikniesz spamu oraz obraźliwych wiadomości prywatnych.
  • Wtyczka bezproblemowo współpracuje z Akismet, aby zapobiec przesyłaniu spamu lub możesz dodać reCAPTCHA, aby upewnić się, że tylko ludzie mogą przesłać formularz, a nie automatyczne roboty. Ponadto Contact Form 7 wykorzystuje również domyślną opcję czarnej listy komentarzy WordPress do blokowania wiadomości.
  • Możesz korzystać z wielu formularzy kontaktowych w jednej witrynie WordPress i dodawać parametry, aby śledzić wydajność każdego formularza. Na przykład, możesz osobno śledzić formularz na swojej stronie kontaktowej i na temat strony.
  • Wtyczka nie przechowuje wiadomości w bazie danych, dzięki czemu zachowuje Twoją prywatność.

Dzięki tym wszystkim korzyściom formularze kontaktowe są znacznie bezpieczniejszym, profesjonalnym i łatwiejszym sposobem interakcji z czytelnikami.

Dobrą stroną jest to, że masz wiele wtyczek do formularzy kontaktowych dostępnych za darmo w sekcji repozytorium wtyczek WordPress. Contact Form 7 to jedna z najpopularniejszych spośród wszystkich dostępnych bezpłatnie wtyczek.

  • Jest to bardzo łatwa w użyciu wtyczka posiadająca ponad 5 milionów aktywnych instalacji.
  • Jest to kompletna darmowa wtyczka bez irytujących reklam lub dodatkowej wersji premium.
  • Aktywnie rozwijany i utrzymywany.
  • Wiele popularnych motywów WordPress integruje wtyczkę Contact Form 7 i oferuje niestandardowe formularze.
  • Możesz wstawić formularz w dowolnym miejscu na swojej stronie za pomocą bloku Gutenberga.

Instalowanie wtyczki Formularz kontaktowy 7

Ponieważ Contact Form 7 jest darmową wtyczką, możesz zainstalować go bezpośrednio z panelu administracyjnego WordPressa. Po zalogowaniu się do panelu administracyjnego witryny przejdź do sekcji „Wtyczki > Dodaj nowy". Stamtąd możesz wyszukać i zainstalować wtyczkę Contact Form 7.

Jak dodać formularz kontaktowy w WordPressie?

Zainstaluj wtyczkę formularza kontaktowego 7

Tworzenie pierwszego formularza kontaktowego

Po aktywacji wtyczki na Twojej stronie utworzy ona dodany element menu o nazwie „Kontakt”. Posiada trzy pozycje podmenu – Formularze Kontaktowe, Dodaj Nowy i Integracja.

Jak dodać formularz kontaktowy w WordPressie?

Formularz kontaktowy 7 Menu

  • Możesz wyświetlić wszystkie swoje formularze w sekcji „Formularze kontaktowe”.
  • Przejdź do „Dodaj nowy”, aby utworzyć nowy formularz.
  • Sekcja integracji umożliwia łączenie się z zewnętrznymi API z Constant Contact, reCAPTCHA i Sendinblue.

Konfiguracja wtyczki Formularz kontaktowy 7

Aby ułatwić Ci zadanie, Contact Form 7 doda w Twojej witrynie gotowy przykładowy formularz. Możesz edytować przykładowy formularz, przechodząc do sekcji „Formularze kontaktowe” i ponownie użyć lub utworzyć nowy od podstaw.

Jak dodać formularz kontaktowy w WordPressie?

Wyświetl utworzone formularze

W tym artykule stworzymy nowy formularz i osadzimy shortcode. Przejdź do sekcji „Kontakt > Dodaj nowy”, aby wyświetlić wszystkie dostępne opcje tworzenia nowego formularza. Zobaczysz sekcje formularza, poczty, wiadomości i dodatkowych ustawień, w których możesz skonfigurować opcje i zaprojektować swój formularz. Wtyczka doda podstawowy szablon formularza, poczty i wiadomości w odpowiedniej sekcji na początek. Możesz dodać dodatkowe opcje odnosząc się do strony dokumentacji wtyczki.

Sekcja formularza

W sekcji „Formularz” możesz zobaczyć dostępne tagi do edycji szablonu formularza. Wtyczka doda podstawowe tagi, takie jak imię i nazwisko, adres e-mail, temat i przycisk przesyłania, które można dalej edytować i dostosowywać.

Jak dodać formularz kontaktowy w WordPressie?

Dodaj nowy formularz kontaktowy

  • Możesz dodać pola dla adresu URL, numeru telefonu, przycisków opcji, przesyłania plików, quizu, pól wyboru, menu rozwijanego itp., po prostu klikając przycisk.
  • Na początku możesz nie czuć się komfortowo z przyciskami i kodem. Jednak kliknięcie każdego przycisku spowoduje wyświetlenie wyskakującego okienka, w którym można po prostu uzupełnić szczegóły.
  • Nie musisz pamiętać tagów ani przygotowywać kodu.

Na przykład kliknij przycisk „plik”, aby wstawić opcję przesyłania pliku do formularza. W wyskakującym okienku podaj szczegóły dotyczące rozmiaru, typu, pola obowiązkowego itp. i zapisz.

Jak dodać formularz kontaktowy w WordPressie?

Wypełnij szczegóły dla tagu

Po zakończeniu projektowania formularza szablon będzie posiadał następujące tagi. Możesz przenieść etykiety w inne miejsce, wycinając i wklejając odpowiedni kod.

<label> Your name [text your-name] </label> <label> Your email [email your-email] </label> <label> Subject [text your-subject] </label> <label> Your message (optional) [textarea your-message] </label> [file file-915 limit:1mb filetypes:.docx] [submit "Submit"]

Na koniec podaj nazwę formularza i kliknij przycisk Zapisz. Otrzymasz krótki kod, który możesz skopiować i wkleić w dowolnym miejscu na swojej stronie.

Jak dodać formularz kontaktowy w WordPressie?

Zapisano formularz kontaktowy

Sekcja poczty

Przed użyciem shortcode następnym krokiem jest skonfigurowanie szablonu wiadomości e-mail, przechodząc do sekcji „Poczta”.

Jak dodać formularz kontaktowy w WordPressie?

Formularz kontaktowy 7 Ustawienia poczty

  • Do i Od – wtyczka wykorzystuje adres e-mail administratora witryny jako adres i użyj tytułu witryny oraz podanego adresu e-mail z pola.
  • Temat i Nagłówki – dane z pól formularza są wykorzystywane w szablonie maila.
  • Treść wiadomości – ustaw format szablonu do otrzymywania wiadomości e-mail.
  • Załącznik plikowy – pozostaw go pusty lub dodaj tag pliku, jeśli to konieczne, aby wyświetlić nazwę pliku w odbieranej wiadomości e-mail.

Jak dodać formularz kontaktowy w WordPressie?

Treść wiadomości i załącznik do pliku

Ogólnie rzecz biorąc, nie musisz dokonywać żadnych modyfikacji w szablonie poczty. Utwórz drugi szablon poczty, aby użyć go jako autorespondera. Gdy wiadomość e-mail zostanie pomyślnie wysłana, wtyczka uruchomi szablon wiadomości autorespondera na wiadomość e-mail zgłaszającego.

Jak dodać formularz kontaktowy w WordPressie?

Formularz kontaktowy 7 Autoresponder

Zapisz zmiany po zakończeniu konfiguracji szablonów poczty.

Sekcja Wiadomości

W tej sekcji możesz dostosować wiadomości tekstowe, które pojawiają się w różnych sytuacjach. Możesz zostawić tekstowe symbole zastępcze bez zmian, jeśli nie chcesz dostosowywać. Na przykład domyślnie wtyczka wyświetli komunikat „Dziękuję za wiadomość. Został wysłany. po pomyślnym przesłaniu formularza. Jeśli korzystasz z formularza do składania propozycji biznesowych, warto edytować ten tekst, aby dodać więcej szczegółów i dalsze kroki dla klientów.

Jak dodać formularz kontaktowy w WordPressie?

Ustawienia wiadomości

Dodatkowe ustawienia

Możesz pozostawić sekcję dodatkowych ustawień bez zmian. Przejrzyj jednak opcje dostępne w dokumentacji, aby sprawdzić, czy jakieś pola są przydatne. Na przykład, możesz dodać subscribers_only: true w polu tekstowym, aby umożliwić przesyłanie formularza tylko zalogowanym użytkownikom .

Jak dodać formularz kontaktowy w WordPressie?

Dodatkowe ustawienia

Dodawanie formularza na stronie kontaktowej

Kliknij przycisk Zapisz po sfinalizowaniu wszystkich ustawień. Zasadniczo wszystkie powyższe kroki są jednorazową konfiguracją i możesz tworzyć nowe formularze przy użyciu tej samej konfiguracji bez za każdym razem edytowania szablonów. Możesz jednak również użyć różnych pól i szablonów dla każdego formularza.

Teraz, gdy masz już skrócony kod formularza kontaktowego, następnym krokiem jest osadzenie go na swojej stronie. Przejdź do sekcji „Strony > Wszystkie strony” i utwórz/edytuj swoją stronę kontaktową. Wpisz /contact, aby przefiltrować blok Contact Form 7 Gutenberg i wstaw go w obszarze treści.

Jak dodać formularz kontaktowy w WordPressie?

Formularz kontaktowy 7 Blok Gutenberga

Kliknij menu „Wybierz formularz kontaktowy” i wybierz nazwę formularza do osadzenia.

Jak dodać formularz kontaktowy w WordPressie?

Umieść formularz kontaktowy

Jeśli używasz starego edytora klasycznego, po prostu wklej krótki kod formularza kontaktowego w edytorze.

Jak dodać formularz kontaktowy w WordPressie?

Dodaj formularz kontaktowy w klasycznym edytorze

To wszystko, umieściłeś formularz kontaktowy na swojej stronie. Teraz możesz opublikować lub zaktualizować stronę, aby zobaczyć ją w akcji.

Powiązane: Jak osadzić formularze Google w WordPress?

Testowanie formularza kontaktowego

Wyświetl swoją stronę, aby zobaczyć, jak wygląda formularz. Zalecamy również przetestowanie formularza poprzez przesłanie fikcyjnej wiadomości.

Jak dodać formularz kontaktowy w WordPressie?

Opublikowany formularz kontaktowy

Wtyczka użyje walidacji przeglądarki, aby upewnić się, że wszystkie wymagane pola są wypełnione. Podczas próby przesłania formularza bez obowiązkowych pól zobaczysz błędy zgodnie z konfiguracją w sekcji „Wiadomości”.

Jak dodać formularz kontaktowy w WordPressie?

Walidacja formularza w przeglądarce

Prześlij pomyślną wiadomość i potwierdź, że Twój kontakt działa prawidłowo. Podobnie sprawdź otrzymaną wiadomość i dostosuj konfigurację w sekcji „Poczta”, aby w razie potrzeby zmienić szablon.

Jak dodać formularz kontaktowy w WordPressie?

Wiadomość wysłana pomyślnie

Wniosek

W sumie możesz potrzebować mniej niż 30 minut, aby utworzyć i dodać formularz kontaktowy w witrynie WordPress za pomocą wtyczki Contact Form 7. Działa bezproblemowo bez konfliktów z innymi wtyczkami. Niewątpliwie formularz kontaktowy 7 jest częścią wielu witryn biznesowych WordPress i możesz go wypróbować, aby ulepszyć swój biznes.

Źródło nagrywania: www.webnots.com
Leave A Reply

Ta strona korzysta z plików cookie, aby poprawić Twoje wrażenia. Zakładamy, że nie masz nic przeciwko, ale możesz zrezygnować, jeśli chcesz. Akceptuję Więcej szczegółów