Jak utworzyć formularz WordPress z selektorem daty i godziny?

Opublikowany: 2022-04-25

Chcesz umożliwić użytkownikom wybór daty i godziny w formularzu WordPress? Ale nie wiesz, jak utworzyć formularz wyboru daty i godziny WordPress? W takim razie ten prosty samouczek jest właśnie dla Ciebie.

Jeśli myślisz, że dodanie kalendarza selektora daty i godziny do formularza kontaktowego jest trudnym zadaniem, tak nie jest. W rzeczywistości z odpowiednią wtyczką i narzędziem do formularza kontaktowego WordPress to tylko bułka z masłem.

Dlatego w tym artykule przeprowadzimy Cię krok po kroku, jak utworzyć kompleksowy formularz kontaktowy z kalendarzem wyboru daty i godziny. Więc czytaj dalej!

Spis treści

Po co dodawać selektor daty i godziny w formularzach WordPress?

Selektor daty i godziny nie jest czymś, co zawsze musisz dodawać do swoich formularzy WordPress. Istnieją jednak szczególne przypadki, w których konieczne jest umożliwienie użytkownikom skutecznego wyboru odpowiedniej daty i godziny wraz z innymi istotnymi informacjami.

Załóżmy, że Twoi użytkownicy chcą umawiać się na wizyty kontrolne, rezerwować stoliki w restauracji i tak dalej. W takich przypadkach musisz dodać selektor daty i godziny do formularza rezerwacji wizyty lekarskiej i stolika w restauracji.

Podobnie selektor daty i godziny przydaje się, gdy użytkownicy chcą poprosić o oddzwonienie. Jest to również pomocne, jeśli Twoi pracownicy lub studenci chcą poprosić o urlopy w określonych terminach.

Formularz wniosku o urlop Tworzenie formularza WordPress z selektorem daty i godziny

Jak widać, istnieje wiele powodów, dla których warto dodać selektor daty i godziny do formularzy WordPress. Dowiedzmy się więc, jak dodać selektor daty i godziny WordPress do formularza.


Jak utworzyć formularz WordPress z selektorem daty i godziny?

Możesz postępować zgodnie z prostymi instrukcjami podanymi poniżej, aby szybko utworzyć formularz wyboru daty i godziny WordPress.

Krok 1: Wybierz najlepszą wtyczkę do formularza WordPress za pomocą selektora daty i godziny WordPress

Po pierwsze, musisz wybrać wtyczkę do formularzy WordPress, która pozwala bez wysiłku tworzyć piękne formularze kontaktowe z selektorem daty i godziny. Rozumiemy, że wybór jednego z oceanu opcji jest przytłaczający. Dlatego zalecamy korzystanie z Everest Forms.

Everest Forms Najlepszy formularz kontaktowy Wtyczka WordPress

Everest Forms to wiecznie zielone rozwiązanie do tworzenia formularzy typu „przeciągnij i upuść”, aby tworzyć zmienne typy formularzy, które urzekają użytkowników. Niezależnie od tego, czy chcesz tworzyć proste formularze kontaktowe, formularze oddzwaniania, formularze rezerwacji hoteli online czy formularze wniosków urlopowych, Twoje życzenie zostanie spełnione.

Ta wtyczka oferuje najwyższej klasy funkcje, takie jak wstępnie zaprojektowane szablony formularzy, nieograniczona liczba pól formularzy, powiadomienia e-mail, inteligentna logika warunkowa i wiele innych. Podobnie ma przejrzysty i przyjazny dla użytkownika interfejs. A jeśli kiedykolwiek utkniesz gdziekolwiek, możesz skontaktować się z przyjaznym zespołem pomocy technicznej, aby szybko rozwiązać swoje problemy.


Krok 2: Zainstaluj wtyczkę Everest Forms

Aby zainstalować wtyczkę Everest Forms na swojej stronie, przejdź do Wtyczki >> Dodaj nowy z pulpitu WordPress.

Wtyczki Dodaj nowe

Przekieruje Cię do strony Dodaj wtyczki . Tutaj możesz wpisać nazwę wtyczki, którą chcesz zainstalować w pasku wyszukiwania. Jak tylko wpiszesz Everest Forms, wtyczka pojawi się na twoim ekranie. Teraz naciśnij przycisk Zainstaluj teraz .

Instalowanie wtyczki formularzy Everest

Na koniec kliknij przycisk Aktywuj , aby aktywować wtyczkę w swojej witrynie.

Aktywacja wtyczki formularzy Everest

Uwaga: Jeśli podoba Ci się to, co oferuje darmowa wersja wtyczki Everest Forms, możesz uaktualnić ją do wersji pro, aby cieszyć się większą liczbą funkcji i funkcjonalności.


Krok 3: Utwórz nowy formularz WordPress

Po zainstalowaniu i aktywacji wtyczki Everest Forms, przejdź do Everest Forms >> Dodaj nowy . Teraz na stronie Dodaj nowy formularz możesz wybierać spośród różnych gotowych szablonów formularzy lub zacząć od zera.

Przejdź z Everest Forms, aby dodać nowy

Bez względu na wybraną opcję, intuicyjny interfejs wtyczki typu „przeciągnij i upuść” umożliwia łatwe tworzenie żądanego formularza.

Ten samouczek pokaże Ci, jak od podstaw utworzyć formularz kontaktowy WordPress z selektorem daty i godziny. Po pierwsze, kliknij opcję Rozpocznij od zera .

Zacznij od opcji Scratch Utwórz formularz kontaktowy WordPress z selektorem daty i godziny

Następnie podaj odpowiednią nazwę dla swojego formularza i naciśnij przycisk Kontynuuj .

Nazwij swój formularz i kontynuuj

Otworzy się okno edytora formularzy. A teraz możesz zacząć dodawać wymagane pola formularza do swojego formularza.

Okno edytora formularzy Utwórz formularz kontaktowy WordPress z selektorem daty i godziny

Dodaj wymagane pola formularza i selektor daty i godziny

Możesz łatwo przeciągnąć pola formularza, takie jak Imię , E-mail , Telefon itp., z lewej strony i upuścić je do pustego obszaru po prawej stronie. Możesz także użyć pól formularza, takich jak Tekst jednowierszowy i Tekst akapitowy , aby pobrać informacje w postaci jednowierszowej i akapitowej.

Podobnie, aby dodać kalendarz selektora daty i godziny do formularza, przeciągnij zaawansowane pole Data/Czas z lewej strony i upuść je w wymaganym obszarze.

Przeciągnij i upuść pole daty i godziny

Inne dodatkowe pola można również dodać do formularza w podobny sposób. Nie wspominając o tym, że w razie potrzeby można również zmienić kolejność i kolejność pól formularza. Po prostu przeciągnij i upuść pole do wymaganego obszaru. To wszystko!

Zmiana kolejności pól formularza

Dostosuj pola formularza i selektor daty i godziny

Z Everest Forms bardzo łatwo jest dostosować pola formularzy do własnych potrzeb. W tym celu kliknij Opcje pola i możesz edytować etykietę, opis i więcej poszczególnych pól formularza.

Opcje pól Formularz WordPress z kalendarzem wyboru daty i godziny

Odpowiednio, możesz kliknąć pole Data/godzina , aby dostosować je do swoich potrzeb. Możesz bez problemu zmienić jego etykietę i format . Na przykład oznaczyliśmy ją jako Preferowana data . Podobnie, mówiąc o formacie, możesz pozwolić użytkownikom na wybranie daty, godziny lub obu z nich.

Edytuj etykietę i format daty WordPress formularz z kalendarzem wyboru daty i czasu

Możesz także wybrać jedną z dwóch opcji ustawień stylu dla pola daty/czasu, tj. Selektor dat i Lista rozwijana daty.

Style dat Formularz WordPress z kalendarzem wyboru daty i czasu

Date Picker pozwala użytkownikom wybrać datę z menu daty w stylu kalendarza, które wygląda mniej więcej tak z interfejsu.

Styl selektora dat

Wręcz przeciwnie, Date Dropdown pozwala użytkownikom wybrać datę z rozwijanego menu daty. Rozwijany selektor daty wygląda tak z interfejsu.

Styl listy rozwijanej daty

Poza tym możesz dodać krótki opis do pola, a nawet ustawić je jako wymagane , aby użytkownicy nie mogli kontynuować bez wypełnienia tego pola.

Dodaj opis pola i ustaw go jako wymagany Formularz WordPress z kalendarzem wyboru daty i godziny

A jeśli przewiniesz trochę w dół, możesz również znaleźć Opcje zaawansowane , z których możesz dalej dostosować ustawienia daty i godziny. W tym miejscu możesz dodać tekst zastępczy i wybrać jeden z czterech różnych Formatów daty .

Zaawansowana opcja ustawiania daty i godziny Formularz kontaktowy WordPress z selektorem daty i godziny

Nie wspominając o tym, możesz również wybrać Przedział czasu i format .

Przedział czasu i format

Poza tym opcja Wyłącz datę pozwala wyłączyć daty w formularzu. Spowoduje to uniemożliwienie użytkownikom wybierania tych dat.

Data wyłączenia

Ponadto możesz wybrać żądaną lokalizację daty do wyświetlenia. Do wyboru są trzy różne tryby daty . Są pojedyncze, zakresowe i wielokrotne. Tryb Pojedyncza data pozwala użytkownikom wybrać jedną datę. Tryb Ranger pozwala wybrać odpowiedni zakres dat. Użytkownicy mogą wybrać wiele opcji dat w trybie wielu dat.

Inne zaawansowane opcje ustawiania daty

Możesz także ustawić domyślną datę na bieżącą datę i włączyć do wyboru daty minimalne i maksymalne. Ponownie, jeśli jesteś zaawansowanym użytkownikiem, możesz zrobić więcej z polem daty za pomocą klas CSS.


Krok 4: Dostosuj ustawienia formularza

Pomyślnie utworzyłeś formularz WordPress z kalendarzem wyboru daty i godziny, ale jest on niekompletny, chyba że skonfigurujesz niezbędne ustawienia formularza. Dlatego poniżej omówimy pokrótce ogólną konfigurację formularza i ustawienia poczty e-mail.

Skonfiguruj ogólne ustawienia formularza

Aby skonfigurować ogólne opcje ustawień formularza, przejdź do Ustawienia >> Ogólne . Tutaj możesz edytować swoją nazwę i opis formularza. Możesz również wprowadzić komunikat o wyłączeniu formularza i komunikat o pomyślnym formularzu.

Ogólne ustawienia formularzy żądania oddzwonienia

Dzięki opcji Przekieruj do możesz umożliwić użytkownikom przejście na interesujący ich adres URL lub stronę po przesłaniu formularza.

Przekieruj do opcji

Opcja Projekt układu i klasa formularza umożliwia wybór spośród różnych projektów formularzy i dodanie klasy do formularza. W sekcji Prześlij przycisk możesz dodać żądany tekst przycisku przesyłania, prześlij tekst przetwarzania przycisku i prześlij klasę przycisku.

Konfiguracja przycisku przesyłania

Co więcej, możesz chronić swój formularz przed spamem, włączając pułapkę antyspamową. Podobnie, pozwól użytkownikom przesyłać formularz bez przeładowywania, włączając przesyłanie formularzy ajax. Możesz także włączyć lub wyłączyć przechowywanie informacji o wpisie w zależności od potrzeb.

Skonfiguruj ustawienia poczty e-mail

Ustawienia poczty e-mail pozwalają skonfigurować, gdzie e-maile mają zostać dostarczone po przesłaniu formularza. Dobrą wiadomością jest to, że Everest Forms umożliwia konfigurowanie wielu powiadomień e-mail. Na przykład powiadomienie e-mail administratora jest wyzwalane dla administratora, podczas gdy powiadomienie e-mail użytkownika jest wyzwalane dla użytkowników.

Możesz przejść do Ustawienia >> E-mail , aby skonfigurować ustawienia poczty e-mail. Po pierwsze, upewnij się, że opcja ustawień poczty e-mail jest włączona, aby rozpocząć zarządzanie powiadomieniami e-mail. Następnie możesz zacząć ustawiać powiadomienia e-mail administratora.

Opcja ustawień e-mail

W polu Do adresu wprowadź adres e-mail, na który ma zostać dostarczona wiadomość e-mail. Ponieważ konfigurujemy adres e-mail administratora, możesz wpisać tutaj adres e-mail administratora. Co więcej, możesz użyć tagu inteligentnego {admin_email}, aby automatycznie przechwycić adres e-mail administratora.

Sekcja Od nazwy wyświetla nazwę użytkownika, który przesyła formularz. Możesz przechwycić nazwę użytkownika za pomocą tagu inteligentnego. Tak proste! Musisz jednak upewnić się, że pole nazwy jest wymagane, aby nie było żadnych problemów podczas dostarczania wiadomości e-mail.

Z adresu umożliwia dodanie adresu e-mail, z którego formularz jest wysyłany. Możesz więc dodać tutaj również adres e-mail administratora.

Odpowiedz do umożliwia wprowadzenie adresu e-mail, na który chcesz odpowiedzieć po otrzymaniu wiadomości e-mail. Dlatego możesz użyć tagu inteligentnego, tak jak poprzednio, do przechwycenia poczty e-mail użytkownika.

Oprócz tego możesz dodać temat i treść wiadomości e-mail . Użycie tagu inteligentnego {all_fields} w wiadomości e-mail powoduje wyświetlenie wszystkich informacji w polach formularza wypełnionych przez użytkowników, w tym daty i godziny.

Ustawianie tematu i wiadomości e-mail

Teraz, aby ustawić nowe powiadomienie e-mail, możesz kliknąć przycisk Dodaj nowy e-mail .

Dodaj nowy przycisk e-mail

Następnie nadaj mu nazwę. Na przykład, jeśli ustawiasz adres e-mail użytkownika, możesz nazwać go Powiadomienie użytkownika .

Pseudonim e-mail

Następnie możesz skonfigurować powiadomienie e-mail użytkownika, tak jak wcześniej zrobiliśmy to dla administratora.


Krok 5: Dodaj formularz wyboru daty i godziny WordPress do swojej witryny

Aby formularz był widoczny dla użytkowników, musisz najpierw dodać go do swojej witryny. Everest Forms pozwala na dodanie formularza WordPress do postów lub stron lub gdziekolwiek uznasz to za odpowiednie.

Tutaj pokażemy, jak dodać do postów formularz WordPress z kalendarzem wyboru daty i godziny.

Z pulpitu nawigacyjnego przejdź do Wpisy >> Dodaj nowy .

Dodaj nowy post

Następnie kliknij przycisk Dodaj blok (+) u góry. Ponownie wyszukaj blok Everest Forms i kliknij go.

Blok form Everest

Teraz naciśnij menu rozwijane, aby wybrać żądany formularz.

Wybierz wymagany formularz Formularz kontaktowy WordPress z kalendarzem wyboru daty i godziny

Na koniec podaj tytuł formularza i kliknij przycisk Opublikuj , aby zobaczyć, jak działa formularz. Możesz także wyświetlić podgląd formularza, aby zobaczyć, jak wygląda z interfejsu użytkownika, zanim zostanie uruchomiony.

Przycisk publikowania i podglądu

Alternatywnie możesz przejść do Everest Forms >> All Forms i skopiować krótki kod wymaganego formularza.

Kopiowanie krótkiego kodu formularza za pomocą kalendarza wyboru daty i godziny

Następnie wklej krótki kod do postów lub stron, które lubisz. Na koniec naciśnij przycisk Opublikuj .

Wklej skrót i opublikuj

Wniosek

W ten sposób tworzysz formularz WordPress z selektorem daty i godziny. Dzięki Everest Forms możesz dodawać do swoich formularzy selektory dat w różnych stylach. Wszystkie formularze, które tworzysz za pomocą tej wtyczki, są przyjazne dla urządzeń mobilnych i idealnie dopasowują się do każdego typu i rozmiaru ekranu.

Mamy nadzieję, że możesz teraz łatwo utworzyć formularz kontaktowy WordPress z kalendarzem wyboru daty i godziny. Jeśli uważasz, że ten artykuł był pomocny, udostępnij go również na swoich platformach społecznościowych.

Możesz również śledzić nas na Twitterze i Facebooku, aby uzyskać więcej informacji.

Masz jeszcze trochę wolnego czasu? Następnie możesz zapoznać się z naszymi artykułami na temat tworzenia formularza kontaktowego WordPress z dwiema kolumnami i formularzem podania o pracę.