Zaufane samouczki WordPress, kiedy ich najbardziej potrzebujesz.
Przewodnik dla początkujących po WordPressie
WPB Cup
25 milionów+
Witryny korzystające z naszych wtyczek
16+
Lata doświadczenia z WordPressem
3000+
Samouczki WordPress od ekspertów

Jak tworzyć mobilne wyskakujące okienka, które konwertują (nie szkodząc SEO)

Chodzi o wyskakujące okienka na urządzenia mobilne: działają one niezwykle dobrze w przypadku konwersji, ale większość ludzi wdraża je nieprawidłowo. Widzieliśmy niezliczone witryny internetowe karane przez Google lub tracące odwiedzających, ponieważ tworzyły natrętne wyskakujące okienka, które psuły wrażenia mobilne.

Z drugiej strony, widzieliśmy również właścicieli firm tracących tysiące potencjalnych klientów, ponieważ boją się w ogóle używać wyskakujących okienek.

W WPBeginner używamy OptinMonster do wyświetlania wyskakujących okienek, okienek wysuwanych, okienek wbudowanych i banerów nagłówkowych z ofertami specjalnymi i promocjami. Uważamy, że te wyskakujące okienka mogą być bardzo skuteczne w zachęcaniu odwiedzających do dokonania zakupu lub podjęcia decyzji. Ale wymagało to wielu testów, aby zrobić to dobrze.

W tym przewodniku pokażemy Ci dokładnie, jak tworzyć mobilne wyskakujące okienka, które zwiększają konwersje, pozostając po dobrej stronie Google. Poznasz konkretne techniki, których używamy do pozyskiwania większej liczby potencjalnych klientów i sprzedaży, nie irytując mobilnych odwiedzających ani nie szkodząc Twoim rankingom w wyszukiwarkach.

Jak utworzyć wyskakujące okienko z kuponem w WordPress

Dlaczego warto oferować odwiedzającym kupon?

Często właściciele nowych firm martwią się, że kupony zmniejszą ich zyski. Jednak właściciele ugruntowanych firm wiedzą, że oferowanie rabatów to potężny sposób na skłonienie odwiedzających do podjęcia decyzji zamiast siedzenia na płocie.

Oferowanie kodów kuponów pomaga odzyskać sprzedaż z porzuconych koszyków, zamienić odwiedzających w klientów i zwiększyć sprzedaż.

Większość platform eCommerce, takich jak WooCommerce, pozwala łatwo tworzyć kody kuponów. Jednak udostępnianie tych kodów kuponów klientom robi całą różnicę.

Dlatego w tym artykule podzielimy się dwoma różnymi sposobami udostępniania kuponów odwiedzającym. Obejmują one wysuwane okno z kuponem przy wyjściu i opcję „zakręć, aby wygrać” z kuponem.

Przyjrzyjmy się, jak utworzyć wyskakujące okienko z kuponem w WordPress lub WooCommerce.

Jak utworzyć wyskakujące okienko z kuponem w WordPress

Najlepszym sposobem na stworzenie wyskakującego okienka z kuponem jest użycie OptinMonster. Jest to najlepsza wtyczka do wyskakujących okienek WordPress i oprogramowanie do generowania leadów na rynku.

Więcej informacji znajdziesz w naszej kompletnej recenzji OptinMonster.

OptinMonster

Najpierw musisz odwiedzić stronę internetową OptinMonster, aby utworzyć konto. Po prostu kliknij przycisk „Get OptinMonster Now”, aby rozpocząć.

Będziesz potrzebować co najmniej planu Growth, ponieważ obejmuje on kampanie typu „Koło kuponowe” i zaawansowane reguły targetowania dla Twoich wyskakujących okienek.

Następnie musisz zainstalować i aktywować wtyczkę OptinMonster w swojej witrynie WordPress. Więcej szczegółów znajdziesz w naszym przewodniku krok po kroku jak zainstalować wtyczkę WordPress.

Wtyczka działa jako łącznik między Twoim kontem OptinMonster a Twoją witryną WordPress.

Po aktywacji wtyczki zobaczysz kreatora konfiguracji OptinMonster. Kliknij przycisk „Połącz istniejące konto”.

Połącz istniejące konto

Otworzy się teraz nowe okno, w którym będziesz musiał połączyć swoją witrynę WordPress z OptinMonster.

Po prostu kliknij przycisk „Połącz z WordPress”, aby kontynuować.

Połącz OptinMonster z WordPress

Możesz również połączyć swój sklep WooCommerce z OptinMonster. Upewnij się tylko, że masz skonfigurowany sklep eCommerce w WordPress.

Najpierw musisz przejść do OptinMonster » Ustawienia z panelu administracyjnego WordPress.

Następnie przejdź do zakładki „Ogólne” i kliknij przycisk „Automatycznie generuj klucze + Połącz WooCommerce”.

Automatyczne generowanie kluczy i połączenie WooCommerce

WooCommerce automatycznie wygeneruje klucze i połączy się z Twoim kontem OptinMonster.

Teraz jesteś gotowy do utworzenia swojej pierwszej kampanii z wyskakującym okienkiem z kuponem.

Tworzenie kampanii wyskakujących okienek z kuponami

Aby utworzyć kampanię, przejdź do OptinMonster » Kampanie z poziomu panelu administracyjnego WordPress, a następnie kliknij przycisk „Utwórz pierwszą kampanię”.

Utwórz pierwszą kampanię OptinMonster

Na następnym ekranie OptinMonster wyświetli różne typy kampanii i szablony.

Najpierw musisz wybrać typ kampanii. Użyjemy „Popup”, co powinno być domyślnym wyborem.

Wybierz typ kampanii i szablon

Następnie zostaniesz poproszony o wybranie szablonu.

OptinMonster oferuje szeroki wybór szablonów, z wieloma różnymi układami i schematami kolorów. Szablon „Kupon” jest idealny do tworzenia tego wyskakującego okienka. Możesz jednak wybrać inny szablon, jeśli wolisz.

Możesz użyć pola wyszukiwania, aby znaleźć szablon kuponu lub przewinąć stronę w dół.

Wybierz szablon

Następnie najedź kursorem na szablon i kliknij przycisk „Użyj szablonu”.

Ostatnim krokiem przed utworzeniem wyskakującego okienka z kuponem jest nazwanie kampanii. Po wpisaniu nazwy kliknij przycisk „Rozpocznij tworzenie”.

Wpisz nazwę swojej kampanii

Projektowanie Twojego wyskakującego okienka z kuponem

Po kliknięciu „Rozpocznij tworzenie” zobaczysz kreator kampanii metodą przeciągnij i upuść.

Możesz go użyć do dodawania różnych bloków do swojego szablonu i zmieniania tekstu, kolorów i projektu kuponu w dowolny sposób.

Edytuj szablon kampanii

Możesz również kliknąć dowolny element projektu, aby go dalej zmieniać. Tutaj edytowaliśmy tekst i zmieniliśmy jego kolor.

Jak tylko wprowadzisz zmiany, zobaczysz aktualizacje w czasie rzeczywistym w szablonie wyskakującego okienka z kuponem.

Edytuj tekst i kolor elementów w szablonie

Możesz poeksperymentować z różnymi czcionkami i kolorami, aby Twój tekst wyróżniał się w wysuwanym oknie lub pasował do Twojej marki.

Oprócz tekstu i elementów wewnątrz wyskakującego okienka, możesz również zmienić kolor tła, dodać obraz do swojego kuponu, ustawić kolor obramowania, zmienić styl obramowania i wiele więcej.

Zapisz zmiany w wyskakującym okienku

Po zakończeniu zmian upewnij się, że zapisałeś swoją kampanię, klikając zielony przycisk „Zapisz” u góry ekranu.

Zdecyduj, jak dostarczyć kod kuponu

Teraz, gdy skonfigurowałeś swoje wyskakujące okienko z kuponem, musisz zdecydować, w jaki sposób faktycznie dostarczysz kod kuponu swojemu odwiedzającemu.

Istnieje kilka sposobów, aby to zrobić w OptinMonster, ale najlepszym sposobem jest natychmiastowe dostarczenie kodu kuponu za pośrednictwem widoku Sukces OptinMonster i wysłanie go za pomocą newslettera e-mailowego.

W ten sposób, jeśli odwiedzający nie jest gotowy do natychmiastowego zakupu, będzie miał kod kuponu w swojej skrzynce e-mailowej, aby łatwo do niego wrócić później.

Domyślnie Twój popup z kuponem jest już zaprojektowany tak, aby używać „widoku sukcesu” natychmiast po kliknięciu przycisku. Aby to sprawdzić, możesz kliknąć przycisk, a następnie zobaczyć opcję „Przejdź do widoku” po lewej stronie ekranu.

Zmień widok sukcesu

Jeśli chcesz inną akcję przycisku, możesz ją tutaj zmienić. Jednak w przypadku pierwszego kuponu zalecamy trzymanie się domyślnych ustawień.

Integracja OptinMonster z Twoją listą e-mailową

Aby automatycznie wysyłać kod kuponu e-mailem i dodawać odwiedzającego do Twojej listy e-mailowej, musisz zintegrować OptinMonster z usługą marketingową e-mail.

Constant Contact to świetna usługa do wykorzystania z OptinMonster, a czytelnicy WPBeginner mogą uzyskać 20% zniżki na pierwsze 3 miesiące, korzystając z tego kuponu.

Jednak jeśli korzystasz z innej usługi e-mail, OptinMonster integruje się z praktycznie każdym głównym dostawcą.

Po prostu przejdź do zakładki „Integracja” i kliknij przycisk „+ Dodaj nową integrację”, aby dodać swoją usługę e-mail marketingu.

Dodaj nową integrację

Po wykonaniu tej czynności możesz skonfigurować zautomatyzowany e-mail, który będzie wysyłany za każdym razem, gdy ktoś zapisze się na listę e-mailową za pośrednictwem Twojego wyskakującego okienka z kuponem.

Dodatkowa wskazówka: Edytuj szablon widoku sukcesu

Możesz wyświetlić i zmienić szablon „Widok sukcesu”, wracając do zakładki Projekt swojej kampanii i klikając opcję „Sukces” u dołu ekranu.

Domyślny wygląd wygląda tak, ale możesz go edytować w dowolny sposób, tak jak edytowałeś swój popup z kuponem.

Przełącz na widok sukcesu

Zmień zasady wyświetlania swojego wyskakującego okienka z kuponem

Domyślnie Twoje wyskakujące okienko z kuponem pojawi się odwiedzającym po 5 sekundach przebywania na dowolnej stronie Twojej witryny.

Jeśli chcesz to zmienić, przejdź do zakładki „Zasady wyświetlania”.

Reguła wyświetlania OptinMonster

Możesz ustawić dowolne zasady wyświetlania, ale świetną opcją do wypróbowania jest Exit-Intent®.

Ta specjalna technologia OptinMonster potrafi wykryć, kiedy odwiedzający ma zamiar opuścić Twoją witrynę i wyświetlić mu Twój kupon w odpowiednim momencie.

Możesz dodać intencję wyjścia, wybierając „wykryto wyjście” z menu rozwijanego i wybierając urządzenia, na których ma być wyświetlana kampania. Domyślnie będzie ona ustawiona na wyświetlanie na wszystkich urządzeniach.

Wybierz czułość zamiaru wyjścia

Istnieje również opcja kontrolowania czułości zamiaru wyjścia.

Następnie przewiń w dół i wybierz strony, na których chcesz wyświetlić swoją kampanię.

Na przykład, możesz użyć domyślnego ustawienia „aktualna ścieżka adresu URL” i wybrać opcję „jest dowolna strona”. W ten sposób Twoja kampania pojawi się na całej Twojej stronie internetowej.

Następnie OptinMonster oferuje również opcje odtwarzania efektu dźwiękowego i wyświetlania animacji po pojawieniu się wyskakującego okienka z kuponem.

Dodaj efekty MonsterEffects i animacje

Istnieje również więcej ustawień.

OptinMonster pozwala skonfigurować pliki cookie dla Twojej kampanii i ustawić liczbę dni, po których kampania będzie wyświetlana różnym użytkownikom.

Zmiana ustawień plików cookie

Gdy będziesz zadowolony ze swojego wyskakującego okienka z kuponem, możesz przejść do zakładki „Publikuj” na górze.

Następnie upewnij się, że opcja „Opublikuj” jest zaznaczona w sekcji „Status publikacji”.

Opublikuj swoją kampanię

Nie zapomnij kliknąć przycisku „Zapisz” u góry i zamknąć kreatora kampanii.

Teraz możesz odwiedzić swoją witrynę, aby zobaczyć wyskakujące okienko z kuponem w akcji.

Podgląd wyskakującego okienka z kuponem

Tworzenie koła kuponów typu „zakręć, aby wygrać”

Koło kuponów typu „zakręć, aby wygrać” to świetny sposób, aby Twoje kupony były bardziej interesujące i zabawne dla odwiedzających Twoją witrynę. To jak mini-gra, w którą odwiedzający mogą zagrać, aby wygrać zniżkę lub inny bonus.

Twoje opcje „zakręć, aby wygrać” mogą obejmować takie rzeczy, jak 10% zniżki, 20% zniżki, darmowa wysyłka, darmowy okres próbny lub cokolwiek chcesz zaoferować.

OptinMonster oferuje typ kampanii „Grywalizowana”, który pozwala tworzyć wyskakujące okienka typu „zakręć kołem” popups.

Wybierz typ kampanii grywalizacyjnej

Następnie przewiń w dół i wybierz jeden z szablonów Koła.

Wtyczka posiada różne szablony typu „zakręć, aby wygrać”. Po prostu najedź kursorem na szablon i kliknij przycisk „Użyj szablonu”.

Wybierz szablon

Następnie możesz edytować dowolny aspekt swojego koła kuponów.

Aby edytować opcje samego koła kuponów, musisz kliknąć przycisk „Dostosuj sekcje koła” po lewej stronie.

Dostosuj swoje koło

Następnie możesz wpisać dowolny tekst jako Etykietę dla każdej opcji i dodać kod kuponu dla każdej wygrywającej opcji.

Pamiętaj, że „Szansa na wygraną” jest określana automatycznie. Jeśli zmienisz przełącznik w jednej lub więcej opcji „Może wygrać”, OpinMonster przeliczy szanse na wygraną.

Edytuj sekcje koła

Jeśli potrzebujesz więcej pomocy w tworzeniu koła kuponów i dodawaniu go do swojej witryny, zapoznaj się z naszym wpisem jak dodać opcje typu „zakręć, aby wygrać” w WordPress i WooCommerce, który szczegółowo opisuje ten proces.

Następnie możesz odwiedzić swoją witrynę, aby zobaczyć wyskakujące okienko z kuponem typu „zakręć, aby wygrać” w akcji.

Podgląd wyskakującego okienka „Zakręć kołem”

Często zadawane pytania dotyczące wysuwanych okien mobilnych

Wyskakujące okienka mobilne mogą być mylące, zwłaszcza gdy próbujesz zrównoważyć konwersje z najlepszymi praktykami SEO. Oto najczęstsze pytania, które otrzymujemy na temat tworzenia mobilnych wyskakujących okienek, które konwertują, nie szkodząc Twoim rankingom w wyszukiwarkach.

1. Czy wyskakujące okienka mobilne zaszkodzą moim rankingom SEO?

Mobilne wyskakujące okienka nie zaszkodzą Twoim rankingom SEO, jeśli będą przestrzegać wytycznych Google dotyczących przyjazności dla urządzeń mobilnych. Google karze natrętne reklamy pełnoekranowe, które zakrywają główną treść natychmiast po tym, jak użytkownik przejdzie na stronę z wyników wyszukiwania. Jednak wyskakujące okienka, które pojawiają się z opóźnieniem, wyskakujące okienka typu „exit-intent” lub banery, które nie zakrywają znaczącej treści, są całkowicie w porządku i nie wpłyną na Twoje rankingi.

2. Jaki jest najlepszy czas opóźnienia dla wyskakujących okienek mobilnych?

Zalecamy ustawienie opóźnienia czasowego wynoszącego co najmniej 5-10 sekund dla wyskakujących okienek na urządzenia mobilne. Daje to odwiedzającym wystarczająco dużo czasu, aby zacząć czytać Twoje treści, zanim pojawi się wyskakujące okienko. Wyskakujące okienka typu „exit-intent” są jeszcze lepsze na urządzenia mobilne, ponieważ uruchamiają się tylko wtedy, gdy ktoś zamierza opuścić Twoją witrynę. Unikaj wyświetlania wyskakujących okienek natychmiast po wejściu na stronę, ponieważ tworzy to złe wrażenia użytkownika.

3. Jak tworzyć mobilne wyskakujące okienka, które nie irytują użytkowników?

Kluczem jest sprawienie, aby Twoje mobilne wyskakujące okienka były łatwe do zamknięcia i wartościowe dla użytkowników. Zawsze umieszczaj jasny, widoczny przycisk zamykania (X) w prawym górnym rogu. Upewnij się, że Twoje wyskakujące okienko oferuje coś naprawdę przydatnego, jak zniżkę, darmowy zasób lub ekskluzywną treść. Utrzymuj wyskakujące okienko na tyle małe, aby użytkownicy nadal widzieli część Twojej głównej treści, i nigdy nie pokazuj tego samego wyskakującego okienka wielokrotnie temu samemu odwiedzającemu.

4. Jak duży powinien być wyskakujący element na urządzeniach mobilnych?

Wysuwane okna mobilne nie powinny zajmować więcej niż 50-60% ekranu, aby nie były uznawane za inwazyjne. Zalecamy stosowanie responsywnych wysuwanych okien, które automatycznie dostosowują się do różnych rozmiarów ekranu. Wysuwane okna typu „slide-in” lub banery sprawdzają się szczególnie dobrze na urządzeniach mobilnych, ponieważ nie blokują całkowicie treści. Zawsze testuj swoje wysuwane okna na różnych urządzeniach mobilnych, aby upewnić się, że wyświetlają się poprawnie.

5. Czy wyskakujące okienka mobilne faktycznie zwiększają konwersje?

Tak, prawidłowo wdrożone wyskakujące okienka mobilne mogą znacząco zwiększyć konwersje. Widzieliśmy, jak wskaźniki zapisów na e-mail wzrosły o 600% przy użyciu odpowiednio zaprojektowanych wyskakujących okienek mobilnych. Kluczem jest oferowanie prawdziwej wartości, odpowiednie wyczucie czasu i łatwość ich zamknięcia. Użytkownicy mobilni są bardziej skłonni do konwersji, gdy wyskakujące okienka są dopasowane do ich zainteresowań i nie przerywają ich przeglądania.

Dodatkowe zasoby do tworzenia skutecznych wyskakujących okienek

Możesz również zapoznać się z innymi pomocnymi przewodnikami na temat tworzenia wyskakujących okienek w celu zwiększenia konwersji na Twojej stronie:

Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak utworzyć wyskakujące okienko z kuponem w WordPress. Możesz również zapoznać się z naszym wyborem najlepszych wtyczek WooCommerce lub naszym przewodnikiem jak dodać powiadomienia push w sieci do swojej witryny WordPress.

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.

Ujawnienie: Nasze treści są wspierane przez czytelników. Oznacza to, że jeśli klikniesz w niektóre z naszych linków, możemy otrzymać prowizję. Zobacz jak finansowany jest WPBeginner, dlaczego to ważne i jak możesz nas wesprzeć. Oto nasz proces redakcyjny.

Ostateczny zestaw narzędzi WordPress

Uzyskaj BEZPŁATNY dostęp do naszego zestawu narzędzi – kolekcji produktów i zasobów związanych z WordPress, które powinien mieć każdy profesjonalista!

Interakcje czytelników

4 CommentsLeave a Reply

  1. Z powodzeniem stosowałem wyskakujące okienka typu "exit-intent" na komputerach stacjonarnych, aby zmniejszyć liczbę porzuconych koszyków
    Chciałbym również wypróbować "exit-intent" na urządzeniach mobilnych. jak działa "exit-intent" na urządzeniach mobilnych? jak jest w ogóle uruchamiany?

      • triggering by detecting scrolling up is clever – Now I have a better grasp of how to utilize this on my woocommerce store.
        Appreciate you taking the time to answer my question :-)

    • Mam ten wyzwalacz skonfigurowany w jednej z kampanii. Działa znakomicie na komputerach stacjonarnych, ale niestety na urządzeniach mobilnych działa tylko sporadycznie. Muszę przyznać, że istnieją znacznie lepsze wyzwalacze dla urządzeń mobilnych niż ten. Czasami działa, czasami nie. Prawdopodobnie zależy to od systemu operacyjnego i przeglądarki urządzenia mobilnego, ale osobiście ten wyzwalacz nie działa u mnie dobrze.

Zostaw odpowiedź

Dziękujemy za pozostawienie komentarza. Pamiętaj, że wszystkie komentarze są moderowane zgodnie z naszą polityką komentowania, a Twój adres e-mail NIE zostanie opublikowany. Prosimy NIE używać słów kluczowych w polu nazwy. Prowadźmy osobistą i znaczącą rozmowę.