Toplayery
W sekcji Sklep > Toplayery
dostępny jest moduł pozwalający stworzyć toplayer, czyli tzw. wyskakujące okienko, przy pomocy kreatora toplayerów lub własnego kodu HTML. Toplayer to uniwersalne narzędzie do prezentowania różnorodnych komunikatów w sklepie. Może być używany m.in. do promowania bieżących ofert i rabatów lub prezentowania nowości czy aktualnych przecen. Często stosuje się go także jako wezwanie do działania (CTA), np. zachętę do zapisania się na newsletter czy skorzystania z kodu rabatowego.
Lista toplayerów
Lista toplayerów zawiera wszystkie utworzone toplayery podzielone na 4 sekcje; wszystkie, aktywne, nieaktywne i usunięte, co ułatwia zarządzanie toplayerami dostępnymi w sklepie (1).
Poza nazwą toplayera na liście znajdziesz również informacje ze statusem jego aktywności i datę ostatniej modyfikacji toplayera (2). Z poziomu listy toplayerów możesz również przejść do edycji toplayera, utworzyć jego kopię lub usunąć go (3) (zostanie przeniesiony do zakładki "usunięte" z której możesz przywrócić go w każdym monecie). W prawym górnym rogu strony (4) znajdziesz listę rozwijaną pozwalającą na przełączanie się między sklepami i dostępnymi w nich toplayerami, a zaraz obok przycisk pozwalający na utworzenie toplayera. Kliknięcie przycisku "Dodaj toplayer" lub przejście do edycji dowolnego z istniejących pop-up'ów przeniesie cię na stronę edycji toplayera.
Toplayery posiadające ID od 1 do 18 to toplayery standardowe stworzone przez IAI. Możesz zarządzać ich widocznością na stronie, ale nie możesz edytować ich treści. Jeśli chcesz skorzystać z jednego z tych toplayerów i zmienić jego treść, musisz wcześniej stworzyć jego kopię za pomocą opcji "powiel".
Edytor toplayerów
Strona edycji toplayera zawiera wiele opcji umożliwiających dostosowanie sposobu jego wyświetlania, na podstronie tej dostosujesz czas i ilość wyświetleń toplayera, jego pozycję i inne warunki wyświetlania, które zostały szczegółowo opisane w dalszej części tego akapitu.
Status i dodatkowe ustawienia toplayera — w prawym górnym rogu sekcji znajdziesz przyciski pozwalające aktywować toplayer, uruchomić jego podgląd oraz dodatkowe narzędzia pozwalające zarządzań toplayerami. W sekcji "Więcej" znajdują się:
Historia zmian — w historii zmian podejrzysz i przywrócisz wszystkie zapisane wersje toplayerów, co może okazać się pomocne w przypadku potrzeby powrotu do wcześniejszej wersji. Przy każdej wersji znajduje się również informacja o tym który użytkownik panelu dokonał edycji pop-up'u.
Eksport ICF — pozwala pobrać aktualne ustawienia toplayera wraz z jego treścią do pliku w formacie IFC.
Import ICF — Wczytuje z pliku konfigurację toplayera, który wcześniej został eksportowany. Po zaimportowaniu należy zapisać zmiany, aby móc korzystać z importowanego toplayera.
Opcja "Powiel" — Tworzy kopię obecnie edytowanego pop-up'u jako nowy toplayer na liście toplayerów.
Opcja "Usuń" — Usuwa toplayer, toplayer możesz przywrócić z sekcji "Usunięte".
Język edycji — jeden toplayer może zostać wykorzystany w wielu sklepach i wersjach językowych na raz. W tym celu niezbędnym jest uzupełnienie pozostałych wersji językowych Twojego toplayera. Przy zmianie języka zmieniana jest tylko treść toplayera, ustawienia wyświetlania są wspólne dla wszystkich języków.
Tytuł i zawartość toplayera — w tym miejscu nazwiesz swój toplayer, aby móc łatwiej wyszukać go na liście toplayerów. Pełna treść zawiera kod całego toplayera. Możesz zakodować toplayer samodzielnie dodając w tym miejscu kod HTML, lub skorzystać z kreatora toplayerów.
Widoczność toplayera
Ustawienia widoczności pozwalają wybrać jakiej grupie użytkowników zostanie wyświetlony toplayer (4). Możesz wybrać czy pop-up będzie pojawiał się tylko użytkownikom zalogowanym/detalistom/hurtownikom, czy wszystkim. Jeśli wybierzesz grupę użytkowników zarejestrowanych (np. Detalistów i Hurtowników), pojawią się dodatkowe opcje konfiguracji. Opcje te pozwolą wyświetlić toplayer klientom, którzy zapisali/nie zapisali się do newslettera, klientom bez zrealizowanych zamówień, oraz klientom, którzy kupili już coś w Twoim sklepie.
Opcje Data rozpoczęcia i data zakończenia (5) — pozwalają na wybór zakresu czasowego, w którym ma działać toplayer. Brak uzupełnionych dat sprawi, że aktywnością toplayera będziesz sterować ręcznie.
Sklepy i Strony (6) — sekcja ta pozwala na wybranie sklepów, w których ma wyświetlać się dany toplayer. Dzięki opcji strony wybierzesz czy pasek ma być widoczny na wszystkich podstronach, czy na wybranych typach podstron takich jak: strona główna, koszyk, strona nawigacji, karta towaru, wyniki wyszukiwania (lista towarów), zapisanie do mailingu (strona zapisu do newslettera). Opcja "własne adresy stron" pozwala na dodawanie własnych linków, pod którymi dostępny będzie pasek informacyjny.
Zaawansowane ustawienia toplayerów
7. Widoczność na urządzeniach — pozwala na wybór, na jakich urządzeniach ma wyświetlać się konfigurowany toplayer. Pop'up możesz wyświetlać na małych ekranach telefonów, ekranie komputera lub na obu urządzaniach na raz.
8. Opcje wyświetlania — Opcje wyświetlania pozwalają na ustawienie poniższych właściwości:
Czas wyświetlania toplayera: po jakim czasie toplayer ma automatycznie zniknąć
Opóźnienie wyświetlania: opcja pozwala wyświetlić toplayer dopiero po wskazanym czasie. Jeśli klient opuści stronę przed wyświetleniem toplayera, licznik zostanie zresetowany.
Wyświetlaj jeśli strona została odwiedzona x razy: spraw, żeby toplayer wyświetlił się z opóźnieniem, np. po 3 wejściu w konkretną kategorię, taki toplayer może skłonić klienta do zakupu, oferując dodatkowy rabat na wybrane produkty.
Wyświetlaj do momentu zamknięcia/Liczba wyświetleń: możesz wybrać czy toplayer ma pojawić się określoną ilość razy, czy będzie działał do momentu jego zamknięcia przy pomocy przycisku "x" znajdującego się na toplayerze.
Wyświetlaj ponownie po zamknięciu jeśli minie x dni: dzięki tej opcji skonfigurujesz czas, po którym toplayer wyświetli się ponownie, jeśli jego wyświetlanie ustawione jest na "do momentu zamknięcia".
9. Wczytywanie — konfiguracja wczytywania pozwala na wybór czy toplayer ma załadować się po całkowitym załadowaniu strony (dłuższy czas oczekiwania na wyświetlenie toplayera związany z oczekiwaniem na pełne załadowanie się strony), czy ładowany z treścią strony (skuteczniejsze ładowanie toplayerów, rekomendowane przy prostych toplayerach, które nie posiadają skomplikowanych mechanizmów/skryptów)
W sekcji tej znajduje się również opcja umożliwiająca wywołanie toplayera w momencie aktywacji dowolnego kodu rabatowego poprzez wprowadzenie go w polu na kod rabatowy.
10. Ustawienia wyglądu toplayerów — sekcja wyglądu umożliwia wybór jednej z 5 domyślnych pozycji toplayera, najczęściej spotykanym wyborem dla umiejscowienia toplayera jest "środek strony".
Wymiary — szerokość i wysokość pop-up'u możesz ustawić ręcznie, natomiast jeśli korzystasz z kreatora toplayerów, sugerujemy wyłączyć tę opcję, ponieważ w tym przypadku, wymiary toplayera zostaną wskazane w wygenerowanym przez kreator kodzie.
Przypięcie toplayera — pozwala na przypięcie toplayera do wybranej pozycji na stronie (np. na środku ekranu), jeśli klient będzie przewijał stronę w dół, toplayer pozostanie na środku, podążając za użytkownikiem.
Aby zwrócić uwagę użytkownika na toplayer, możesz wykorzystać dodatkową opcję "Przyciemnione tło pod toplayerem" która skutecznie przyciemni pozostałą część strony do czasu zamknięcia pop-up'u.
Kreator toplayerów
Kreator pozwala na tworzenie toplayerów od zera, lub na podstawie istniejących już gotowych szablonów. W każdym toplayerze możesz umieścić lub zmienić tekst, czcionkę, grafikę, kolory i układ treści. Kreator toplayerów to intuicyjne narzędzie do projektowania tzw. pop-up’ów bez konieczności pisania kodu, kreator pozwala na swobodnie zmienianie treści (tekst, obrazy), dobór czcionki, kolorów oraz układu poszczególnych elementów toplayerów.
Każdy toplayer tworzony w kreatorze złożony jest z wielu komponentów za pomocą mechanizmu drag & drop. Dzięki temu każdy użytkownik może stworzyć toplayer samodzielnie i szybko umieścić go w sklepie. Moduł został podzielony na sekcje, w których znajdują się ustawienia poszeregowane według tematyki, żeby korzystanie z niego było jeszcze łatwiejsze.
Kreator toplayerów składa się z pola edycji toplayera oraz kolumny bocznej.
Sekcja “Widok” nad polem edycji daje możliwość weryfikacji, jak toplayer zachowa się przy różnej szerokości urządzeń: na komputerze, tablecie i smartfonie. Obok niej znajdują się opcje wyłączenia obramowań komponentów w podglądzie toplayera, cofnięcia ostatnich zmian, oraz całkowitego wyczyszczenia pola edycji.
Pole edycji toplayera
Centralnym elementem kreatora toplayerów jest interaktywny obszar roboczy, który umożliwia swobodne projektowanie zawartości poprzez mechanizm drag & drop (przeciągnij i upuść). Wszystkie komponenty – takie jak teksty, obrazy, przyciski czy kontenery – mogą być dowolnie przenoszone i układane w obrębie projektu. Ich kolejność na warstwach można zmieniać, co wpływa na sposób ich wyświetlania (np. który element jest na wierzchu).
Po jednokrotnym kliknięciu w dowolny element, w prawym górnym rogu wyświetla się zestaw podstawowych opcji kontekstowych:
Przenieś focus do elementu nadrzędnego – pozwala łatwo zaznaczyć kontener, w którym znajduje się wybrany element, np. ramkę lub kolumnę zawierającą kilka komponentów. Ułatwia to zarządzanie zawartością toplayera.
Przenieś element – umożliwia przeciągnięcie komponentu do innej części toplayera.
Powiel zaznaczony element – tworzy kopię wybranego komponentu wraz z jego zawartością i stylem.
Usuń zaznaczony element – natychmiastowo usuwa dany komponent z projektu.
Dwukrotne kliknięcie na element otwiera jego edycję:
W przypadku pola tekstowego — możliwe jest bezpośrednie edytowanie treści. Dodatkowo nad tekstem pojawia się pasek opcji formatowania, który umożliwia:
pogrubienie tekstu,
zastosowanie kursywy,
podkreślenie,
przekreślenie,
dodanie odnośnika do innej strony (linkowanie).
W przypadku obrazu — otwiera się okno wyboru grafiki, które pozwala na zmianę ilustracji z poziomu biblioteki plików lub dodanie nowego pliku.
Dzięki tym funkcjom obszar edycji pozwala na szybkie, intuicyjne i precyzyjne dostosowanie wyglądu oraz struktury toplayera – zarówno dla prostych komunikatów, jak i bardziej rozbudowanych kompozycji.
Kolumna boczna
Kolumna boczna zawiera wszystkie narzędzia potrzebne do edycji toplayerów, podzielone na cztery logiczne sekcje tematyczne, ułatwiające zarządzanie projektem:
Szablony toplayerów— w szablonach znajdziesz 7 gotowych szablonów toplayerów, które przyśpieszą proces tworzenia komunikatu. Rekomendujemy rozpoczęcie pracy od wybrania jednego z tych szablonów, przeciągnięcia go na pole robocze i dostosowania jego treści do swoich potrzeb.
Komponenty — podzielone na kilka rodzajów komponenty zawierają gotowe sekcje, które możesz wykorzystać, aby nadać swojemu toplayerowi indywidualnego charakteru. Komponenty w przeciwieństwie do gotowych szablonów nie mają przypisanych swoich funkcji. Samo dodanie komponentu z przyciskiem “wyślij” lub komponentów pola formularza nie sprawi, że formularz ten zacznie prawidłowo zbierać uzupełnione dane, będzie to wymagało zakodowania w treści HTML toplayera, po zakończeniu jego edycji. W takich przypadkach możesz skorzystać z dostępnych szablonów, ponieważ wszystkie przyciski i formularz zapisu do newslettera dostępne w gotowych toplayerach są w pełni funkcjonalne, a zapis do newslettera za ich pomocą działa prawidłowo.
Warstwy — wszystkie elementy układają się w logiczną strukturę reprezentowaną przez osobne warstwy, dzięki nim masz pełną kontrolę nad kolejnością ich wyświetlania oraz możesz upewnić się, czy dany element jest umieszczony w odpowiednim bloku/kolumnie.
CSS — w tej zakładce zmienisz każdy aspekt wizualny zaznaczonego właśnie elementu. Sekcja CSS pozwala w wygodny sposób modyfikować stylowanie CSS komponentów w banerze. Ustawienia CSS podzielone są na kilka sekcji, ale najważniejsze i najczęściej używane atrybuty, takie jak kolor tła, wielkość, rodzaj fontu i wyrównanie do krawędzi znajdziesz w zakładce „podstawowe”.
Kreator toplayerów jest przeznaczony zarówno dla początkujących, jak i zaawansowanych użytkowników. Dzięki prostemu interfejsowi nawet osoby bez wiedzy programistycznej mogą tworzyć atrakcyjne banery, a zaawansowani użytkownicy zyskają pełną kontrolę nad stylem i funkcjonalnością poprzez wprowadzenie własnych ustawień CSS.