Jak wyświetlić pływający formularz kontaktowy w WordPress (3 metody)

Czy kiedykolwiek martwiłeś się, że odwiedzający chcą się skontaktować, ale nie wiedzą jak?

Formularz kontaktowy ukryty na jednej stronie WordPress jest łatwy do przeoczenia. Potencjalni klienci mogą odejść, nie zadając pytania, nie dzieląc się opinią ani nie dokonując zakupu. Może to prowadzić do utraty możliwości i mniej przyjaznego dla użytkownika doświadczenia.

Dobra wiadomość jest taka, że istnieje proste rozwiązanie: dodanie pływającego formularza kontaktowego, który podąża za Twoimi odwiedzającymi podczas przeglądania. W ten sposób mogą się skontaktować w dowolnym momencie, nie szukając go.

To prosty sposób na zwiększenie zaangażowania i budowanie zaufania, bez bycia nachalnym. Co więcej, nie potrzebujesz żadnych umiejętności kodowania. Dzięki odpowiednim wtyczkom możesz skonfigurować jedną w zaledwie kilka kliknięć.

W tym przewodniku przeprowadzimy Cię przez trzy szybkie metody dodania pływającego formularza kontaktowego do Twojej strony WordPress.

Czym jest pływający formularz kontaktowy i dlaczego warto go używać?

Pływający formularz kontaktowy pozostaje na ekranie, na przykład w dolnym rogu lub bocznym panelu, podczas gdy odwiedzający przeglądają stronę WordPress. Zazwyczaj pojawia się jako mały przycisk lub ikona, która po kliknięciu lub najechaniu na nią rozwija się w pełny formularz.

Oto kilka korzyści z używania pływającego formularza kontaktowego na Twojej stronie WordPress:

• Dostępność. Ponieważ formularz unosi się i pozostaje na stałe, odwiedzający stronę mogą uzyskać do niego dostęp z dowolnej strony internetowej w dowolnym momencie.
• Minimalna ingerencja. W przeciwieństwie do wysuwanych okienek, które mogą zakłócać doświadczenie użytkownika, pływające formularze są zazwyczaj mniej inwazyjne, a jednocześnie zauważalne.
• Wezwanie do działania. Stała obecność pływającego formularza delikatnie przypomina użytkownikom o interakcji, co pomaga zwiększyć konwersje.

Jako właściciel witryny możesz używać pływającego formularza kontaktowego do obsługi klienta, zapytań sprzedażowych i zbierania opinii.

Pozwalając odwiedzającym na natychmiastową pomoc podczas przeglądania, zadawanie pytań bez opuszczania strony i udostępnianie sugestii w dowolnym momencie, tworzysz płynniejsze i przyjemniejsze doświadczenie użytkownika.

Na szczęście WordPress ułatwia dodanie pływającego formularza kontaktowego na różne sposoby. W poniższych sekcjach przeprowadzimy Cię przez trzy proste metody jego konfiguracji:

• Metoda 1: Tworzenie pływającego formularza kontaktowego w WordPress za pomocą UserFeedback (Łatwe)
• Metoda 2: Tworzenie pływającego formularza kontaktowego w WordPress przy użyciu WPForms i OptinMonster (najbardziej konfigurowalna)
• Metoda 3: Tworzenie pływającego formularza kontaktowego w WordPress za pomocą darmowej wtyczki (Darmowa + Łatwa)
• Alternatywna metoda: Użyj chatbota na swojej stronie internetowej
• Najczęściej zadawane pytania dotyczące pływających formularzy kontaktowych w WordPressie
• Dodatkowe zasoby dotyczące formularzy WordPress

Zacznijmy!

Metoda 1: Tworzenie pływającego formularza kontaktowego w WordPress za pomocą UserFeedback

Jeśli chcesz stworzyć prosty pływający formularz kontaktowy z prostymi opcjami dostosowywania, ta metoda jest dla Ciebie.

UserFeedback to najlepszy plugin do zbierania opinii użytkowników dla WordPress, który pomoże Ci tworzyć konfigurowalne formularze opinii, pływające formularze kontaktowe i ankiety wyskakujące. Posiada wbudowane szablony i pytania, w tym dotyczące doświadczeń na stronie internetowej i formularze ankiet dla sklepów e-commerce.

Korzystając z UserFeedback, możesz ulepszać swoją stronę internetową na podstawie rzeczywistych opinii użytkowników, zwiększać satysfakcję klientów i szybko rozwiązywać wszelkie problemy.

W WPBeginner faktycznie korzystaliśmy z UserFeedback na naszych własnych stronach internetowych i mieliśmy z nim świetne doświadczenia. Aby uzyskać więcej informacji o pluginie, zapoznaj się z naszą kompletną recenzją UserFeedback.

Najpierw zainstalujmy i aktywujmy wtyczkę UserFeedback. Jeśli nie wiesz, jak zainstalować wtyczkę, możesz skorzystać z naszego przewodnika na temat jak zainstalować wtyczkę WordPress.

Gdy masz już aktywowany UserFeedback na swojej stronie internetowej, możesz zacząć tworzyć swoją pierwszą ankietę.

Z poziomu Twojego panelu WordPress przejdź do UserFeedback » Surveys » Create New.

Po wykonaniu tej czynności przejdziesz do sekcji „Setup”.

Z UserFeedback możesz zacząć od pustej strony z opcją „Zacznij od zera” lub użyć gotowego szablonu. W tym przewodniku użyjemy szablonu „Opinie o stronie internetowej”. 

Aby wybrać szablon, po prostu kliknij go.

Następnie edytujmy tekst. W tym przykładzie zmieniamy etykietę „Opinie o stronie” na „Czy masz jakieś uwagi?”.

Następnie możesz kliknąć menu rozwijane „Typ pytania”, aby wybrać sposób, w jaki odwiedzający mogą odpowiedzieć na to pytanie. W tym przykładzie wybierzemy „Jedno pole tekstowe”.

Następnie możesz zmienić pytanie na „Imię”.

Teraz będziesz potrzebować kolejnego pola na adres e-mail użytkownika.

Możesz przewinąć trochę w dół i kliknąć przycisk „Dodaj pytanie”.

Gdy to zrobisz, przejdź dalej i skonfiguruj swój typ pytania i tytuł, tak jak zrobiłeś to w poprzednim kroku.

Następnym krokiem jest konfiguracja ustawień formularza.

W zakładce „Ustawienia” możesz aktywować śledzenie wyświetleń i odpowiedzi formularza za pomocą Google Analytics i MonsterInsights.

Wystarczy włączyć opcję „Włącz śledzenie Google Analytics”, aby skorzystać z tej funkcji.

Następnie możesz przewinąć w dół zakładki, aby skonfigurować targetowanie i zachowanie.

W sekcji „Targeting” możesz wybrać typ urządzenia i stronę internetową, na której wyświetli się Twój formularz ankiety.

Opcje typu urządzenia obejmują komputer stacjonarny, tablet i urządzenie mobilne. Jeśli chcesz, aby formularz wyświetlał się na wszystkich tych urządzeniach, możesz wybrać wszystkie trzy.

Następnie możesz wybrać wszystkie strony, na których chcesz wyświetlić pływający formularz. Zalecamy wybranie opcji „Wszystkie strony”, aby odwiedzający mogli uzyskać dostęp do Twojego formularza w dowolnym miejscu na Twojej stronie internetowej.

Po zakończeniu przewińmy w dół i skonfigurujmy zachowanie formularza. Tutaj ustawisz:

• Czas wyświetlania. Wybierz, kiedy formularz ma się pojawić na Twoich stronach.
• Długość wyświetlania. Zdefiniuj, jak często Twój formularz będzie wyświetlany odwiedzającym.
• Czas trwania ankiety. Określ, jak długo Twój formularz będzie wyświetlany na wskazanych stronach.

Oto nasza konfiguracja dla Twojej referencji: „Czas wyświetlania: Natychmiast”, „Długość wyświetlania: Zawsze, dopóki ankieta UserFeedback nie zostanie ukończona” i „Czas trwania ankiety: Bezterminowo”.

Teraz jesteś gotowy do przejścia do następnego kroku.

W zakładce „Powiadomienia” wprowadzisz adres e-mail, na który będą wysyłane powiadomienia o przesłaniu formularza. Możesz dodać wielu odbiorców, ale musisz upewnić się, że używasz przecinka do oddzielenia każdego z nich.

Na koniec możesz poświęcić trochę czasu na sprawdzenie formularza po raz ostatni przed jego finalizacją.

W górnej części zakładki „Publikuj” zobaczysz „Podsumowanie opinii o stronie internetowej”. Możesz przejrzeć punkty jeden po drugim, aby sprawdzić, czy konfiguracja Twojego formularza jest poprawna.

Jeśli wszystko wygląda dobrze, możesz przewinąć w dół do sekcji „Publikuj”.

Tam możesz zmienić status z „Szkic” na „Opublikuj”.

Alternatywnie, możesz zaplanować publikację, przełączając opcję „Zaplanuj na później” i określając datę i godzinę.

Po zakończeniu kliknij „Zapisz i opublikuj”, aby wyświetlić swój formularz.

I to wszystko!

Pomyślnie wyświetliłeś pływający formularz kontaktowy na swojej stronie WordPress za pomocą UserFeedback.

Metoda 2: Tworzenie pływającego formularza kontaktowego w WordPress przy użyciu WPForms i OptinMonster

Jeśli chcesz mieć większą kontrolę nad projektem swojego pływającego formularza kontaktowego, ta metoda jest dla Ciebie. Użyjemy WPForms do stworzenia formularza, a OptinMonster, aby sprawić, by unosił się na Twojej stronie WordPress.

WPForms to najlepszy kreator formularzy kontaktowych dla WordPress z prostym interfejsem typu „przeciągnij i upuść”. Z ponad 2000 szablonów i narzędzi opartych na sztucznej inteligencji możesz stworzyć formularz WordPress w zaledwie kilka kliknięć.

W WPBeginner używamy WPForms do zbierania kontaktów, opinii i próśb o migrację od użytkowników. Dowiedz się, dlaczego uwielbiamy ten wtyczkę w naszej szczegółowej recenzji WPForms.

Aby tworzyć formularze za pomocą WPForms, pierwszą rzeczą, którą musisz zrobić, jest zainstalowanie i aktywowanie wtyczki na swojej stronie internetowej. Jeśli potrzebujesz dalszej pomocy, możesz przeczytać nasz poradnik jak zainstalować wtyczkę WordPress.

Po aktywacji możesz przejść do WPForms » Dodaj nowy z panelu administracyjnego WordPress.

Spowoduje to przekierowanie Cię do interfejsu kreatora formularzy.

Tam wystarczy wpisać nazwę formularza i wybrać szablon. W tym przykładzie utwórzmy formularz kontaktowy i nazwijmy go „Formularz kontaktowy”.

Po nazwaniu formularza możesz przewinąć panel w dół, aby zbudować formularz za pomocą AI lub wybrać szablon.

WPForms AI pomaga szybko tworzyć formularze. Wystarczy opisać, czego potrzebujesz. Zamiast ręcznie dodawać pola, AI zrobi to za Ciebie w kilka sekund.

Niezależnie od tego, czy potrzebujesz prostego formularza rejestracji użytkowników, interaktywnego formularza aplikacji o pracę, czy szczegółowej ankiety, WPForms AI przyspiesza ten proces.

W tym przewodniku użyjemy jednak szablonu „Prosty formularz kontaktowy”.

Aby rozpocząć tworzenie, możesz najechać kursorem na pole szablonu i kliknąć „Użyj szablonu”.

Spowoduje to przekierowanie Cię do panelu „Pola” kreatora formularzy.

Stąd możesz przejrzeć swój formularz kontaktowy i dostosować gotową treść. Jeśli wszystko wygląda dobrze, możesz kliknąć przycisk „Zapisz”.

Aby uzyskać szczegółowe instrukcje, zapoznaj się z naszym przewodnikiem krok po kroku jak stworzyć formularz kontaktowy.

Po zakończeniu tworzenia formularza nadszedł czas, aby dostosować jego ustawienia, aby wyświetlał się jako formularz pływający.

W tym celu musisz zainstalować OptinMonster, najlepszą wtyczkę do generowania leadów dla WordPress.

Narzędzie może pomóc w tworzeniu i zarządzaniu kampaniami w celu przekształcenia odwiedzających w subskrybentów i płacących klientów. Możesz zapoznać się z naszym szczegółowym przewodnikiem na temat tego, jak zbudować listę e-mailową za pomocą OptinMonster.

W WPBeginner używamy OptinMonster do promowania specjalnych ofert za pomocą wyskakujących okienek i banerów nagłówka. Zapoznaj się z naszą pełną recenzją OptinMonster, aby dowiedzieć się więcej o tym oprogramowaniu.

Po aktywacji możesz kliknąć pozycję menu „OptinMonster” z panelu administracyjnego WordPress.

Następnie zobaczysz ekran powitalny, na którym możesz kliknąć „Połącz istniejące konto”, aby rozpocząć pracę z pluginem.

Otworzy się nowe okno, w którym możesz kliknąć „Połącz z WordPress”.

Następnie OptinMonster poprosi o dane Twojego konta, aby zakończyć proces.

Po weryfikacji jesteś gotowy do utworzenia swojej pierwszej kampanii.

Aby rozpocząć, po prostu przejdź do OptinMonster » Campaigns z Twojego obszaru administracyjnego WordPress.

Po przejściu do sekcji „Kampanie” możesz utworzyć i skonfigurować swój pływający formularz.

Aby rozpocząć, po prostu kliknij przycisk „Utwórz swoją pierwszą kampanię”.

Teraz czas wybrać typ kampanii.

OptinMonster oferuje różne typy kampanii, w tym pływający pasek. Chociaż może się wydawać, że jest to idealny typ kampanii, pływający pasek ma ograniczoną przestrzeń. Dlatego warto go używać w innych przypadkach, takich jak ogłaszanie promocji sprzedaży lub udostępnianie kodów kuponów.

Jeśli chcesz dowiedzieć się więcej o używaniu pływającego paska, polecamy zapoznać się z naszym przewodnikiem na temat tworzenia „przyklejonego” pływającego paska stopki w WordPress.

Aby Twój projekt był schludny, możesz wybrać „Slide-in” jako typ kampanii do dodania formularza kontaktowego WPForms.

Pływający wysuwany formularz pozostanie w prawym dolnym rogu ekranu użytkownika. Dzięki temu Twoje treści pozostaną czytelne, projekt strony uporządkowany, a wrażenia użytkownika doskonałe.

Możesz po prostu kliknąć typ kampanii, aby jej użyć.

Następnie przewińmy panel w dół i wybierzmy szablon.

Aby użyć szablonu, po prostu najedź kursorem na blok szablonu i kliknij „Użyj szablonu”. Tutaj wybieramy „Zapisz się do newslettera (Jasny)”.

Po wybraniu typu kampanii i szablonu pojawi się okno pop-up.

Musisz tylko nadać swojej kampanii nazwę. W tym przykładzie nazwiemy naszą kampanię „Pływający formularz kontaktowy”.

Po wybraniu nazwy możesz kliknąć „Start Building”.

Następnie OptinMonster przekieruje Cię do kreatora kampanii.

Interfejs tworzenia kampanii składa się z dwóch sekcji. Lewa strona zawiera wszystkie funkcje, które można dodać do kampanii, a prawa strona to podgląd na żywo.

Więcej informacji znajdziesz w naszym poradniku na temat jak dodać wysuwany formularz kontaktowy w WordPress.

Aby dodać formularz kontaktowy WPForms, możesz przewinąć w dół lewego panelu, aby zlokalizować blok WPForms.

Gdy go znajdziesz, po prostu przeciągnij i upuść blok WPForms do podglądu na żywo w prawym panelu.

Następnie zobaczysz rozwijaną listę „Wybór formularza”. Możesz na nią kliknąć, a następnie wybrać „Formularz kontaktowy”. Blok w podglądzie na żywo załaduje wtedy krótki kod formularza.

Następnie możesz przejść do zakładki „Zasady wyświetlania”. W tej zakładce możesz ustawić czas wyświetlania pływającego formularza kontaktowego i strony.

Aby upewnić się, że Twój formularz unosi się i pozostaje na miejscu od pierwszej sekundy, zalecamy ustawienie dwóch pierwszych rozwijanych menu na „czas na stronie” i „natychmiast”.

Następnie, aby wyświetlić formularz na wszystkich stronach, możesz ustawić następujące listy rozwijane jako „current URL path” i „any page”.

Po zakończeniu możesz przejść do zakładki „Publikuj”.

Na tej karcie pierwszą rzeczą, którą musisz zrobić, jest zmiana statusu publikacji kampanii na „Opublikuj” lub „Zaplanuj”.

Następnym krokiem jest użycie funkcji „Inspektor strony na żywo”, aby przetestować, jak Twoja kampania wygląda na Twojej stronie internetowej. Aby to zrobić, po prostu wpisz adres URL swojej witryny w polu tekstowym i kliknij „Testuj”.

Zostaniesz przekierowany do nowej karty.

Jeśli wszystko wygląda tak, jak chcesz, możesz wrócić do kreatora kampanii OptinMonster i zapisać swoją kampanię.

I oto jest! Pomyślnie utworzyłeś pływający formularz kontaktowy za pomocą WPForms i OptinMonster.

Metoda 3: Tworzenie pływającego formularza kontaktowego w WordPress za pomocą darmowej wtyczki pływającego formularza

Nasza ostatnia metoda pozwoli Ci wyświetlić pływającą ikonę, która przekierowuje do strony z formularzem kontaktowym. To podejście jest nieco inne, ale może być skuteczne.

Kilka darmowych wtyczek pozwala dodać pływające ikony kontaktowe do Twojej witryny WordPress. Niektóre popularne opcje to Simple Floating Menu i Float Menu. Wtyczki te zazwyczaj wymagają osadzenia adresu URL w ich ustawieniach.

W tym samouczku pokażemy, jak to zrobić za pomocą Simple Floating Menu. Jeśli potrzebujesz pomocy w instalacji wtyczki, możesz przeczytać nasz poradnik na temat jak zainstalować wtyczkę WordPress.

Zanim uzyskasz dostęp do obszaru ustawień wtyczki Simple Floating Menu, skopiuj adres URL strony, na której wyświetlasz swój formularz kontaktowy.

Aby to zrobić, przejdź do danej strony i skopiuj adres URL z paska adresu.

Teraz możesz otworzyć Proste Pływające Menu z panelu administracyjnego WordPress.

Po wejściu do obszaru ustawień wtyczki będziesz chciał włączyć ikonę pływającego formularza. Możesz to zrobić, przesuwając suwak „Włącz menu pływające”. Zmieni kolor z szarego na zielony lub z wyłączonego na włączony.

Następnie znajdź pole „Adres URL przycisku”, aby wkleić adres URL.

Po wprowadzeniu adresu URL przycisku powinieneś zobaczyć powiadomienie, jeśli Twoje ustawienia zostały pomyślnie zapisane.

Teraz Twój pływający ikona powinna być aktywna na Twojej stronie internetowej WordPress. Możesz jednak dalej dostosowywać pozycję i wygląd przycisku.

Nad polem „URL przycisku” możesz zmienić domyślną ikonę na coś bardziej odpowiedniego. Ten plugin oferuje dziesiątki opcji ikon, więc jeśli kiedykolwiek poczujesz się zagubiony, dobrym pomysłem jest skorzystanie z funkcji filtrowania.

„Tekst podpowiedzi” pojawi się, gdy odwiedzający najedzie kursorem na pływającą ikonę. Zalecamy wypełnienie tego pola, aby dać odwiedzającym kontekst, dokąd ikona ich zaprowadzi.

Następnie, jeśli chcesz przekierować odwiedzających na nową stronę po kliknięciu ikony, zaznacz pole wyboru w sekcji „Otwórz w nowej karcie”.

Możesz edytować kolory pływającej ikony, przewijając ekran w dół. Bądź kreatywny z kolorami tła, ikony i efektów najazdu, o ile pasują do Twojej marki lub osobowości strony internetowej.

Po zakończeniu kliknij „Zapisz ustawienia”.

Następnie możesz przejść do zakładki „Ustawienia”, aby uzyskać więcej funkcji dostosowywania.

Na tej karcie możesz wybrać, gdzie chcesz, aby formularz pojawił się na Twojej stronie, na przykład w lewym górnym rogu, w środku po prawej lub w prawym dolnym rogu.

Dostępne są również ustawienia orientacji przycisku. Możesz wybrać pionową lub poziomą.

Możesz też chcieć zmienić styl przycisku. Domyślny kształt to prostokąt, ale możesz wybrać okrągły, trójkątny, a nawet gwiazdkę.

Więcej ustawień personalizacji znajdziesz w panelu. Możesz dostosować rozmiar, style cieni, typografię i inne elementy swojego pływającego ikony, aby uczynić ją bardziej unikalną.

Po zakończeniu, wszystko, co musisz zrobić, to zapisać, aby nie stracić postępów.

Teraz możesz przejść dalej i zobaczyć, jak ikona pływająca wygląda na Twojej stronie internetowej.

Oto jak wygląda nasza pływająca ikona dla Twojej referencji:

Alternatywna metoda: Użyj chatbota na swojej stronie internetowej

Pływający formularz kontaktowy to świetny sposób, aby umożliwić odwiedzającym kontakt z Tobą. Ale jeśli chcesz zapewnić natychmiastowe odpowiedzi swoim użytkownikom, warto zainstalować zamiast tego chatbota.

Chatbot może być oparty na sztucznej inteligencji lub obsługiwany bezpośrednio przez Twój zespół wsparcia. Na przykład narzędzie takie jak ChatBot może czerpać informacje z Twojej strony internetowej i centrum pomocy, aby natychmiast udzielać Twoim odwiedzającym odpowiedzi opartych na sztucznej inteligencji.

Szczegółowe informacje na temat konfiguracji znajdziesz w naszym poradniku jak dodać chatbota w WordPress. Aby dowiedzieć się więcej o oprogramowaniu, zapoznaj się z naszą pełną recenzją ChatBota.

Najczęściej zadawane pytania dotyczące pływających formularzy kontaktowych w WordPressie

Oto odpowiedzi na najczęściej zadawane pytania dotyczące konfiguracji i dostosowywania pływających formularzy kontaktowych.

Jaki jest najlepszy plugin do tworzenia pływającego formularza kontaktowego?

Jeśli szukasz prostego, kompleksowego rozwiązania, UserFeedback jest świetnym wyborem. Został zaprojektowany z myślą o łatwej konfiguracji i dostosowywaniu, co czyni go idealnym do prostych, pływających formularzy bez konieczności kodowania.

Aby uzyskać większą kontrolę nad wyglądem i zachowaniem formularza, rozważ połączenie WPForms z OptinMonster.

WPForms oferuje przyjazny dla użytkownika kreator typu „przeciągnij i upuść” z ponad 2000 szablonów i wieloma narzędziami AI. OptinMonster dodaje zaawansowane opcje targetowania i elastyczność projektowania, umożliwiając wyświetlanie formularza dokładnie wtedy i tam, gdzie chcesz.

Czy mogę dostosować wygląd mojego pływającego formularza kontaktowego?

Absolutnie. Wszystkie trzy metody pozwalają na dostosowanie. Możesz dostosować kolory, tekst i pozycjonowanie, aby pasowały do brandingu Twojej witryny.

OptinMonster idzie o krok dalej w personalizacji, oferując zaawansowane opcje projektowania i reguły targetowania. Oznacza to, że możesz dopracować każdy szczegół swojej kampanii pływającego formularza, aby dopasować ją do swoich konkretnych potrzeb.

Czy pływający formularz kontaktowy spowolni moją stronę internetową?

Wcale nie. Wtyczki prezentowane w tym przewodniku są dobrze zakodowane i zoptymalizowane pod kątem wydajności. Ładują się asynchronicznie, co zapewnia, że nie blokują ładowania głównej zawartości strony. Pomaga to utrzymać szybkie i płynne doświadczenie użytkownika na Twojej stronie.

Dodatkowe zasoby dotyczące formularzy WordPress

Mamy nadzieję, że ten przewodnik pomógł Ci dodać pływający formularz kontaktowy do Twojej witryny. Teraz, gdy jest już skonfigurowany, możesz zapoznać się z innymi pomocnymi artykułami, aby jeszcze lepiej wykorzystać swoje formularze:

• Jak osadzać formularze w WordPress
• Jak dostosować i stylizować formularze WordPress
• Jak tworzyć wielojęzyczne formularze w WordPress
• Jak stworzyć bardziej interaktywne formularze w WordPress
• Kompleksowy przewodnik po korzystaniu z formularzy WordPress
• Najlepsze kreatory formularzy online (wybór ekspertów)

Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.