Niedawno czytelnik zapytał nas, jak dodać obrazy do swoich formularzy WordPress. Może to jest coś, nad czym też się zastanawiałeś.
Zamiast wyświetlać tylko tekst, obrazy mogą natychmiast uczynić Twoje formularze bardziej interesującymi. Może to pomóc poprawić współczynnik odpowiedzi i konwersje formularzy.
W tym artykule pokażemy, jak dodawać obrazy do formularzy WordPress, aby zwiększyć zaangażowanie i konwersje.
Jakie są wybory dotyczące obrazów i dlaczego warto ich używać w formularzach?
Opcje obrazów to zdjęcia, ilustracje, grafiki lub ikony, które użytkownicy mogą wybierać podczas wypełniania formularza.
Oto formularz wykorzystujący wybór obrazów, a nie zwykłe opcje tekstowe. Pierwszy wybór, Truskawki, został wybrany:
Wybór obrazu może być zaletą na wiele sposobów. We wszystkich przypadkach pozwalają one uczynić twoją formę bardziej atrakcyjną i atrakcyjną wizualnie.
Korzystanie z obrazów może również pomóc nadać formularzom bardziej dopracowany i profesjonalny wygląd. Mogą również pomóc użytkownikom w szybszym podejmowaniu decyzji.
Na przykład, jeśli prowadzisz restaurację, która oferuje dostawę, chcesz mieć formularz zamówienia w swojej witrynie. Możesz użyć zdjęć swoich różnych potraw, aby pomóc potencjalnym klientom wybrać to, czego chcą.
Wybór obrazu może ułatwić czytelnikom wypełnienie formularza, zwłaszcza w przypadku osób mających problemy z czytaniem lub osób, które nie mówią płynnie w Twoim języku.
Samouczek wideo
Jeśli wolisz instrukcje pisemne, po prostu czytaj dalej.
Dodawanie wyborów obrazu do formularzy WordPress
W tym samouczku będziemy używać wtyczki WPForms . Jest to najlepsza wtyczka do tworzenia formularzy WordPress na rynku i umożliwia łatwe tworzenie formularzy za pomocą prostego kreatora formularzy typu „przeciągnij i upuść”.
Najpierw musisz zainstalować i aktywować wtyczkę WPForms . Jeśli nie wiesz, jak to zrobić, zapoznaj się z instrukcjami krok po kroku w naszym przewodniku , jak zainstalować wtyczkę WordPress .
WPForms to wysokiej jakości wtyczka WordPress. Oferują również bezpłatną wersję o nazwie WPForms Lite , która ma również funkcję wyboru obrazu.
Tworzenie formularza z WPForms
Po aktywowaniu wtyczki przejdź do strony WPForms »Dodaj formularz na pulpicie nawigacyjnym WordPress, aby utworzyć nowy formularz.
Najpierw podaj nazwę formularza, a następnie kliknij, aby wybrać szablon. Punktem wyjścia będzie prosty formularz kontaktowy.
Spowoduje to uruchomienie interfejsu konstruktora WPForms z wstępnie załadowanymi polami formularzy. Możesz edytować dowolne pole formularza, klikając je, przesuwając je w górę iw dół lub usuwając.
Następnie dodamy pole wielokrotnego wyboru, aby klienci mogli wybrać rodzaj owoców, które chcą.
Uwaga: Opcje obrazu działają również z polem wyboru. Użyj tego, jeśli chcesz, aby Twój użytkownik mógł wybrać więcej niż jedną opcję.
Aby dodać pole, po prostu przeciągnij i upuść pole wielokrotnego wyboru z sekcji Pola standardowe po lewej stronie ekranu. Zamierzamy umieścić go tuż nad polem „Komentarz lub wiadomość”.
Jak widać, pole wielokrotnego wyboru ma domyślnie opcje tekstowe. Jeśli klikniesz pole, aby je edytować, zobaczysz opcje pola po lewej stronie ekranu.
Tutaj wystarczy zaznaczyć pole „Użyj opcji obrazu”, a WPForms automatycznie zaktualizuje pole.
Możesz wpisać cokolwiek chcesz dla etykiety tekstowej pola, a następnie kliknąć przycisk „Prześlij obraz”. Możesz przesłać obraz z komputera lub wybrać go z biblioteki multimediów WordPress.
Zalecamy używanie obrazów w formacie .jpg lub .png, które nie są większe niż 250 na 250 pikseli. Twoje obrazy będą wyglądać najlepiej w Twojej formie, jeśli wszystkie będą tego samego rozmiaru.
Ważne: WPForms nie zmieniają rozmiaru obrazów. Przed przesłaniem upewnij się, że mają odpowiedni rozmiar. Alternatywnie, możesz edytować swój obraz w WordPress przed dodaniem ich do formularza.
Jeśli masz więcej niż 3 opcje do uwzględnienia, po prostu kliknij przycisk (+), aby dodać nowy wybór. Możesz użyć przycisku (-), aby usunąć wybór.
Zmiana sposobu wyświetlania wybranych obrazów w formularzu
WPForms ułatwia zmianę układu wyboru obrazu i innych ustawień na karcie „Opcje zaawansowane”.
Możesz zaznaczyć pole „Randomize Choices”, jeśli chcesz, aby wybrane obrazy były wyświetlane losowo, a nie w określonej kolejności. Jest to przydatne, jeśli tworzysz ankietę i chcesz wyeliminować błąd pierwszego wyboru w wynikach.
W sekcji „Styl wyboru obrazu” możesz wybrać, w jaki sposób chcesz stylizować swoje obrazy. Styl domyślny to Nowoczesny, który wygląda tak z wybraną opcją Truskawki:
Zamiast tego możesz wybrać styl Klasyczny, który wygląda tak, gdy wybrana jest opcja Truskawki:
Alternatywnie możesz wybrać „Brak” dla stylu. W takim przypadku Twoje obrazy będą zwykłymi obrazami bez obramowania lub innej stylizacji. Etykiety zostaną wyświetlone z przyciskami radiowymi.
Jeśli chcesz, możesz także zmienić układ swoich wyborów za pomocą menu rozwijanego „Układ wyboru”. Domyślnie jest to „W tekście”, a wybrane opcje pojawiają się obok siebie, aż zostaną umieszczone w nowym wierszu.
Zamiast tego możesz wybrać wyświetlanie swoich wyborów w kilku kolumnach. Jeśli potrzebujesz listy pionowej, po prostu wybierz z menu „Jedna kolumna”. Wybrane przez Ciebie obrazy będą wyglądać następująco:
Istnieje również opcja „Ukryj etykietę” dla wybranych obrazów. Oznacza to, że pod obrazami nie będzie żadnego tekstu. W niektórych przypadkach może to mieć sens. Na przykład możesz prosić ludzi o głosowanie na ten nowy projekt logo, który najbardziej im się podoba.
Pamiętaj jednak, aby w miarę możliwości wprowadzić odpowiednią i pomocną etykietę. Będzie on wyświetlany jako tekst alternatywny dla Twoich obrazów, dzięki czemu Twoja witryna będzie bardziej dostępna dla użytkowników niedowidzących.
Dodawanie, usuwanie lub edytowanie pól w formularzu
Możesz dodawać, usuwać lub edytować pola w swoim formularzu. Aby edytować pole, wystarczy je kliknąć.
Na przykład możesz chcieć zmienić pole „Komentarz lub wiadomość”, aby było opcjonalne i miało inną etykietę. Po kliknięciu pola możesz je edytować po lewej stronie ekranu.
Po prostu wpisz etykietę, której chcesz użyć, i odznacz pole „Wymagane”, aby uczynić to pole opcjonalnym.
Aby usunąć pole, najedź na nie kursorem, a następnie kliknij czerwoną ikonę kosza.
Gdy jesteś zadowolony z formularza, kliknij przycisk „Zapisz” u góry ekranu.
Dodawanie formularza do witryny internetowej
Możesz dodać swój formularz do dowolnego postu lub strony w Twojej witrynie za pomocą kilku kliknięć. Zamierzamy utworzyć nową stronę dla naszej.
Przejdź do Strony »Dodaj nowy , a następnie kliknij przycisk (+), aby dodać blok do swojej strony.
Znajdź blok WPForms w sekcji Widgets lub wyszukaj go za pomocą paska wyszukiwania. Następnie kliknij blok, aby dodać go do swojej strony.
Następnie kliknij menu „Wybierz formularz” i kliknij nazwę swojego formularza, aby go wybrać. Używamy tutaj naszego formularza zamówienia pudełka na owoce.
Teraz możesz opublikować swoją stronę i zobaczyć swój formularz w witrynie. Oto jak wygląda nasz:
Jeśli chcesz wprowadzić zmiany w swoim formularzu, możesz go znaleźć w WPForms »All Forms na pulpicie nawigacyjnym. Po zapisaniu zmian formularz zostanie automatycznie zaktualizowany również na Twojej stronie.
Mamy nadzieję, że ten samouczek pomógł Ci nauczyć się dodawać obrazy w formularzach WordPress. Możesz również polubić nasz przewodnik dotyczący tworzenia ankiet w WordPress oraz nasze porównanie najlepszych wtyczek do tworzenia stron WordPress .
Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube z samouczkami wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku .
