Jak budować formularze zamówień z płatnościami za darmo w WordPress

Tracisz 100% Sprzedaży, o którą nie prosisz, i to samo dotyczy niezgrabnych zakupów. Formularze zamówień pomagają w skutecznym zbieraniu informacji o zamówieniach i przetwarzaniu płatności, co znacznie zwiększa współczynnik konwersji.

Forminator sprawia, że łatwiej niż kiedykolwiek zbudować formularz zamówienia i akceptować płatności na WordPress. A najlepsze jest to, że jest całkowicie za darmo! Obejmuje to bramki płatności PayPal i Stripe!

Niezależnie od tego, czy planujesz sprzedać towar, zebrać darowizny czy zarezerwować pokoje, Forminator zrobi to wszystko bez pomijania rytmu. Jego prosty interfejs “przeciągnij i upuść” oznacza, że nie musisz znać żadnego kodowania. To naprawdę jedna wtyczka do tworzenia formularzy, która rządzi nimi wszystkimi!

** Niech żyje Forminator!**

W tym poście pokażę Ci krok po kroku, jak korzystać z Forminatora, aby zbudować formularz zamówienia od podstaw i skonfigurować go, aby bez wysiłku pobierał płatności za pomocą Stripe i/lub PayPal.

Przedstawiamy fantastycznego Forminatora

Forminator jest potęgą wtyczki formularza. Obsługuje logikę warunkową, przechowuje wszystkie wpisy formularza w łatwo dostępnej bazie danych, wysyła e-maile zarówno do Użytkownika, jak i administratora, i robi to wszystko bez przeładowywania strony.

Aby doładować formularze, Forminator integruje się z popularnymi narzędziami innych firm, takimi jak Mailchimp, AWeber, ActiveCampaign, Google Sheets, Zapier i Slack. Oto przewodnik integracji, aby zautomatyzować przepływ pracy formularzy za pomocą zapiera.

Jest również zgodny z GDPR i bezproblemowo współpracuje z nowym edytorem bloków Gutenberga WordPress. Jeśli można wymyślić formę, Forminator może prawie na pewno to zrobić.

Zbudujmy Formularz Zamówienia

W tym demo zbudujemy prosty formularz zamówienia, taki jak ten poniżej, aby sprzedać Niestandardowy notebook. Sprawimy, że użytkownicy będą mogli wprowadzić swoje dane osobowe (takie jak imię i nazwisko, adres, adres e-mail i numer telefonu), a następnie na samym końcu złożyć zamówienie, dokonując płatności.

Screenshot of the order form we'll be building

Wykonaj poniższe czynności i / lub ciesz się filmem, który przygotowaliśmy, aby dołączyć do tego postu:

Krok 1: Zainstaluj Forminator

Aby zainstalować Forminator, po prostu przejdź do pulpitu WordPress i pod Wtyczki, wybierz Dodaj Nowy i Szukaj Forminator. Kliknij na Zainstaluj Teraz przycisk i Aktywuj wtyczka po instalacji.

Jeśli jesteś członkiem WPMU DEV, Możesz również zainstalować i aktywować Forminator Pro bezpośrednio z pulpitu WPMU DEV. Jeśli nie jesteś jeszcze członkiem, na co czekasz? Wypróbuj bezpłatnie (i w 100% bez ryzyka) z naszym członkostwem Bezpłatne Próbne!

Korzystanie z bezpłatnego WordPress.org Wersja Forminatora jest też całkowicie fajna. Ten poradnik działa doskonale z either version.

Krok 2: Uzyskaj dostęp do Pulpitu Nawigacyjnego Forminatora

Przejdź do Pulpitu Nawigacyjnego Forminatora. Dzięki temu uzyskasz szybki przegląd wszystkich formularzy, quizów i ankiet.

Minimalistyczny, a jednocześnie łatwy w użyciu pulpit nawigacyjny forminatora.

Nie zobaczysz tutaj żadnych danych, ale gdy zaczniesz tworzyć formularze i zbierać wpisy użytkowników, pulpit nawigacyjny zacznie wypełniać się widokami, zgłoszeniami, współczynnikami konwersji i innymi interesującymi danymi.

Krok 3: stwórzmy formularz

Przejdź do Forminator > Formularze i kliknij jeden z niebieskich Utwórz przyciski, aby rozpocząć tworzenie nowego formularza. Możesz również zrobić to samo bezpośrednio z Pulpitu Nawigacyjnego Forminatora.

Pojawi się okienko, w którym musisz wprowadzić nazwę nowego formularza. Zachowaj nazwę formularza unikalną i zapadającą w pamięć, abyś mógł ją łatwo przywołać. Kliknij niebieski Utwórz przycisk po wpisaniu nazwy formularza.

Domyślnie każdy formularz w Forminatorze zawiera następujące predefiniowane pola: Imię, Adres E-Mail, Numer Telefonu, oraz Wiadomość.

Domyślne pola formularza można edytować lub usuwać, a dzięki opcji dodawania wielu innych pól masz nieograniczone możliwości dostosowywania.

Uwaga: pola oznaczone czerwoną gwiazdką ( * ) na końcu są Wymagane pola. Formularz nie zostanie przesłany, dopóki użytkownik ich nie wypełni.

Krok 4: dodawanie pól formularza zamówienia

Zatrzymamy Imię, Adres E-Mail oraz Numer Telefonu pola, i usunąć Wiadomość pole, którego nie potrzebujemy do tego formularza.

W Imię pole, kliknij ikonę koła zębatego i wybierz Duplikat. Jest to szybszy sposób wstawiania wielu pól tego samego typu bez dostępu do Wstaw Pola menu wielokrotnie.

Zmień nazwę zduplikowanego pola na Nazwisko.

Przeciągnij Nazwisko pole do tego samego wiersza co Imię, po jego prawej stronie, tak, że pojawiają się obok siebie w formie.

I tak po prostu, masz dwukolumnowy wiersz w swojej formie.

Wszystkie pola Forminator można przeciągać i upuszczać do wierszy i kolumn, dzięki czemu można uzyskać maksymalną elastyczność w projektowaniu formularzy dokładnie tak, jak chcesz.

Następnie kliknij na fioletowy Wstaw Pola guzik. Powinien otworzyć okienko z wszystkimi opcjami pól, które możesz dodać do formularza. Jest też inny Wstaw Pola link na dole formularza.

1″ />

Wybierz Adres opcja z wyskakującego okna i kliknij Wstaw Pola guzik.

Po włożeniu kliknij na Adres wiersz, aby otworzyć swoje ustawienia pól. W Etykiety zakładka, możesz aktywować lub dezaktywować różne pola podrzędne adresów (wszystkie są domyślnie włączone).

Pod spodem Ustawienia tab, Zaznacz wszystkie pola adresu jako wymagane, ponieważ są one niezbędne do wysyłki produktu.

Na koniec kliknij ikonę koła zębatego Wiadomość pole i uderzenie Usunąć.

Możesz zachować Wiadomość pole jeśli chcesz dać użytkownikom możliwość dodania komentarza lub preferencji.

Krok 5: Dodanie przycisku płatności Stripe i integracja

Kliknij na fioletowy Wstaw Pola przycisk i wybierz Stripe opcja.

Stripe umożliwia doładowanie sprzedaży online za pomocą bezproblemowej i bezpiecznej bramki płatności.

Uwaga: do skonfigurowania pola Stripe potrzebne jest aktywowane konto Stripe. W przeciwnym razie nie pozwoli Ci go edytować. Jeśli potrzebujesz pomocy, aby go skonfigurować, użyj dokumentacji Forminatora jako arkusza cheatsheet.

Możesz skonfigurować Stripe idąc do Ustawienia > Płatności > Stripe pod Forminator.

Po skonfigurowaniu paska, pod Stripe ustawienia pola, musimy ustawić kwotę płatności. Ponieważ jest to pojedynczy produkt w cenie all inclusive i bez zmian, wybierzemy Poprawiono możliwość płatności.

Gdy wejścia użytkownika wpływają na cenę (np. T-shirty o różnych rozmiarach lub opcje dostosowywania), lub jeśli istnieje kalkulacja, taka jak podatek lub wysyłka, która zostanie dodana do pierwotnej ceny, Zmienna zamiast tego należy użyć opcji.

Wybierz Poprawiono w Stripe pole Ustawienia i wprowadź kwotę.

Ponadto należy zwrócić uwagę na Test oraz Live opcje trybu wymienione na górze tutaj. Będziemy używać Test na razie Moda.

Na karcie Zaawansowane możesz dodać ustawienia zaliczki, takie jak potwierdzenie płatności, szczegóły płatności, dane rozliczeniowe i metadane.

Następnie zmień Kontakt Etykieta przycisku z Wyślij Wiadomość na Zamów Teraz.

Przejrzyj formularz i upewnij się, że działa zgodnie z twoim zamiarem. Możesz edytować domyślne symbole zastępcze w formularzu, jeśli nie odpowiadają twoim potrzebom.

Formularz zamówienia jest gotowe!

Uwaga: Możesz również skonfigurować system PayPal przy użyciu tej samej metody opisanej powyżej. Wystarczy włożyć PayPal pole zamiast Stripe. Nie można jednak wstawić obu pól. W tej chwili możesz korzystać tylko z jednej bramki płatności w formie.

Krok 6: Let ‘ s Jazz It Up

Forminator umożliwia łatwe wprowadzanie podstawowych zmian stylu w formularzu. Na Wygląd sekcja pomaga ustawić formularz Styl Projektowania, Kolory, Czcionki, Padding, Granice, Odstępy, itp.

Kliknij na Wygląd przycisk, aby przejść do jego ustawień.

Możesz wybrać preferowany styl tutaj. Podoba mi się wygląd Płaskie styl więcej niż Default jeden, jednak ten wybór należy do ciebie. Oferuje również sposób na dodanie Custom CSS dla Twojej formy.

Co do Kolory oraz Czcionki, Wolę domyślne tematy i zostawię je takie, jakie są. Zapisz wersję roboczą formularza po wprowadzeniu zmian.

Krok 7: Formularz Przesłany. Co Dalej?

Forminator jest jak fajny i przypadkowy profesor. Jest zabawny i inteligentny, ale również dba o to, aby formy zachowywały się prawidłowo.

W Zachowanie ustawienia, możesz określić, jak formularz będzie się zachowywał po pomyślnym przesłaniu formularza przez użytkownika lub w tym przypadku złożeniu zamówienia.

Domyślnie w formularzu pojawi się wiadomość wbudowana, która zostanie automatycznie zamknięta w ciągu 5 sekund. Zmień wiadomość tutaj, aby lepiej odzwierciedlić formularz zamówienia.

Masz również możliwość przekierowania użytkownika na nową stronę lub całkowitego ukrycia formularza.

Jeśli zbierasz płatności, zaleca się, aby mieć”Wymagaj certyfikatu SSL, aby przesłać ten formularz“opcja zaznaczona. Umożliwi to formularzowi bezpieczne pobieranie płatności.

Reszta Zachowanie ustawienia można pozostawić tak, jak jest.

Krok 8: napisz do mnie proszę, a także do użytkownika

Po zakończeniu ustawiania Zachowanie, przejdź do Powiadomienia E-Mail ustawienia.

Domyślnie każdy formularz wyśle Ci (administratorowi) wiadomość e-mail ze szczegółami wszystkich wprowadzonych pól formularza.

Możesz go zmienić i / lub dodać wielu odbiorców. Masz również możliwość dodania Cc oraz Bcc pola do wiadomości e-mail.

Dobrą praktyką jest wysyłanie użytkownikowi wiadomości e-mail z automatycznym potwierdzeniem zamówienia. Tę opcję można włączyć w Powiadomienia E-Mail ustawienia.

Upewnij się, że odbiorca jest ustawiony na Adres E-Mail, która jest etykietą adresu e-mail wprowadzonego przez użytkownika w formularzu. Na przykład, jeśli użytkownik wprowadzi [email protected] jako adres e-mail w formularzu, wiadomość e-mail z potwierdzeniem zamówienia zostanie wysłana na ten adres automatycznie.

na e-mail.jpg” alt=”” width=”600″ height = “257” / >

Forminator pozwala również ustawić Integracje z różnymi aplikacjami innych firm i zmień ogólne Ustawienia formularza. Dla tego formularza zamówienia nie będziemy dodawać żadnych Integracje i będzie trzymać się ustawień domyślnych.

Krok 9: naciśnij przycisk Publikuj

Podgląd formularza po raz ostatni przed naciśnięciem Publikuj guzik.

Poklepcie się po plecach. Właśnie stworzyłeś swój pierwszy formularz zamówienia!

Po uderzeniu w Publikuj przycisk, wyskakujące okienko pokaże Ci krótki kod formularza. Skopiuj i umieść ten krótki kod w dowolnym miejscu witryny, aby wyświetlić go użytkownikom.

Możesz również skopiować skrócony kod później z Pulpitu Nawigacyjnego Forminatora.

Krok 10: Dodaj Formularz Zamówienia do strony Sprzedaży

Utwórz stronę sprzedaży, jeśli jeszcze jej nie masz. Powinien zawierać wszystkie ważne szczegóły produktu, takie jak nazwa, obraz, opis, cena itp.

Jeśli używasz wtyczki edytora Classic, możesz skopiować i wkleić krótki kod, aby dodać formularz do swojego posta/strony. W przypadku witryn, które używają domyślnego edytora bloków, dodanie formularza jest znacznie prostsze.

Aby złożyć formularz zamówienia na dole strony sprzedaży, w edytorze postów/stron WordPress, kliknij Plus ikona i dodaj Formularz blok.

Następnie wybierz Formularz Zamówienia tutaj, aby dodać go do strony.

Publikuj lub Aktualizacja Twoja strona sprzedaży po dodaniu do niej formularza zamówienia.

Odwiedzający Twoją stronę mogą teraz skorzystać z tego formularza, aby złożyć zamówienie. To takie proste!

Ważna Uwaga: Stripe pole w formularzu zamówienia jest nadal ustawione na Test Moda. Ma to pomóc w dokonywaniu płatności testowych i upewnić się, że wszystko działa dobrze. Przed przyjęciem rzeczywistych zamówień należy je zmienić z Test na Live.

Po złożeniu zamówienia zostaniesz o tym powiadomiony pocztą. Forminator przechowuje również wszystkie przesłane formularze w bazie danych, dzięki czemu łatwiej jest je później sortować.

Aby zobaczyć wszystkie zgłoszenia formularza, odwiedź Forminator > Formularze na desce rozdzielczej. Kliknij ikonę koła zębatego i wybierz Zobacz Zgłoszenia.

Możesz kliknąć dowolny wiersz zgłoszenia, aby uzyskać jego pełne dane. Możesz również nacisnąć Eksport przycisk, aby pobrać wszystkie zgłoszenia jako .plik csv.

Reach > Engage > Convert

Prowadzenie biznesu online wiąże się z wieloma wyzwaniami. Wszystko, co pomaga nawiązać kontakt z potencjalnymi klientami i łatwiej zarabiać, jest mile widzianym dodatkiem i to właśnie forminator tak.

Stworzyliśmy tutaj najprostsze formularze zamówień, które można wykonać za pomocą Forminatora. Dzięki obsłudze logiki warunkowej może zrobić znacznie więcej!

Możesz ustawić podatki, stawki wysyłki, zmiany produktów, a następnie automatycznie obliczyć ostateczną kwotę zamówienia.

Gotowy do tworzenia formularzy na nowym poziomie? Dowiedz się więcej tutaj.

Zacznij tworzyć!

Tagi: