Creative Popupy drag & drop: targeting smart - Module PrestaShop

Oto tłumaczenie na język polski, z zachowaniem wszystkich znaczników HTML oraz terminologii technicznej typowej dla ekosystemu PrestaShop.

Twórz popupy, które konwertują, dzięki wizualnemu edytorowi drag & drop

Każdego dnia tracisz odwiedzających, nie pokazując im właściwego komunikatu we właściwym czasie. Creative Popup to najbardziej kompletny moduł do tworzenia popupów dla PrestaShop na rynku. Dzięki wizualnemu edytorowi drag & drop opartemu na GrapesJS, 5 inteligentnym wyzwalaczom oraz zaawansowanemu targetowaniu odbiorców, stworzysz efektowne popupy, które przyciągną uwagę użytkowników i zmienią ich w klientów — bez pisania ani jednej linii kodu.

Niezależnie od tego, czy chcesz odzyskiwać porzucone koszyki, zbierać adresy email do newslettera, wyświetlać kod rabatowy podczas wyprzedaży flash, czy wdrożyć pasek zgody na pliki cookie, Creative Popup daje Ci wszystkie narzędzia, aby osiągnąć to w kilka minut.

Prawdziwy edytor wizualny, a nie zwykły edytor tekstu

Zapomnij o podstawowych edytorach WYSIWYG, takich jak TinyMCE. Creative Popup integruje pełny edytor wizualny GrapesJS bezpośrednio w Twoim panelu administracyjnym PrestaShop. Otrzymujesz prawdziwe płótno projektowe, na którym możesz przeciągać i upuszczać elementy, dowolnie je rozmieszczać i personalizować każdy szczegół wizualny.

Edytor zawiera 10 wyspecjalizowanych bloków zaprojektowanych dla popupów e-commerce:

• Heading — Nagłówek główny z edytowalnym tekstem i konfigurowalnymi stylami
• Paragraph — Tekst opisowy dla Twoich ofert i komunikatów
• Image — Grafika produktu, ilustracja lub logo z wbudowanym przesyłaniem plików
• CTA Button — Przycisk wezwania do działania z konfigurowalnym linkiem, kolorem i tekstem
• Newsletter Form — Formularz zapisu na email połączony z bazą PrestaShop
• Separator — Wizualna linia oddzielająca
• Countdown — Animowany licznik czasu, aby stworzyć poczucie pilności
• Promo Code — Wyświetlanie kodu rabatowego z przyciskiem kopiowania jednym kliknięciem
• Social Follow — Ikony mediów społecznościowych (Facebook, Instagram, Twitter itp.)
• Close Button — Przycisk zamykania z możliwością zmiany pozycji i wyglądu

Panel Layers (Warstwy) wyświetla strukturę wszystkich elementów popupu dla łatwej nawigacji. Style Manager daje pełną kontrolę nad typografią, kolorami, tłem, obramowaniem, odstępami i cieniami. Panel Traits pozwala konfigurować właściwości funkcjonalne każdego elementu (adresy URL przycisków, teksty linków itp.).

Możesz także podglądać swój popup w czasie rzeczywistym na 3 rozmiarach ekranów (desktop, tablet, mobile) dzięki zintegrowanemu przełącznikowi urządzeń.

5 inteligentnych wyzwalaczy, aby wyświetlać popupy w idealnym momencie

Moment wyświetlenia popupu jest tak samo ważny jak jego treść. Creative Popup oferuje 5 rodzajów wyzwalaczy (triggers), aby zmaksymalizować wpływ Twoich komunikatów:

Exit intent — Zatrzymaj wychodzących użytkowników

Wyzwalacz exit intent wykrywa ruch myszy użytkownika w stronę górnej krawędzi okna, co sygnalizuje zamiar opuszczenia strony. To idealny moment, aby zaproponować ofertę specjalną, kod rabatowy lub poprosić o adres email. Ten trigger jest wyjątkowo skuteczny w odzyskiwaniu porzuconych koszyków.

Timer — Wybierz precyzyjny moment

Wyświetl popup po określonym czasie w milisekundach od załadowania strony. Natychmiast po załadowaniu, po 3 sekundach dla pilnych ofert lub po 10 sekundach, aby pozwolić użytkownikowi najpierw zapoznać się z treścią.

Inaktywność — Reaktywuj wahających się klientów

Trigger inaktywności monitoruje zachowanie odwiedzających. Gdy przestają oni wykazywać aktywność (brak ruchu myszy, przewijania, kliknięć), często oznacza to wahanie lub zamiar rezygnacji. Popup z ofertą specjalną może ich reaktywować i skłonić do zakupu.

Scroll — Nagradzaj zaangażowanie

Uruchom popup, gdy użytkownik przewinie określony procent strony lub zdefiniowaną liczbę pikseli. Odwiedzający, który przeczytał 50% strony, wykazał zainteresowanie — to idealny czas na propozycję zapisu do newslettera lub przedstawienie oferty.

Kliknięcie w element — Popup na żądanie

Uruchom popup, gdy użytkownik kliknie w konkretny element na stronie: przycisk, link lub baner. Wyzwalacz definiujesz za pomocą selektora CSS (klasa, ID lub dowolny atrybut HTML). Idealne dla popupów informacyjnych lub formularzy kontekstowych.

Zaawansowane targetowanie — Właściwy przekaz do właściwego klienta

Skuteczny popup to popup trafny. Creative Popup posiada potężny system targetowania, aby dostarczać odpowiednie treści do konkretnych segmentów odbiorców. Możesz łączyć wiele reguł (logika AND):

• Typ strony — Wyświetlaj popup tylko na stronie głównej, stronach produktów, kategorii, w koszyku, procesie zamówienia lub na stronach CMS
• Kategoria — Celuj w użytkowników przeglądających konkretną kategorię w Twoim katalogu
• Produkt — Wyświetlaj popup tylko na karcie jednego lub kilku wybranych produktów
• Grupa klientów — Celuj w niezalogowanych gości, klientów zalogowanych lub Twoje niestandardowe grupy
• Urządzenie — Wyświetlaj różne popupy na komputerach, tabletach i telefonach
• Nowy użytkownik — Kieruj przekaz tylko do osób odwiedzających stronę po raz pierwszy
• Powracający użytkownik — Celuj w osoby, które już wcześniej odwiedziły Twój sklep
• URL zawiera — Uruchom popup, gdy adres URL strony zawiera określone słowo kluczowe

Filtrowanie odbywa się po stronie serwera (PHP): tylko popupy pasujące do kontekstu użytkownika są przesyłane do przeglądarki. Żadne niepotrzebne skrypty nie są ładowane, co gwarantuje brak wpływu na wydajność Twojej strony.

Harmonogram i częstotliwość wyświetlania

Precyzyjnie kontroluj, kiedy i jak często pojawiają się Twoje popupy:

• Planowanie datami — Ustaw datę i godzinę rozpoczęcia oraz zakończenia kampanii. Stwórz popup na Black Friday z wyprzedzeniem, zaplanuj go od 25 do 30 listopada, a włączy się i wyłączy automatycznie.
• Częstotliwość wyświetlania — Wybierz spośród 4 trybów: zawsze, raz na sesję przeglądarki, tylko raz (stałe ciasteczko 365 dni) lub co X dni. Twoi klienci nie poczują się spamowani.
• System priorytetów — Gdy kilka popupów pasuje do tego samego kontekstu, ten o najwyższym priorytecie wyświetli się jako pierwszy.

6 pozycji wyświetlania i 7 animacji

Dopasuj pozycję popupu do jego celu:

• Środek (modal) — Klasyczna pozycja dla ofert promocyjnych, newsletterów i ważnych komunikatów
• Górny pasek (top bar) — Stały pasek na górze ekranu, idealny do ogłoszeń, kodów rabatowych i info o dostawie
• Dolny pasek (bottom bar) — Stały pasek na dole, idealny dla zgód cookie i informacji prawnych
• Slide-in lewo / prawo — Wysuwany popup dla dyskretnych komunikatów i promocji pobocznych
• Pełny ekran (fullscreen) — Dla kluczowych komunikatów: ekrany powitalne, wyprzedaże flash, ważne wydarzenia

Każdy popup posiada animację wejścia i wyjścia spośród 7 efektów: fadeIn, slideInUp, slideInDown, slideInLeft, slideInRight, zoomIn oraz bounceIn. Animacje są w czystym CSS, bez zewnętrznych bibliotek, dla optymalnej szybkości.

Zintegrowany licznik, aby stworzyć presję czasu

Dodaj blok Countdown do swojego popupu, aby wywołać poczucie pilności skłaniające do działania. Dostępne są dwa tryby:

• Czas trwania — Odliczanie oparte na liczbie godzin, minut i sekund. Każdy użytkownik widzi ten sam pozostały czas od momentu wyświetlenia popupu. Idealne dla ofert typu „Ważne przez 2 godziny”.
• Stała data końcowa — Odliczanie do konkretnej daty i godziny. Wszyscy odwiedzający widzą ten sam pozostały czas w czasie rzeczywistym. Perfekcyjne dla wyprzedaży flash ze wspólnym terminem zakończenia.

Około 30 gotowych szablonów do użycia

Nie zaczynaj od zera. Creative Popup zawiera około 30 profesjonalnych szablonów, które możesz załadować jednym kliknięciem i spersonalizować w edytorze wizualnym.

Szablony sezonowe

Black Friday, Cyber Monday, Boże Narodzenie, Halloween, Walentynki, Wielkanoc, Dzień Matki, Dzień Ojca, Wyprzedaż letnia, Wyprzedaż zimowa, Nowy Rok, Karnawał, Singles Day, Powrót do szkoły.

Szablony użytkowe

Zapis na newsletter, Kod rabatowy, Odzyskiwanie koszyka (exit intent), Zgoda na cookie, Powitanie fullscreen, Media społecznościowe, Baner aplikacji mobilnej, Wyprzedaż flash z licznikiem.

Każdy szablon jest w pełni edytowalny: zmieniaj teksty, kolory, zdjęcia, dodawaj lub usuwaj elementy. Szablon to tylko punkt wyjścia dla Twojej kreatywności.

Pełne wsparcie wielojęzyczności

Twórz inną treść dla każdego języka w Twoim sklepie. Przełącznik języków u góry edytora pozwala łatwo przełączać się między tłumaczeniami. Przycisk "Copy from" umożliwia skopiowanie treści z istniejącego języka jako bazy do tłumaczenia.

Parametry konfiguracyjne (wyzwalacz, targetowanie, pozycja, harmonogram) są wspólne dla wszystkich języków. Tylko treść wizualna zmienia się zależnie od języka.

Kompatybilność z Multistore

Każdy popup może być przypisany do jednego lub wielu sklepów w Twojej sieci multistore PrestaShop. Filtrowanie odbywa się automatycznie po stronie front-endu. Zarządzaj różnymi kampaniami dla każdego ze swoich sklepów z jednego panelu administracyjnego.

Zintegrowane statystyki

Śledź skuteczność swoich popupów dzięki wbudowanym statystykom:

• Wyświetlenia — Liczba wyświetleń popupu
• Zamknięcia — Liczba kliknięć w przycisk zamknięcia
• Kliknięcia CTA — Liczba kliknięć w przyciski akcji wewnątrz popupu

Statystyki są agregowane dziennie, a licznik wyświetleń jest widoczny bezpośrednio na liście w Popup Managerze. Przesyłanie danych wykorzystuje navigator.sendBeacon(), co zapewnia brak wpływu na komfort użytkownika.

Optymalna wydajność — Zero wpływu, gdy popupy nie są aktywne

W przeciwieństwie do innych modułów, które ładują swoje skrypty na każdej stronie, Creative Popup stosuje inteligentne podejście po stronie serwera:

• Przy każdym odświeżeniu strony silnik PHP sprawdza kontekst użytkownika (strona, urządzenie, grupa, język, sklep)
• Jeśli żaden popup nie pasuje do kontekstu → nie ładuje się żaden skrypt JS ani arkusz CSS. Brak wpływu na wydajność.
• Jeśli popup pasuje → wstrzykiwany jest tylko HTML/CSS popupu oraz ultralekki skrypt JS (~15 KB)
• GrapesJS nigdy nie jest ładowany na froncie — edytor działa wyłącznie w panelu administracyjnym

Nowoczesna architektura techniczna

• Kontrolery 100% Symfony — Natywny interfejs PrestaShop, brak przestarzałego kodu (legacy)
• Kompatybilność z PrestaShop 8.x oraz 9.x (Symfony 4.4 i 6.4)
• Alpine.js dla interaktywności popupów na froncie
• Vanilla JavaScript dla silnika wyzwalaczy (brak zależności)
• Brak nadpisań (overrides) plików rdzenia PrestaShop
• Kompatybilność z PHP 8.1, 8.2, 8.3 i 8.4
• Kompatybilność z MySQL 5.7+, MySQL 8.0 i MariaDB 10.3+
• Zgodność z szablonami Classic, Hummingbird oraz motywami niestandardowymi

Konkretne przykłady użycia

Odzyskiwanie porzuconych koszyków

Użyj szablonu "Exit Intent Cart" z wyzwalaczem Exit Intent, skierowanego na stronę koszyka dla komputerów. Zaproponuj rabat lub darmową dostawę osobom, które próbują opuścić koszyk.

Zbieranie zapisów do newslettera

Użyj szablonu "Newsletter Signup" z wyzwalaczem Timer (5 sekund) lub Scroll (50%), skierowanego do nowych użytkowników. Częstotliwość: tylko raz, aby nie być intruzywnym.

Pasek zgody cookie RODO

Użyj szablonu "Cookie Consent" z wyzwalaczem Timer (500ms), w pozycji dolnego paska. Częstotliwość: tylko raz. Brak reguł targetowania, aby wyświetlał się na wszystkich stronach.

Wyprzedaż Black Friday

Użyj szablonu "Black Friday" z blokiem Countdown ustawionym na datę zakończenia akcji. Harmonogram: od 25 do 30 listopada. Częstotliwość: raz na sesję. Popup sam się włączy i wyłączy.

Różne popupy zależnie od urządzenia

Stwórz popup "Desktop" w pozycji środkowej i popup "Mobile" w pozycji dolnego paska, każdy skierowany na odpowiednie urządzenie. Każdy klient zobaczy wersję zoptymalizowaną pod swój ekran.

Promocja celowana na kategorię

Stwórz popup oferujący -15% na buty, skierowany wyłącznie na kategorię Obuwie. Wyzwalacz Scroll (30%). Tylko klienci zainteresowani tą kategorią zobaczą ofertę.

Szybka i prosta instalacja

Pobierz moduł z Marketplace PrestaShop Addons, prześlij go w panelu przez Moduły > Menedżer modułów > Załaduj moduł i zacznij tworzyć popupy od razu. Instalacja automatycznie tworzy tabele w bazie danych i rejestruje niezbędne hooki. Nie jest wymagana żadna konfiguracja techniczna.

Pomoc techniczna

Potrzebujesz pomocy? Nasz zespół wsparcia odpowiada w ciągu 24 do 48 godzin roboczych poprzez stronę modułu na PrestaShop Addons. Pomagamy w konfiguracji, rozwiązywaniu problemów technicznych i optymalizacji kampanii.