Jak dodać pole WYSIWYG w formularzach WordPress?

Zastanawiasz się, jak dodać pole WYSIWYG w formularzach WordPress? Cóż, zostań z nami do końca, aby dowiedzieć się dokładnie jak.

Mówiąc najprościej, WYSIWYG (wymawiane wiz-ee-wig) to oprogramowanie do edycji. To niesamowite narzędzie pokazuje, jak treść będzie wyglądać po jej opublikowaniu.

Podobnie w polu formularza WYSIWYG tekst wpisywany do edytora przypomina wygląd opublikowanego tekstu. A jeśli potrzebujesz pola WYSIWYG w swoim formularzu, jesteśmy tutaj, aby Ci pomóc.

W tym artykule omówimy pole WYSIWYG i kroki, aby dodać je do formularza. Zaczynajmy!

Co to jest pole WYSIWYG i dlaczego go potrzebujesz?

WYSIWYG , skrót od What You See Is What You Get , to edytor używany w większości witryn WordPress. Ten edytor umożliwia użytkownikom manipulowanie układem lub treścią bez konieczności wpisywania jakichkolwiek poleceń.

Na przykład, gdy użytkownicy piszą dokument za pomocą edytora tekstu, używa on WYSIWYG. To powiela to, co tworzą, edytują lub formatują w drukowanym dokumencie lub pliku PDF.

W ten sposób dodanie pola WYSIWYG do formularza WordPress zapewnia edytor dla użytkowników. Mogą wpisać w pole dowolną treść i odpowiednio ją sformatować. Dzięki polu WYSIWYG możesz:

• Pozwól użytkownikom przesyłać posty gości za pomocą formularza frontonu.
• Pozwól użytkownikom zobaczyć, jak treść będzie wyglądać po opublikowaniu podczas edycji.
• Umożliw użytkownikom bez znajomości programowania korzystanie z tego edytora.

Mając to na uwadze, musisz również mieć narzędzie, które pozwala bezproblemowo dodać pole WYSIWYG. A Everest Forms to idealna wtyczka do tego! Jest to kreator formularzy WordPress typu „przeciągnij i upuść”, który oferuje pole WYSIWYG. Możesz dodać to pole do swojego formularza w dowolnym celu.

Dlatego użyjemy tej wtyczki, aby pokazać, jak dodać pole WYSIWYG do formularzy.

Jak dodać pole WYSIWYG w formularzach WordPress?

Krok 1: Zainstaluj i aktywuj Everest Forms i Everest Forms Pro

Pierwszą rzeczą, którą musisz zrobić, to skonfigurować Everest Forms i Everest Forms Pro na pulpicie WordPress.

Tak, będziesz potrzebować wersji pro wtyczki. To dlatego, że pole WYSIWYG jest odblokowane tylko w wersji premium.

Aby uzyskać szczegółowy przewodnik, zapoznaj się z naszym artykułem na temat instalacji Everest Forms Pro.

Krok 2: Utwórz nowy formularz niestandardowy

Po zakończeniu instalacji wtyczki otwórz Everest Forms >> Dodaj nowy . Na stronie Dodaj nowy formularz znajdziesz zbiór gotowych szablonów formularzy. Możesz jednak zacząć od zera.

W tym samouczku zaczniemy od zera. Kliknij więc Zacznij od zera i nazwij swój formularz. Tutaj nazwiemy go „Formularz WYSIWYG” i wciskamy Kontynuuj.

Możesz zbudować dowolny rodzaj formularza zgodnie z własnymi wymaganiami; może to być formularz kontaktowy, formularz wniosku urlopowego, formularz postu gościa itp.

Wszystko, co musisz zrobić, to przeciągnąć i upuścić niezbędne pola do edytora formularzy i kliknąć Zapisz .

Krok 3: Dodaj i dostosuj pole WYSIWYG w swoim formularzu

Dodanie pola WYSIWYG za pomocą Everest Forms w formularzu to bułka z masłem. Po prostu przeciągnij i upuść pole WYSIWYG z Zaawansowanych Pól do formularza.

Ponadto możesz dostosować pole WYSIWYG. Wystarczy kliknąć pole, a jego opcje pola pojawią się po lewej stronie.

Następnie możesz wprowadzić zmiany w opcjach pola, jak wyjaśniono poniżej:

• Etykieta : tutaj możesz zmienić etykietę pola, wprowadzając, jaka ma być etykieta.
• Meta Key : Meta klucz przechowuje dane pola w Twojej bazie danych i pobiera je w razie potrzeby.
• Opis : W tym miejscu można wprowadzić tekst opisu pola formularza.

Następnie możesz po prostu zaznaczyć Wymagane , Podpowiedź i Weryfikuj jako unikalne , jeśli chcesz, aby te opcje były włączone.

Przewiń w dół do opcji zaawansowanych , gdzie znajdziesz:

• Tekst zastępczy : Możesz wprowadzić tekst zastępczy pola formularza. Na przykład napisaliśmy: „Tu wpisz swoją wiadomość”.
• Ukryj etykietę : możesz po prostu zaznaczyć tę opcję, aby ukryć etykietę pola.
• Wartość domyślna : Tutaj możesz wprowadzić tekst dla domyślnej wartości pola formularza lub po prostu wybrać wymagane pole, klikając przycisk <> .
• Klasy CSS : Możesz także dodać niestandardowe klasy CSS w celu dalszego dostosowania.

W razie potrzeby możesz nawet zastosować logikę warunkową do pola za pomocą opcji Włącz logikę warunkową .

Na koniec możesz nacisnąć przycisk Zapisz u góry. Jeśli chcesz zobaczyć podgląd swojego formularza, kliknij Podgląd .

Jak widać, pole WYSIWYG w Everest Forms pozwala użytkownikom Twojej witryny przełączać się między dwoma trybami:

• Wizualny : Obrazy i tekst są wyświetlane bezpośrednio w edytorze tekstu.
• Tekst : Obrazy i tekst są wyświetlane w formacie HTML.

Oto lista opcji paska narzędzi, które znajdziesz dla trybu wizualnego w polu WYSIWYG:

• Pogrubienie
• italski
• Lista punktowana
• Lista numerów
• Zablokować cytat
• Wyrównaj do lewej
• Wyrównaj środek
• Wyrównaj w prawo
• Wstaw/edytuj link
• Wstaw tag Czytaj więcej
• Pełny ekran

Aby wyświetlić dodatkowe opcje, kliknij ikonę ToolBar Toggle .

Oto lista wszystkich dostępnych opcji dodatkowych:

• Przekreślenie
• Linia pozioma
• Kolor tekstu
• Wklej jako tekst
• Wyczyść formatowanie
• Specjalny charakter
• Zmniejsz wcięcie
• Zwiększ wcięcie
• Skróty klawiszowe

Dodatkowo użytkownicy będą mogli wybrać formaty tekstu, takie jak Akapit, Nagłówek itp. Z menu rozwijanego.

Z drugiej strony użytkownicy muszą wpisać znaczniki HTML w polu, jeśli wybiorą tryb tekstowy . Nad polem znajduje się lista popularnych tagów HTML, które użytkownik może bezpośrednio dodać do edytora zamiast je wpisywać.

Krok 4: Skonfiguruj ustawienia formularza

Następnie otwórz kartę Ustawienia formularza, aby skonfigurować ustawienia formularza. Tutaj znajdziesz 3 sekcje z różnymi opcjami dostosowywania.

Ogólne: w ustawieniach ogólnych możesz edytować Opis formularza , Komunikat o wyłączeniu formularza , Włącz logikę warunkową , Projekty układu itp.

E-mail: Ustawienia poczty e-mail umożliwiają tworzenie szablonów powiadomień e-mail dla administratorów i użytkowników.

WebHook: Za pomocą elementu WebHook możesz wysłać dane formularza do dowolnego zewnętrznego adresu URL. Wszystko, co musisz zrobić, to ustawić adres URL żądania, metodę żądania, format żądania i nagłówek żądania .

Na koniec możesz nacisnąć przycisk Zapisz .

Krok 5: Wyświetl swój formularz na stronie internetowej

Udało Ci się stworzyć formularz używając Everest Forms, aby dodać pole WYSIWYG. Ale nie będzie widoczny dla użytkowników, chyba że wyświetlisz formularz w witrynie WordPress.

Dlatego, aby dodać formularz do swojej witryny, możesz użyć dowolnej z tych dwóch metod.

Pierwszym sposobem jest skopiowanie skróconego kodu formularza z góry kreatora.

Następnie utwórz nową stronę lub post, a przejdziesz do edytora Gutenberga. Tutaj naciśnij ikonę Dodaj blok ( + ) i wyszukaj blok Shortcode . Następnie kliknij blok, aby dodać go do strony lub posta.

Następnie wklej właśnie skopiowany kod do bloku i kliknij przycisk Opublikuj .

Otóż ​​to! Twój formularz zostanie wyświetlony w Twojej witrynie.

Alternatywnie, możesz użyć bloku Everest Forms , aby wyświetlić swój formularz. Kliknij przycisk ( + ) i wyszukaj blok Everest Forms .

Dodaj go do strony i wybierz formularz WordPress WYSIWYG z rozwijanego menu.

Na koniec możesz nacisnąć przycisk Opublikuj u góry.

Zawijanie!

I to jest podsumowanie naszego przewodnika, jak dodać pole WYSIWYG w formularzach WordPress. Wszystko czego potrzebujesz to niesamowita wtyczka Everest Forms. Możesz po prostu przeciągnąć i upuścić pole WYSIWYG do formularza i dostosować go bez żadnych kłopotów.

To nie wszystko, co możesz zrobić z Everest Forms. Możesz użyć tej potężnej wtyczki, aby włączyć podgląd wpisów w formularzach wieloczęściowych, włączyć warunkowe przekierowanie po przesłaniu formularza i nie tylko.

Przeczytaj więcej o Everest Forms na naszym blogu, jeśli jesteś zainteresowany. Możesz również odwiedzić nasz kanał YouTube, aby zapoznać się z prostymi samouczkami wideo.

Nie zapomnij też śledzić nas na Facebooku i Twitterze, aby otrzymywać aktualizacje.