Dodawanie niestandardowych pól na stronie zamówienia

Dane dotyczące płatności to część będąca elementem domyślnym formularza zamówienia w sklepie WooCommerce. Jeśli potrzebujesz dodać tam niestandardowe pola, możesz skorzystać z wtyczki Flexible Checkout Fields. W tym artykule pokażę Ci, jak to zrobić!
Finalizacja zamówienia – Dane rozliczeniowe
Jak domyślnie wygląda sekcja dotycząca danych rozliczeniowych?
Ten widok na pewno nie jest Ci obcy:
Chcesz zmienić ten układ? Nie ma problemu! Nie osiągniesz tego jednak bez pomocy dodatkowej wtyczki. Pokażę Ci wtyczkę, dzięki której zyskasz możliwość dodania takich pól jak:
- Pojedyncza linia (input)
- Obszar tekstowy (textarea)
- Wybór (checkbox)
- Wybór (radio)
- Lista rozwijana (select)
- Data
- Czas
- Wybór koloru
- Nagłówek
- HTML lub zwykły tekst
- Przesyłanie pliku
Oto jak wyglądają:
Jeśli chcesz, możesz nadać tym polom unikalne stylowanie z użyciem CSS. Ja skorzystałem z domyślnego motywu Storefront. Z tego powodu pola, jak i cała strona zamówienia, wygląda dość surowo :)
Z pomocą wtyczki można także umieścić dwa niestandardowe pola w jednym wierszu.
Jeśli takie rozwiązanie Tobie odpowiada, przejdźmy do omówienia wtyczki.
Flexible Checkout Fields
Wtyczka ta jest autorstwa WP Desk. Korzysta z niej już prawie 10.000 sklepów na całym świecie!
Ludzie mówią, że wtyczka jest bardzo przydatna :) Zobacz na przykładową opinię:
Z pomocą tej wtyczki dodasz niestandardowe pola na stronie zamówienia w WooCommerce. Jednak dzięki tej wtyczce można zrobić o wiele więcej!
Z pomocą Flexible Checkout Fields możesz:
- z łatwością dodawać niestandardowe pola do formularza zamówienia,
- edytować istniejące, domyślne pola WooCommerce,
- zmieniać układ pól na formularzu zamówienia itp.
Wtyczkę można pobrać bezpłatnie, jednak wersja darmowa nie zawiera wszystkich typów pól. W razie potrzeby jest też możliwość skorzystania z płatnej wersji.
Wersja bezpłatna posiada ograniczenie polegające na możliwości konfiguracji dwóch rodzajów pól:
- pojedynczej linii tekstu,
- tekstu akapitu.
Przed zakupem wersji płatnej zalecamy jednak wypróbowanie wersji darmowej.
Pobierz Flexible Checkout Fields →
Niestandardowe pola z użyciem wtyczki
Po zainstalowaniu i aktywacji wtyczki, możesz ją skonfigurować.
Przejdź do WooCommerce → Pola zamówienia. Znajdziesz tu sekcję o nazwie Płatność. Wybierz Typ pola, nadaj Etykietę oraz kliknij przycisk Dodaj pole:
W zależności od wersji (darmowa lub płatna) do wyboru będziesz mieć 2 lub 11 typów pól.
Teraz możesz przejść do konfiguracji nowego pola.
Dla niektórych typów pól przewidziano ten sam zestaw opcji, takich jak:
- Pole wymagane
- Walidacja
Możesz skorzystać z pierwszej opcji, jeśli chcesz, aby klient musiał wprowadzić wartość do pola. Bez wypełnienie pola nie będzie możliwe dokonanie zamówienia.
Druga opcja pozwala na sprawdzenie danych wprowadzonych w pole przez klienta. Więcej informacji na temat tej funkcji znajdziesz w naszym artykule w języku angielskim: WooCommerce Checkout Validation →
Pola wyboru i listy rozwijane posiadają dodatkowe ustawienia – Opcje:
Na ekranie Flexible Checkout Fields można również zmienić domyślne rozmieszczenie niestandardowych pól.
Dodatkowe użyteczne funkcje
To dopiero początek. Niestandardowe pola, jak również te domyślne, możesz konfigurować na wiele sposobów.
W zakładce Wygląd możesz dodać placeholder lub własną klasę CSS. Ta druga opcja umożliwia zmianę wyglądu pola.
W zakładce Wyświetlanie znajdują się opcje, dzięki którym ustalisz, w jakim miejscu mają pojawiać się pola.
Ta funkcja również nie ogranicza Cię do niestandardowych pól. Możesz wyłączyć wyświetlanie pól na przykład na stronie Moje konto. To strona, którą Twoi klienci widzą po zalogowaniu.
Ostatnia zakładka daje możliwość konfiguracji logiki warunkowej.
O tym wszystkim przeczytasz w dokumentacji Flexible Checkout Fields →
Gorąco Cię do tego zachęcam!
Podsumowanie
Wiesz już, jak do Twojego sklepu WooCommerce dodać niestandardowe pola.
Czy niniejszy artykuł okazał się pomocny? Czy potrzebujesz dodatkowych informacji? Jak możemy Ci pomóc w konfiguracji Twojego sklepu?
Chętnie poznamy Twoje zdanie. Podziel się z nami swoją opinią w komentarzu poniżej.
PS Sprzedajesz niestandardowe produkty, rozliczane na metry kwadratowe, kilogramy itp.? Zapoznaj się z naszym artykułem Jak sprzedawać niestandardowe produkty?
Ekskluzywne porady, triki i trendy bezpośrednio na Twoją skrzynkę odbiorczą. Adres e-mail
