Automatyczne uzupełnianie formularzy ułatwia użytkownikom szybkie wypełnianie danych podczas wysyłania wiadomości ze strony internetowej. Odpowiada za nie specjalny atrybut autocomplete, który posiada szereg parametrów HTML odpowiedzialnych za wypełnienie pól formularza właściwymi informacjami. W tym poradniku pokażę Ci krok po kroku, jak poprawić formularze w WordPress, by klienci mogli korzystać z funkcji autouzupełniania w formularzach.
Autouzupełnianie formularzy to funkcja, która ułatwia używanie formularzy internetowych poprzez automatyczne wstawianie informacji, które wcześniej zostały zapisane lub są standardowo przewidywane przez przeglądarkę internetową lub aplikację. Ta funkcja może dotyczyć danych takich jak imię i nazwisko, adres, numer telefonu czy dane do płatności.
Gdy użytkownik zaczyna wpisywać informacje do pola formularza, system autouzupełniania zaproponuje jedną lub więcej pasujących wartości na podstawie wcześniej wprowadzonych danych. Użytkownik może wtedy wybrać odpowiednią opcję, co znacznie przyspiesza proces wypełniania formularzy i zmniejsza ryzyko błędów.
Funkcja ta może znacznie podnieść konwersję z formularzy, ale należy ją poprawnie skonfigurować w poszczególnych polach, by otrzymywać dane kontaktowe w odpowiednim formacie.
Musisz odpowiednio skonfigurować atrybuty HTML w tagach input , które odpowiadają za poszczególna pola w formularzu. W przypadku wtyczki Contact Form 7, do typu pola wystarczy dodać regułę autocomplete:nazwa-parametru, np.
[text* your-name autocomplete:name]uzupełni automatycznie dane pole pełnym imieniem i nazwiskiem zapisanym w przeglądarce.
Poniżej zamieszczam listę popularnych parametrów, wykorzystywanych na stronach internetowych. Możesz je dodać w swoim formularzu, w zależności od potrzeb.
„name” – pole zawiera pełne imię i nazwisko zapisane w przeglądarce. Nie daje jednak możliwości autouzupełniania tylko imieniem lub też nazwiskiem, dlatego warto rozważyć zastosowanie dedykowanych parametrów:
„email” – pole dla adresu email.
„phone” – pole dla numeru telefonu.
„street-address” – pole zawierające nazwę ulicy, ale bez nazwy miejscowości czy kodu pocztowego. Posiada również dodatkowe parametry:
Obie powyższe opcje można łączyć z „street-adress” lub „adress-line-1” (województwo), „address-line-2” (miejscowość), które odpowiadają za poszczególne części adresu użytkownika.
„country” – pole do uzupełnienia nazwy kraju, np. Polska.
Dane do płatności mogą być także zapisywane w przeglądarce, np. Google Chrome zapamięta kartę debetową lub kredytową, jeśli wyrazisz na to zgodę.
„cc-name” – pełne imię i nazwisko na karcie bankowej.
„cc-given-name” – jedynie imię z karty i „cc-additional-name” odpowiednio dla drugiego imienia.
„cc-family-name” – nazwisko przypisane do karty.
„cc-number” – numer karty bankowej.
„cc-exp” – data ważności karty, najczęściej w formacie MM/YY lub MM/YYYY.
„cc-csc” – trzy cyfrowy kod zabezpieczający kartę debetową lub kredytową z banku.
„transaction-currency” – waluta, w której podejmowana jest płatność i „transaction-amount” dla jej kwoty.
Jeśli z jakiegoś powodu nie chcesz, aby dane były automatycznie uzupełnianie w poszczególnych polach w formularzu kontaktowym, możesz wyłączyć to w prosty sposób. Większość popularnych przeglądarek posiada domyślnie aktywowaną opcję autouzupełniania, gdy tylko pola opisane są poprawnym atrybutem type. Aby wyłączyć uzupełnianie w Contact Form 7, dodaj wskazany poniżej kod w pliku functions.php:
add_filter( 'wpcf7_form_autocomplete', function ( $autocomplete ) {
$autocomplete = 'off';
return $autocomplete;
}, 10, 1 );Automatycznie wyłączy on możliwość uzupełniania danych użytkowników. Jeśli korzystasz z innej wtyczki odpowiedzialnej za budowę formularzy na stronie firmowej, konieczne będzie przeszukanie jej dokumentacji lub poszukania pomocy w wyszukiwarce Google. Oczywiście, możemy Ci w tym pomóc, więc odezwij się przez formularz poniżej, jeśli masz problemy ze swoim WordPressem.
Wypełnij poniższy formularz - odezwę się do Ciebie, by porozmawiać o Twojej stronie internetowej.