Hotspoty (PRO)

Hotspot to klikalna kropka, którą umieszczasz na obrazie lub wideo. Najechanie pokazuje tooltip; kliknięcie wyzwala akcję. Użyj hotspotów, żeby zamienić obraz hero w showcase produktów, wskazać konkretne cechy lub uruchomić ukierunkowane flow dodaj-do-koszyka.

Co może robić hotspot

Lista Click action hotspotu oferuje:

Link — przejdź do dowolnego URL (z opcjonalnym Link target)
Product — otwórz stronę szczegółów produktu (wybierz produkt przez picker Select product)
Category — otwórz listing kategorii (przez picker Select category)
(Plus szablony bazowe wspierają dodaj-do-koszyka i niestandardowe akcje przez integrację z theme.)

Jak dodać hotspoty

Otwórz produkt → zakładka Media i wybierz obraz lub wideo, które chcesz oznaczyć.
W bocznym panelu Mediaverse znajdź kartę Hotspots.
Kliknij Add hotspot. Nowa kropka pojawia się na obrazie; przeciągnij ją w żądane miejsce.
Wypełnij formularz hotspotu:
- Icon + przełącznik Show icon
- Title + przełącznik Show title
- Tooltip + przełącznik Show tooltip
- Click action (Link / Product / Category) + cel
- Position — pionowe i poziome procenty (przeciągnij kropkę albo wpisz)
- Theme, Animation (none / ripple / splash / glow / pulse), Border itd.
- Sekcja Custom styles — kolor ikony, kolor tekstu, rozmiar czcionki, kolor / szerokość / styl / radius obramowania, kolor tła, backdrop filter, box shadow
Powtórz dla wszystkich hotspotów. Użyj akcji wiersza (Move up, Move down, Move to top, Move to bottom, New before, New after), żeby zmienić kolejność.
Zapisz produkt.

Stylowanie i animacja

Domyślny wygląd hotspotu konfigurujesz globalnie w Settings → Plugins → Mediaverse → Hotspots. Strona konfiguracji dzieli się na zakładki:

General / Icon / Tooltip / Theme / Tooltip Theme

Theme można dostosować za pomocą trzech presetów palety — Default, Light, Dark.

Tooltipy hotspotów renderują się przez Popper.js dla poprawnego pozycjonowania nawet przy overflow-clipped kontenerach.