Dokumentacja WP InSpot

Ostatnia aktualizacja: 2026-07-28 · dotyczy WP InSpot 1.3.0

1. Czym jest WP InSpot?

WP InSpot zamienia dowolny obraz na Twojej stronie WordPress w obraz interaktywny. Rysujesz na nim strefy — klikalne obszary — a każda z nich może pokazać tekst, wciągnąć wpis lub produkt, otworzyć kolejny obraz albo prowadzić do odnośnika. Odwiedzający poznaje obraz, najeżdżając na niego, klikając lub dotykając.

Typowe zastosowania: rzuty mieszkań i budynków, zdjęcia produktów z opisem cech, plany obiektów i atrakcji, eksponaty muzealne, interaktywne infografiki.

1.1. Kluczowe pojęcia

Kilka terminów używanych w całej dokumentacji i w interfejsie wtyczki:

Pojęcie	Znaczenie
Obszar roboczy	Główny obiekt, na którym pracujesz: jeden obraz wraz z narysowanymi na nim strefami. Obszary robocze tworzysz, edytujesz i osadzasz na stronach.
Strefa (hotspot)	Obszar narysowany na obrazie — wielokąt, prostokąt, koło, znacznik lub etykieta tekstowa.
Typ strefy	To, co strefa robi: pokazuje tekst, wyświetla wpis, otwiera zagnieżdżony obszar roboczy, prowadzi do odnośnika albo nie robi nic.
Wpis	Treść z WordPressa — wpis, strona lub produkt — pokazywana w oknie, panelu bocznym lub oknie modalnym strefy. W interfejsie wtyczki to nazwa typu strefy.
Szablon	Układ decydujący o tym, które pola wpisu (tytuł, obraz, cena…) pojawią się po otwarciu strefy wpisu.
Zagnieżdżony obszar roboczy	Obszar roboczy otwierany ze strefy w innym obszarze. Tak buduje się przechodzenie między obrazami, np. plan budynku → piętro → mieszkanie.
Okno / Panel / Modal	Trzy sposoby wyświetlania treści strefy: małe okienko przy strefie, panel wysuwany z boku albo wyśrodkowana nakładka.

2. Instalacja

WP InSpot wymaga WordPressa 5.9 lub nowszego oraz PHP 8.0 lub nowszego.

2.1. Instalacja z pliku ZIP

1. W panelu WordPressa przejdź do Wtyczki → Dodaj nową.
2. Kliknij Wyślij wtyczkę na serwer.
3. Wskaż plik ZIP z WP InSpot.
4. Kliknij Zainstaluj teraz, a następnie Włącz.

2.2. Gdzie znaleźć wtyczkę

Po włączeniu w panelu pojawia się menu WP InSpot:

Sekcja	Do czego służy
Obszary robocze	Lista Twoich obszarów — edycja, duplikowanie, przenoszenie do kosza, przywracanie.
Dodaj nowy	Tworzy nowy obszar roboczy.
Ustawienia	Domyślny wygląd i zachowanie dla całej witryny.
Szablony	Układy prezentowania danych wpisu w strefach wpisów.
Samouczek	Wbudowany szybki samouczek.
Konto	Dane Twojej licencji i konta.

3. Szybki start: pierwszy obszar roboczy

1. Przejdź do WP InSpot → Dodaj nowy i nadaj obszarowi tytuł.
2. Kliknij Dodaj obraz i wybierz plik z Biblioteki mediów.
3. Narysuj strefy na obrazie za pomocą narzędzi rysowania.
4. Kliknij strefÄ™, nadaj jej etykietÄ™ i wybierz typ w panelu Ustawienia strefy.
5. Uzupełnij treść strefy — tekst, powiązany wpis, zagnieżdżony obszar roboczy albo adres URL.
6. Zapisz obszar roboczy.
7. Osadź go na dowolnej stronie blokiem WP InSpot albo shortcode’em widocznym na pasku narzędzi edytora.

Miejsce na wideo: Tworzenie obszaru roboczego od zera — dodanie obrazu, narysowanie kilku stref i osadzenie shortcode’a na stronie

3.1. Obsługiwane formaty obrazów

Działa każdy format, który wyświetlą przeglądarki odwiedzających — w tym JPEG, PNG, WebP, GIF i SVG. Przy panoramach najlepiej sprawdza się szeroki JPEG lub PNG.

4. Free i Pro

WP InSpot Free jest w pełni funkcjonalny przy mniejszych projektach:

Obszar	Wersja Free
Obszary robocze	Do 3 (opublikowane lub szkice). Istniejące obszary zawsze pozostają edytowalne i działają dalej.
Szablony	1 zapisany szablon.
Treść wpisu	Wpisy i strony.

Pro znosi limity i dokłada dodatki:

• nieograniczona liczba obszarów roboczych i szablonów,
• strefy wpisów dla dowolnego publicznego typu treÅ›ci, w tym produktów WooCommerce,
• motywy nakÅ‚adek premium (Jasny, Ciemny, SzkÅ‚o, WÅ‚asny),
• animacje przejść miÄ™dzy zagnieżdżonymi obszarami roboczymi,
• wÅ‚asne kolory dla każdej strefy,
• widget Elementora,
• import i eksport obszarów roboczych.

Funkcje Pro są widoczne w interfejsie z ikoną kłódki i odnośnikiem do rozszerzenia planu, więc zawsze wiesz, co jest dostępne.

4.1. Za darmo dla każdego

Część możliwości celowo nie jest niczym ograniczona — działają tak samo w każdym planie, łącznie z Free: zagnieżdżone obszary robocze i odnośniki powrotne (w ramach limitu obszarów), tryb panoramy, efekty stref, mobilny widok listy ze znacznikami oraz mostek analityczny do GA4.

WP InSpot nigdy też nie dokÅ‚ada do Twojej strony plakietki, odnoÅ›nika ani podpisu „Powered by” — w żadnym planie. Twój front należy do Ciebie.

4.2. Jeśli licencja Pro wygaśnie

Nic nie znika z Twojej strony. Każdy obszar roboczy nadal wyświetla się odwiedzającym dokładnie tak jak wcześniej. Zmienia się edycja i stylowanie premium: motyw nakładek, przejścia między scenami i kolory poszczególnych stref wracają do wartości domyślnych, a edytowalne pozostają tylko najstarsze obszary mieszczące się w limicie Free — reszta przechodzi w tryb tylko do odczytu. Efektów stref to nie dotyczy — należą do każdego planu, więc wygaśnięcie licencji nigdy nie zatrzyma pulsującej strefy. Odnowienie licencji przywraca wszystko; w międzyczasie nic nie zostaje usunięte.

5. Obszary robocze

Lista WP InSpot → Obszary robocze pokazuje wszystkie obszary wraz z licznikami pozycji opublikowanych i szkiców.

Zakładki statusu u góry dzielą listę na Wszystkie, Opublikowane, Szkice i Kosz, każda z własnym licznikiem. Obszary rozpoczęte, ale nigdy niezapisane, pojawiają się jako automatyczne szkice z plakietką Niezapisany, więc nic nie ginie niewidoczne.

Lista obsługuje także:

• filtrowanie po nazwie,
• widok hierarchiczny — zagnieżdżone obszary pojawiajÄ… siÄ™ pod swoim rodzicem, w każdej zakÅ‚adce. Gdy rodzic trafi do kosza albo wypadnie z filtra, jego dzieci awansujÄ… na najwyższy poziom, zamiast zniknąć razem z nim,
• zwijanie i rozwijanie gaÅ‚Ä™zi,
• dziaÅ‚ania w wierszu: Edytuj, Szybka edycja, Duplikuj, Do kosza,
• pole wyboru przy każdym wierszu oraz pole „zaznacz wszystkie” w nagłówku — zobacz DziaÅ‚ania masowe.

5.1. Szybka edycja

Szybka edycja zmienia tytuł obszaru roboczego i jego rodzica bez otwierania edytora. Wtyczka sama pilnuje hierarchii: tytuł nie może być pusty, obszar nie może być własnym rodzicem ani zostać przeniesiony pod jednego ze swoich potomków.

5.2. Działania masowe

Zaznaczenie choćby jednego pola wyboru w wierszu odsłania pasek działań masowych nad listą, dzięki czemu pracujesz na całej partii zamiast wiersz po wierszu.

Pole zaznacz wszystkie obejmuje dokładnie te wiersze, które właśnie widzisz. Wiersze ukryte przez aktywny filtr albo schowane w zwiniętej gałęzi nigdy nie zostają zagarnięte, a jeśli zaznaczony wiersz zniknie z widoku — bo zmienił się filtr albo zwinąłeś jego rodzica — wypada z zaznaczenia. Działasz na tym, co widzisz.

Dostępne działania zależą od zakładki, w której jesteś:

Zakładka	Dostępne działania
Wszystkie, Opublikowane, Szkice	PrzenieÅ› do kosza, Duplikuj
Kosz	Przywróć, Usuń trwale

Działania nieodwracalne najpierw proszą o potwierdzenie, podając, ilu obszarów dotyczą, a jedno działanie obsługuje do 100 obszarów roboczych naraz.

Po zakoÅ„czeniu partii wynik jest raportowany uczciwie, a nie jako zdawkowe „gotowe”: dostajesz liczbÄ™ pozycji, które siÄ™ udaÅ‚y, a jeÅ›li czegoÅ› nie daÅ‚o siÄ™ przetworzyć — ile zostaÅ‚o pominiÄ™tych, na przykÅ‚ad „Przeniesione do kosza: 3. PominiÄ™te: 2″. Obszar zostaje pominiÄ™ty, gdy nie masz uprawnieÅ„ do jego edycji albo gdy już nie istnieje, a pominiÄ™cie jednego nigdy nie przerywa reszty partii.

5.3. Kosz i przywracanie

Obszary robocze przeniesione do kosza trafiają do zakładki Kosz, zamiast znikać. Każdy wiersz oferuje tam Przywróć, które wraca obszar jako szkic, oraz Usuń trwale, które kasuje go na dobre — razem z jego strefami i wpisami o obrazach, więc w bazie nie zostają osierocone dane.

5.4. Duplikowanie obszaru roboczego

Duplikuj kopiuje cały obszar roboczy: ustawienia, obraz i wszystkie strefy. Jeśli obszar ma zagnieżdżone obszary, wybierasz, czy skopiować go samego, czy razem z całym drzewem — skopiowane drzewo prowadzi do własnych kopii, a nie do oryginałów. To najszybszy sposób na tworzenie wariantów gotowego interaktywnego obrazu.

Duplikowanie masowe dziaÅ‚a inaczej i jest to celowe. Duplikowanie zaznaczenia z paska dziaÅ‚aÅ„ masowych kopiuje każdy obszar osobno: nie wciÄ…ga zagnieżdżonych drzew, a każda kopia powstaje na najwyższym poziomie, niezależnie od tego, gdzie staÅ‚ oryginaÅ‚. Kopia masowa to pÅ‚aska partia punktów wyjÅ›cia, a nie sklonowana hierarchia — raport mówi to wprost („Utworzono 3 kopie na najwyższym poziomie. Zagnieżdżone obszary robocze nie zostaÅ‚y uwzglÄ™dnione”). Gdy potrzebujesz drzewa, użyj Duplikuj w wierszu tego obszaru.

6. Edytor obszaru roboczego

Edytor to miejsce, w którym rysujesz i konfigurujesz strefy. Składa się z dwóch części: płótna z obrazem oraz panelu Ustawienia strefy.

Pasek narzędzi nad płótnem oferuje:

• Dodaj obraz / ZmieÅ„ obraz — wybiera obraz obszaru roboczego z Biblioteki mediów,
• PodglÄ…d — pokazuje obszar tak, jak zobaczÄ… go odwiedzajÄ…cy, bez wychodzenia z edytora,
• PeÅ‚ny ekran — rozwija edytor na caÅ‚y ekran,
• shortcode obszaru roboczego — kliknij, żeby skopiować,
• wskaźnik Niezapisane zmiany, żeby żadna praca nie przepadÅ‚a niezauważona.

6.1. Rysowanie stref — kształty

Pasek rysowania udostępnia pięć kształtów:

Kształt	Najlepszy do
Wielokąt	Nieregularnych obszarów — pomieszczeń, działek, obrysów budynków.
Prostokąt	Regularnych fragmentów obrazu.
Koło	Punktów zainteresowania i okrągłych obiektów.
Znacznik	Punktu z ikoną — zobacz Ikony znaczników.
Etykieta tekstowa	Skalowalnego tekstu umieszczonego wprost na obrazie. Etykieta strefy jest widocznym tekstem i skaluje się razem z powiększeniem obrazu.

6.2. Ustawienia strefy

Kliknij dowolną strefę, aby otworzyć jej panel ustawień:

• Etykieta — nazwa strefy. Pojawia siÄ™ w dymkach, na listach mobilnych i jest odczytywana przez czytniki ekranu, wiÄ™c nadaj czytelnÄ… etykietÄ™ każdej aktywnej strefie.
• Typ strefy — Pusta, Tekst, Wpis, Zagnieżdżony obszar roboczy lub OdnoÅ›nik (szczegóły w kolejnej sekcji).
• Pola zależne od typu — treść, powiÄ…zany wpis, docelowy obszar roboczy albo adres URL.
• Sposób wyÅ›wietlania treÅ›ci — ustawienie dla pojedynczej strefy, nadpisujÄ…ce globalny sposób otwierania treÅ›ci (okno, panel, modal); zobacz WyÅ›wietlanie treÅ›ci strefy.
• Ikona — dla stref typu znacznik.
• Efekt — zapÄ™tlona animacja przyciÄ…gajÄ…ca uwagÄ™: Brak, PowiÄ™kszenie lub Pulsowanie, z regulacjÄ… PrÄ™dkoÅ›ci i ZasiÄ™gu — zobacz Efekty stref.
• WÅ‚asne kolory (Pro) — przycisk palety w nagłówku panelu otwiera nadpisania kolorów dla danej strefy, z osobnymi zakÅ‚adkami Normalny i Najechanie dla koloru wypeÅ‚nienia, koloru obrysu, przezroczystoÅ›ci i gruboÅ›ci obrysu (do 36 px), oraz przyciskiem Reset przywracajÄ…cym kolory globalne. W planie darmowym przycisk ma plakietkÄ™ Pro i odnoÅ›nik do rozszerzenia planu, wiÄ™c widzisz, do czego sÅ‚uży, bez wybierania kolorów, które i tak nie zostaÅ‚yby zapisane.

Wyczyść strefę opróżnia konfigurację strefy; Usuń strefę kasuje ją całkowicie.

6.3. Efekty stref

Efekty stref kierują wzrok odwiedzającego na te obszary, które są najważniejsze. Każda strefa może zapętlić jedną z dwóch animacji:

Efekt	Jak wyglÄ…da
PowiÄ™kszenie	Delikatne „oddychanie” — strefa Å‚agodnie roÅ›nie i wraca do rozmiaru.
Pulsowanie	Echo na kształt kręgów na wodzie, rozchodzące się od obrysu strefy.

Animację reguluje się dla każdej strefy dwoma suwakami:

• PrÄ™dkość — Niska, Åšrednia (domyÅ›lnie) lub Wysoka.
• ZasiÄ™g — 1–10 (domyÅ›lnie 5): jak daleko rozchodzi siÄ™ fala albo jak gÅ‚Ä™boko „oddycha” powiÄ™kszenie; przy znacznikach steruje wielkoÅ›ciÄ… fali.

Efekty działają na każdym kształcie poza etykietami tekstowymi i są dostępne w każdym planie, łącznie z Free.

SÄ… też z zaÅ‚ożenia nienachalne: animacja zatrzymuje siÄ™, gdy odwiedzajÄ…cy najedzie na strefÄ™ lub wejdzie na niÄ… klawiaturÄ…, a osoby z systemowym ustawieniem „ograniczone animacje” nie zobaczÄ… jej wcale. Od strony wydajnoÅ›ci to czyste animacje CSS — skÅ‚adane przez GPU, bez JavaScriptu wykonywanego w każdej klatce — wiÄ™c nie spowalniajÄ… strony.

7. Typy stref

Typ	Co robi
Pusta	Nic — ksztaÅ‚t dekoracyjny albo „jeszcze nieskonfigurowany”.
Tekst	Pokazuje treść wpisaną wprost w strefie.
Wpis	Pokazuje wpis, stronÄ™ lub produkt WordPressa, wyrenderowany przez szablon.
Zagnieżdżony obszar roboczy	Otwiera kolejny obszar roboczy — przechodzenie między obrazami.
Odnośnik	Przenosi odwiedzającego pod wskazany adres.

7.1. Pusta

Strefa pusta nie wyświetla żadnej treści i nigdy nie otwiera okna. Użyj jej, żeby zachować narysowany kształt, zanim zdecydujesz, co ma robić, albo jako czysto wizualne wyróżnienie. Nadaj jej etykietę, a pokaże ją w dymku po najechaniu — to sposób na nazwanie miejsca na obrazie bez podpinania jakiejkolwiek akcji kliknięcia.

7.2. Tekst

Strefa typu tekst pokazuje treść wpisaną w pełnym edytorze WordPressa — z nagłówkami, pogrubieniami, listami, odnośnikami, obrazami i osadzonymi mediami. Przycisk powiększenia otwiera edytor w dużym oknie modalnym, żeby wygodnie się pisało. Shortcode’y WordPressa umieszczone w treści są przetwarzane przy wyświetlaniu, więc galerie i formularze też działają.

Domyślnie treść otwiera się w oknie; możesz to zmienić globalnie albo dla pojedynczej strefy (zobacz Wyświetlanie treści strefy).

7.3. Wpis

Strefa wpisu łączy klikalny obszar z istniejącą treścią WordPressa. W panelu strefy wybierasz:

• typ treÅ›ci (wpisy i strony w Free; dowolny publiczny typ, np. produkty WooCommerce, w Pro),
• powiÄ…zany wpis przez wyszukiwarkÄ™,
• szablon — albo zostawiasz „Użyj domyÅ›lnego dla obszaru roboczego”,
• czy odnoÅ›niki w treÅ›ci majÄ… otwierać siÄ™ w nowej karcie — każda strefa może tu nadpisać ustawienie globalne.

Odwiedzającym pokazywane są wyłącznie opublikowane wpisy. To, co widzą — tytuł, obraz, zajawkę, cenę i tak dalej — określa szablon (zobacz Szablony).

7.4. Zagnieżdżony obszar roboczy

Strefa typu zagnieżdżony obszar roboczy po kliknięciu otwiera kolejny obszar. Tak buduje się strukturę schodzenia w głąb:

• plan budynku → mieszkanie,
• plan obiektu → pomieszczenie,
• zdjÄ™cie ogólne → zdjÄ™cie detalu.

Cel wskazujesz wyszukiwarką obszarów; odnośnik Edytuj zagnieżdżony obszar roboczy przenosi wprost do edytora dziecka. Odwiedzający wracają okruszkami, strzałką powrotu albo obydwoma naraz — styl wybierasz w ustawieniach globalnych.

OdnoÅ›niki powrotne. Strefa zagnieżdżonego obszaru może też wskazywać dowolnego przodka bieżącego obszaru — na przykÅ‚ad strzaÅ‚kÄ™ „Powrót do osiedla” narysowanÄ… na rzucie mieszkania. WP InSpot wykrywa, że cel jest już w Å‚aÅ„cuchu nawigacji, i zamiast zapÄ™tlać zagnieżdżenia, cofa nawigacjÄ™ do tego poziomu: okruszki siÄ™ skracajÄ…, przycisk Wstecz przeglÄ…darki dziaÅ‚a dalej, a na telefonie nawigacja listy zwija siÄ™ tak samo. DziaÅ‚a to przez dowolnÄ… liczbÄ™ poziomów — strefa na poziomie 3. może wrócić prosto na poziom 1.

Gdy cel jest w koszu. Strefa zagnieżdżonego obszaru, której cel trafił do kosza, przestaje być pokazywana odwiedzającym — nikt nie zostaje wysłany w ślepy zaułek. W edytorze obszaru ta sama strefa pozostaje w pełni widoczna, więc możesz przepiąć ją na inny obszar albo usunąć. Jeśli strefa zniknęła z opublikowanego obrazu, ale nadal jest przy edycji, to właśnie dlatego: przywróć docelowy obszar roboczy albo przepnij strefę.

Miejsce na wideo: Przejście z obrazu głównego do zagnieżdżonego obszaru roboczego i powrót okruszkami

7.5. Odnośnik

Strefa typu odnośnik po kliknięciu przenosi odwiedzającego pod wskazany adres:

• adresy zewnÄ™trzne, np. https://example.com,
• Å›cieżki wewnÄ™trzne, np. /kontakt,
• kotwice na tej samej stronie, np. #sekcja.

Pole wyboru Otwórz w nowej karcie decyduje o celu; odnoÅ›niki otwierane w nowej karcie dostajÄ… zabezpieczajÄ…cy atrybut noopener.

8. Wyświetlanie treści strefy: okno, panel i modal

Strefy tekstowe i strefy wpisów mogą prezentować treść na trzy sposoby:

Tryb	Zachowanie
Okno	Małe okienko zaczepione przy strefie. Dobre do krótkich opisów.
Panel	Panel wysuwany od lewej lub prawej krawędzi. Dobry do dłuższych treści.
Modal	Wyśrodkowana nakładka na wierzchu strony. Dobra do bogatych treści i galerii.
Brak	Strefa pozostaje widoczna, ale nic nie otwiera.

Domyślny tryb dla każdego rodzaju treści ustawiasz w Ustawienia → Strefy → Wyświetlanie treści — osobno dla stref tekstowych i osobno dla stref wpisów (obie zaczynają od okna).

Każda strefa tekstowa i strefa wpisu może indywidualnie nadpisać domyÅ›lne ustawienie: w edytorze strefy jest pole Sposób wyÅ›wietlania treÅ›ci z opcjami „DomyÅ›lnie (ustawienie globalne)”, Okno, Panel, Modal i Brak. DziÄ™ki temu jeden interaktywny obraz może Å‚Ä…czyć krótkie podpisy w oknach z panelem na szczegółowe opisy pomieszczeÅ„.

8.1. Małe ekrany: panel dolny

Na ekranach węższych niż 576 px treść strefy otwiera się w mobilnym panelu dolnym, a nie w oknie, modalu czy panelu bocznym — pływające okienka są przy tej szerokości ciasne i niewygodne, a panel dolny to rozwiązanie, którego odwiedzający spodziewają się na telefonie. Odpowiada za to przełącznik Otwieraj treść w panelu dolnym na małych ekranach w Ustawienia → Strefy → Wyświetlanie treści, włączony domyślnie.

Ten próg jest celowo niezależny od mobilnego punktu przełamania układu: punkt przełamania decyduje, kiedy obraz zmienia się w widok listy, a to ustawienie decyduje, jak otwiera się treść. Możesz mieć pełny interaktywny obraz na małym tablecie, podczas gdy jego okna zachowują się już jak panele dolne.

Wygląd trzech nakładek desktopowych (kolory, rozmiary, motyw) konfigurujesz w Ustawienia → Nakładki.

9. Ikony znaczników

Strefy typu znacznik wyświetlają ikonę w punkcie na obrazie.

W panelu strefy możesz:

• wybrać ikonÄ™ z wbudowanej biblioteki — 160 ikon w szeÅ›ciu kategoriach tematycznych (pomieszczenia i przestrzenie, ogólne punkty zainteresowania, udogodnienia i media, budynek i konstrukcja, nawigacja i orientacja, zakupy i e-commerce), wszystkie jako ostre, hostowane lokalnie pliki SVG,
• ustawić rozmiar (8–128 px) i obrót (0–359°),
• przy wÅ‚asnych ikonach wÅ‚Ä…czyć Użyj koloru strefy, żeby ikona przejęła kolor strefy, także po najechaniu.

Ikony skalują się razem z powiększeniem obrazu, z dolną granicą czytelności, żeby nigdy nie skurczyły się poniżej granicy rozpoznawalności.

9.1. WÅ‚asne ikony SVG

Do biblioteki możesz wgrać własne ikony SVG. Przyjmowane są wyłącznie pliki SVG do 512 KB, a każdy plik jest przy wysyłce oczyszczany — skrypty, procedury obsługi zdarzeń i odwołania zewnętrzne są usuwane — więc biblioteka pozostaje bezpieczna.

Miejsce na zrzut ekranu: Okno wyboru ikony znacznika z wbudowaną biblioteką ikon i opcją dodania własnego pliku SVG

10. Szablony

Szablony decydują o tym, co pokazuje strefa wpisu: które pola powiązanego wpisu się pojawią i w jakiej kolejności. Zarządzasz nimi w WP InSpot → Szablony.

Lista pokazuje zapisane szablony z filtrem typu treści; możesz je dodawać, edytować i usuwać. Wersja Free obejmuje 1 zapisany szablon, Pro znosi limit.

10.1. Kreator szablonów

Kreator układa pola w trzech sekcjach — Nagłówek, Treść i Stopka. Przeciągasz pola do sekcji; dwa pola mogą dzielić jeden wiersz.

10.2. Dostępne pola

Standardowe pola WordPressa:

Pole	Pokazuje
Tytuł	Tytuł wpisu.
Treść	Pełną treść wpisu.
Zajawka	ZajawkÄ™ albo automatyczne streszczenie, gdy zajawki nie ustawiono.
Obrazek wyróżniający	Obrazek wyróżniający.
Czytaj dalej / Odnośnik bezpośredni	Odnośnik do wpisu.
Data publikacji	DatÄ™ publikacji.

Poza nimi kreator szablonów może użyć:

• pól ACF — gdy Advanced Custom Fields jest aktywne: tekst, obszar tekstowy, tekst sformatowany, obraz, galeria, URL, liczba, data, data z godzinÄ… oraz pola oEmbed/wideo,
• pól wÅ‚asnych — wartoÅ›ci zapisanych jako metadane wpisu,
• pól WooCommerce — dla produktów: plakietka dostÄ™pnoÅ›ci, przycisk Dodaj do koszyka i cena (z cenÄ… promocyjnÄ… pokazanÄ… obok przekreÅ›lonej ceny regularnej).

Pola ACF i WooCommerce pojawiajÄ… siÄ™ tylko wtedy, gdy te wtyczki sÄ… aktywne w Twojej witrynie.

10.3. Szablon domyślny

Gdy strefa wpisu nie ma wybranego szablonu, a obszar roboczy nie ma domyÅ›lnego, używany jest ukÅ‚ad wbudowany: obrazek wyróżniajÄ…cy, tytuÅ‚, zajawka i odnoÅ›nik „Czytaj dalej”.

11. Ustawienia obszaru roboczego

Każdy obszar roboczy ma w edytorze własny panel ustawień, obok pola publikacji.

11.1. Domyślny typ treści i domyślny szablon

Domyślny typ treści wstępnie wybiera typ dla nowych stref wpisów. Domyślny szablon obowiązuje w każdej strefie wpisu, która nie wskazuje własnego — to szybki sposób na utrzymanie jednego wyglądu w całym interaktywnym obrazie. Odnośnik Zarządzaj szablonami prowadzi do kreatora szablonów.

11.2. Mobilny punkt przełamania

Domyślnie obszar roboczy stosuje globalny mobilny punkt przełamania (zobacz Ustawienia globalne). Wybierz Własny, aby nadać temu obszarowi własny próg przełączenia (1–1280 px) — przy 1 px widok mobilny nie włączy się dla tego obszaru nigdy. Zagnieżdżone obszary zawsze dziedziczą punkt przełamania obszaru najwyższego poziomu, z którego zostały otwarte, więc układ nie zmieni się w trakcie schodzenia w głąb.

11.3. Tryb panoramy

Tryb panoramy jest przeznaczony dla obrazów znacznie szerszych niż ekran — odwiedzający przeciąga obraz, ma do dyspozycji powiększanie i pasek nawigacji.

Ustawienie	Znaczenie
Tryb panoramy	Włącza tryb. Dziedziczony przez wszystkie zagnieżdżone obszary.
Dopasuj do treści	Wysokość ramki dopasowuje się do każdego obrazu.
Stała wysokość	Ramka zachowuje ustaloną wysokość (100–2000 px), a obraz przewija się w środku.

W trybie stałej wysokości szeroki obraz wypełnia całą wysokość, a przesuwają się jego boki, zamiast tkwić w pasie z pustymi pasami u góry i u dołu; pełny ekran otwiera się wypełniony w całości. Oddalenie widoku, żeby zobaczyć cały obraz naraz, jest nadal dostępne.

11.4. Przejście między scenami (Pro)

Obszar roboczy może zdefiniować własną animację przejścia przy poruszaniu się między zagnieżdżonymi obszarami albo stosować ustawienie globalne:

Ustawienie	Opcje
Efekt	Ustawienie globalne, Brak, Przenikanie, Powiększenie, Rozmycie.
Czas trwania	100–2000 ms.
Intensywność	1–100 — siła efektu powiększenia/rozmycia.
Krzywa	Ease in-out, Ease out, Liniowa.
Stosuj przy	Schodzeniu w głąb (wejściu w zagnieżdżony obszar) i/lub nawigacji wstecz.

Osoby z systemowym ustawieniem „ograniczone animacje” nie zobaczÄ… tych animacji.

11.5. Duplikowanie, eksport i import

W panelu znajduje się też przycisk Duplikuj obszar roboczy oraz przyciski Eksportuj JSON / Importuj JSON (Pro) — zobacz Import i eksport.

12. Ustawienia globalne

WP InSpot → Ustawienia zbiera domyślne ustawienia dla całej witryny w trzech zakładkach: Strefy, Nakładki i Zachowanie. To wartości domyślne — poszczególne obszary robocze i strefy mogą nadpisać te ustawienia, które są dla nich istotne, co opisujemy w całej dokumentacji.

Miejsce na zrzut ekranu: Widok Ustawień WP InSpot z zakładkami Strefy, Nakładki i Zachowanie

12.1. Zakładka Strefy

Wygląd stref ustawia domyślne kolory dla każdego typu strefy — strefy tekstowe, wpisów, zagnieżdżonych obszarów i odnośników mają własny kolor obrysu, kolor wypełnienia, przezroczystość wypełnienia, grubość obrysu i przezroczystość obrysu, w stanie normalnym i po najechaniu. Domyślnie wtyczka używa czytelnej palety:

Typ	Kolor podstawowy	Kolor po najechaniu
Tekst	niebieski	ciemniejszy niebieski
Wpis	zielony	ciemniejszy zielony
Zagnieżdżony obszar roboczy	bursztynowy	ciemniejszy bursztynowy
Odnośnik	indygo	ciemniejsze indygo

z subtelnym wypełnieniem 20%, które po najechaniu rośnie do 45%.

Próbniki kolorów podpowiadajÄ… kolory jednym klikniÄ™ciem: pięć ostatnio używanych kolorów oraz paletÄ™ motywu witryny (programiÅ›ci mogÄ… jÄ… filtrować przez wp_inspot_picker_palette).

Kursor strefy zagnieżdżonej decyduje, w co zmienia siÄ™ kursor myszy nad strefÄ… prowadzÄ…cÄ… gÅ‚Ä™biej: Wskaźnik, DomyÅ›lny, Krzyżyk, PowiÄ™kszenie albo wÅ‚asna ikona „Wejdź”.

Wyświetlanie treści ustawia domyślny tryb okno/panel/modal/brak dla stref tekstowych i wpisów oraz zawiera przełącznik panelu dolnego na małych ekranach — zobacz Wyświetlanie treści strefy.

12.2. Zakładka Nakładki

Motyw nadaje styl wizualny każdemu oknu, panelowi i modalowi: Klasyczny (domyślnie), Jasny, Ciemny, Szkło lub Własny. Motywy inne niż Klasyczny są w Pro. Strona Ustawień pokazuje podgląd na żywo wybranego motywu, więc od razu widzisz zmianę stylu okna.

Warstwy podnoszą kolejność nakładania (z-index) okien, paneli i modali — przydatne, gdy przykrywa je przyklejony nagłówek motywu.

Wybór motywu Własny odsłania szczegółowe ustawienia:

Nakładka	Ustawienia
Okno	Tło, kolor tekstu, zaokrąglenie rogów, szerokość (200–600 px), odstępy wewnętrzne, cień.
Panel	Tło, kolor tekstu, strona (lewa/prawa), szerokość (240–600 px), odstępy wewnętrzne.
Modal	Tło, kolor tekstu, zaokrąglenie rogów, maksymalna szerokość (320–960 px), odstępy wewnętrzne, kolor i przezroczystość tła nakładki.

12.3. Zakładka Zachowanie

Interakcja decyduje o tym, jak odwiedzajÄ…cy otwierajÄ… strefy:

Ustawienie	Opcje i wartość domyślna
Wyzwalacz	Najechanie (kliknięcie przypina) — domyślnie — albo Tylko kliknięcie. Najechanie pokazuje podgląd treści, a kliknięcie ją przypina.
Wyzwalacz mobilny	Tylko kliknięcie (domyślnie) albo Tak jak na desktopie.
Otwieraj odnośniki wpisów w nowej karcie	Domyślnie włączone; każda strefa wpisu może to nadpisać.
Pokazuj dymek po najechaniu	Domyślnie włączone — pokazuje etykietę strefy przed jej otwarciem.
Pokazuj przycisk pełnego ekranu	Domyślnie włączone — dokłada przełącznik pełnego ekranu do każdego interaktywnego obrazu.
Promień znacznika	Rozmiar zwykłych okrągłych znaczników (4–40 px, domyślnie 10).

Przejścia między scenami (Pro) ustawiają domyślną animację między zagnieżdżonymi obszarami — efekt, czas trwania, intensywność, krzywą oraz to, czy odtwarza się przy schodzeniu w głąb i/lub przy powrocie. Poszczególne obszary mogą to nadpisać.

Zaawansowane zawiera:

• Mobilny punkt przeÅ‚amania — poniżej tej szerokoÅ›ci (domyÅ›lnie 768 px) obraz przeÅ‚Ä…cza siÄ™ w mobilny widok listy; obszary robocze mogÄ… to nadpisać,
• Odniesienie punktu przeÅ‚amania — do czego porównywana jest szerokość. Okno przeglÄ…darki porównuje jÄ… z szerokoÅ›ciÄ… okna — klasyczne zachowanie, którego wszyscy spodziewajÄ… siÄ™ po „mobilnym punkcie przeÅ‚amania”. Kontener porównuje jÄ… z elementem, w którym osadzono obraz: przydatne, gdy interaktywny obraz stoi w wÄ…skiej kolumnie bocznej lub siatce i powinien pokazywać widok listy nawet na desktopie,
• Styl nawigacji zagnieżdżonej — jak odwiedzajÄ…cy wracajÄ… z zagnieżdżonych obszarów: Okruszki, StrzaÅ‚ka powrotu albo Obydwa,
• Pokazuj okruszki na peÅ‚nym ekranie — utrzymuje nawigacjÄ™ powrotnÄ… jako pÅ‚ywajÄ…cy pasek w trybie peÅ‚noekranowym,
• Ukryj okruszki na telefonie — ukrywa Å›cieżkÄ™ okruszków na maÅ‚ych ekranach (poniżej 768 px), zarówno w treÅ›ci strony, jak i na peÅ‚nym ekranie. Przycisk Wstecz pozostaje widoczny, wiÄ™c nawigacja nigdy nie ginie — to ustawienie odzyskuje tylko miejsce w pionie.

Dane i odinstalowanie decyduje o tym, co dzieje się po usunięciu wtyczki — zobacz Twoje dane.

13. Osadzanie obszaru roboczego na stronie

13.1. Shortcode

[wp_inspot id="123"]

gdzie 123 to identyfikator obszaru roboczego. DokÅ‚adny shortcode wyÅ›wietla siÄ™ na pasku narzÄ™dzi edytora obszaru — kliknij, żeby go skopiować. Shortcode dziaÅ‚a w edytorze klasycznym, w bloku Shortcode i w każdym kreatorze stron, który renderuje shortcode’y WordPressa.

Przyjmuje też opcjonalny atrybut class, przydatny przy wÅ‚asnym CSS:

[wp_inspot id="123" class="my-plan"]

13.2. Blok Gutenberga

W edytorze bloków dodaj blok WP InSpot i wybierz obszar roboczy z listy. Blok renderuje ten sam interaktywny obraz co shortcode, a w wyszukiwarce bloków ma markową ikonę WP InSpot.

13.3. Widget Elementora (Pro)

Pro dokłada natywny widget Elementora: przeciągasz go do układu i wybierasz opublikowany obszar roboczy.

13.4. Inne kreatory stron

W kreatorach bez natywnej integracji użyj shortcode’a.

14. Co widzÄ… odwiedzajÄ…cy

WP InSpot renderuje Twój interaktywny obraz jako płynny, responsywny widok dopasowujący się do swojego kontenera. Skrypty i style wczytują się wyłącznie na stronach, które faktycznie zawierają obszar roboczy, a widok uruchamia się leniwie — ten położony niżej na stronie startuje tuż przed wejściem w pole widzenia.

Obszar roboczy w koszu nie renderuje się w ogóle. Shortcode, blok i widget Elementora nie wypisują dla niego żadnego kodu — nawet pustego kontenera — więc na stronie nie zostaje po nim pusta ramka. Dotyczy to wszystkich, łącznie z zalogowanymi redaktorami przeglądającymi stronę publiczną.

Dopóki obraz obszaru roboczego się pobiera, widok pokazuje w jego miejscu migoczący placeholder, więc to miejsce nigdy nie wygląda na puste ani zepsute przy wolnym łączu.

Treść stref jest podgrzewana w tle chwilę po pojawieniu się obrazu, więc otwarcie strefy zwykle od razu pokazuje treść, bez etapu ładowania — o tym, jak to działa i kiedy nie zadziała, mówi sekcja Uwagi o wydajności.

14.1. Na desktopie

• Najechanie na strefÄ™ podÅ›wietla jÄ… i — przy domyÅ›lnym wyzwalaczu — pokazuje podglÄ…d treÅ›ci; klikniÄ™cie przypina treść na staÅ‚e.
• Dymki pokazujÄ… etykiety stref przed otwarciem.
• Strefy odnoÅ›ników przenoszÄ… dalej, strefy zagnieżdżonych obszarów schodzÄ… w gÅ‚Ä…b z nawigacjÄ… okruszkowÄ… i powrotnÄ…, a strefy wpisów pobierajÄ… wpis i renderujÄ… go przez szablon.
• Przycisk peÅ‚nego ekranu rozwija obraz na caÅ‚y ekran.

14.2. Na telefonie

Poniżej mobilnego punktu przełamania interaktywny obraz zmienia się w widok listy przyjazny dotykowi — ale sam obraz pozostaje interaktywny:

• obraz staje siÄ™ nagłówkiem widoku, a każda strefa dostaje numerowany znacznik na zdjÄ™ciu odpowiadajÄ…cy numerowanym wierszom listy poniżej — dotkniÄ™cie znacznika i wiersza robi to samo,
• wiersze od razu pokazujÄ…, czym sÄ…: treÅ›ciÄ…, odnoÅ›nikiem zewnÄ™trznym (oznaczonym strzaÅ‚kÄ…) albo zagnieżdżonym obszarem z licznikiem stref,
• zagnieżdżone obszary rozwijajÄ… siÄ™ w miejscu jak akordeon: ich strefy czytajÄ… siÄ™ jako wciÄ™ty blok, otwarcie grupy zwija pozostaÅ‚e, a nagłówek otwartej grupy przykleja siÄ™ do góry podczas przewijania,
• treść stref tekstowych i wpisów otwiera siÄ™ w panelu dolnym, zamykanym przyciskiem, dotkniÄ™ciem tÅ‚a albo przeciÄ…gniÄ™ciem w dół,
• dotkniÄ™cie obrazu otwiera widok powiÄ™kszenia zachowujÄ…cy interaktywne znaczniki,
• strefy odnoÅ›ników zachowujÄ… siÄ™ jak zwykÅ‚e odnoÅ›niki,
• strefy puste (dekoracyjne) nie dostajÄ… znacznika i sÄ… wyszarzone na liÅ›cie.

Przycisk pełnego ekranu na telefonie otwiera obraz w lightboxie z tymi samymi dotykalnymi znacznikami. Zagnieżdżone obszary schodzą w głąb wewnątrz tego samego okna, treść otwiera się w panelu dolnym na wierzchu, a odnośniki powrotne cofają stos.

Pamiętaj, że panel dolny ma własny próg (576 px), niezależny od mobilnego punktu przełamania — zobacz Małe ekrany: panel dolny. Na urządzeniu mieszczącym się między tymi szerokościami odwiedzający dostaje pełny interaktywny obraz z treścią otwieraną jak panel dolny.

Miejsce na wideo: Ten sam obszar roboczy na desktopie i na telefonie, Å‚Ä…cznie z panelem dolnym na telefonie

14.3. Tryb panoramy

Przy włączonym trybie panoramy odwiedzający przeciąga szeroki obraz na boki, przybliża i oddala widok oraz może korzystać z ekranowego paska nawigacji ze strzałkami i przyciskami powiększenia. Widok jest ograniczony, więc nikt nie zgubi się poza obrazem.

15. Mierzenie zaangażowania w analityce

Które mieszkanie zbiera najwięcej kliknięć na Twoim rzucie? Czy odwiedzający faktycznie otwierają szczegóły pomieszczeń, czy tylko najeżdżają i wychodzą? WP InSpot odpowiada na te pytania w analityce, której już używasz — jest gotowy do GA4 od razu po instalacji.

Każda istotna interakcja z interaktywnym obrazem trafia do narzędzia analitycznego działającego na Twojej stronie. Wtyczka nigdy sama nie wczytuje Google i nie wysyła niczego z własnej inicjatywy:

• JeÅ›li obecne jest Google Analytics 4 (gtag), zdarzenia wysyÅ‚ane sÄ… przez gtag('event', …).
• W przeciwnym razie, jeÅ›li obecny jest kontener Google Tag Managera (dataLayer), zdarzenia trafiajÄ… do warstwy danych.
• Gdy nie ma żadnego z nich, nie dzieje siÄ™ nic — i nie kosztuje to nic pod wzglÄ™dem wydajnoÅ›ci.

Żadnych ustawień, kluczy API ani konfiguracji. Jeśli GA4 lub GTM jest zainstalowane w witrynie w dowolny sposób (Site Kit, opcja motywu, wtyczka do wstawiania skryptów, ręcznie wklejony fragment), zdarzenia WP InSpot zaczynają płynąć w chwili, gdy odwiedzający wejdzie w interakcję z interaktywnym obrazem.

Wymagania: WP InSpot 1.1.0 lub nowszy. Działa w planie darmowym.

15.1. Wykaz zdarzeń

Wszystkie zdarzenia wysyłane są z poniższymi nazwami i parametrami — do GA4 jako parametry zdarzenia, do GTM jako klucze warstwy danych. Puste parametry są pomijane.

Zdarzenie	Kiedy się wywołuje	Parametry
inspot_map_view	interaktywny obraz uruchamia się, wchodząc w pole widzenia (odsłona)	workspace_id, workspace_title
inspot_zone_click	kliknięcie strefy	workspace_id, zone_id, zone_label, zone_type, mode, link_url
inspot_overlay_open	otwarcie okna, panelu, modala albo mobilnego panelu dolnego	workspace_id, zone_id, zone_label, mode
inspot_drilldown	odwiedzający wchodzi w zagnieżdżony obszar roboczy	workspace_id, workspace_title, depth
inspot_nav_back	nawigacja przyciskiem powrotu lub okruszkami	workspace_id, workspace_title, depth
inspot_fullscreen_open	otwarcie trybu pełnoekranowego	workspace_id
inspot_fullscreen_close	zamknięcie trybu pełnoekranowego	workspace_id

Nazwy zdarzeÅ„ zachowujÄ… historycznÄ… pisowniÄ™ inspot_map_* dla ciÄ…gÅ‚oÅ›ci: zmiana nazw po cichu zepsuÅ‚aby każdy raport, pulpit i wyzwalacz GTM już na nich zbudowany. JÄ™zyk interfejsu przeszedÅ‚ z „mapy” na „obraz” w wersji 1.2.7; kontrakt analityczny celowo nie.

Szczegóły parametrów:

• workspace_id / workspace_title — obszar roboczy, na który patrzy odwiedzajÄ…cy.
• zone_id / zone_label — strefa, którÄ… klikniÄ™to albo której treść otwarto. Etykieta to tytuÅ‚ strefy z edytora.
• zone_type — typ strefy: link, child_image (zagnieżdżony obszar roboczy), strefa wpisu albo text.
• mode — co zrobiÅ‚o klikniÄ™cie: link, drill-down, popup, drawer, modal, bottom-sheet albo accordion (mobilny widok listy).
• link_url — adres docelowy, obecny wyÅ‚Ä…cznie przy klikniÄ™ciach stref typu odnoÅ›nik. To Twój licznik kliknięć wychodzÄ…cych.
• depth — poziom zagnieżdżenia po nawigacji (korzeÅ„ = 0), dziÄ™ki czemu zmierzysz, jak gÅ‚Ä™boko odwiedzajÄ…cy eksplorujÄ….

Najechania i zamknięcia nakładek celowo nie są przekazywane — w GA są szumem. Obydwa pozostają dostępne jako zdarzenia DOM na potrzeby własnych integracji (zobacz podsekcję dla programistów poniżej).

15.2. Szybki start z GA4 (gtag)

Nie ma czego konfigurować — zweryfikuj i zdecyduj, co się dla Ciebie liczy:

1. Sprawdź w DebugView. W GA4 otwórz Administracja → DebugView, a potem wejdź w interakcjÄ™ z interaktywnym obrazem na swojej stronie (z rozszerzeniem GA Debugger albo z ?gtm_debug=x dopisanym do adresu strony). Zdarzenia inspot_* pojawiÄ… siÄ™ w strumieniu w ciÄ…gu kilku sekund.
2. Zarejestruj zdarzenia kluczowe. W Administracja → Zdarzenia zdarzenia inspot_* pojawiajÄ… siÄ™ automatycznie po pierwszym ruchu. Oznacz te, które oznaczajÄ… dla Ciebie sukces — na przykÅ‚ad inspot_zone_click — jako zdarzenia kluczowe (konwersje).
3. Dodaj wymiary niestandardowe do raportów. W Administracja → Definicje niestandardowe zarejestruj parametry, wedÅ‚ug których chcesz ciąć raporty — zwykle zone_label, workspace_title i zone_type (zakres: zdarzenie). Od tej chwili zbudujesz raport kliknięć w podziale na strefy.

15.3. Szybki start z Google Tag Managerem

1. Wyzwalacz. Utwórz wyzwalacz Zdarzenie niestandardowe. Nazwa zdarzenia: inspot_.* z wÅ‚Ä…czonÄ… opcjÄ… „Użyj dopasowania wyrażeniem regularnym” — jeden wyzwalacz obsÅ‚uży każde zdarzenie WP InSpot. (Albo utwórz osobny wyzwalacz dla każdej nazwy, jeÅ›li chcesz wiÄ™kszej kontroli.)
2. Zmienne. Utwórz zmienne warstwy danych dla potrzebnych parametrów: zone_label, zone_type, workspace_title, link_url, depth, …
3. Tag. Utwórz tag Zdarzenie GA4, uruchamiany wyzwalaczem z kroku 1., ustaw NazwÄ™ zdarzenia na {{Event}} (przekazuje dalej nazwÄ™ inspot_*) i przypisz zmienne z kroku 2. jako parametry zdarzenia.
4. Przetestuj w trybie podglÄ…du, a potem opublikuj kontener.

15.4. Dowolne inne narzędzie analityczne (dla programistów)

Mostek GA opiera siÄ™ na publicznym API zdarzeÅ„ DOM. Każda interakcja wysyÅ‚a CustomEvent na kontenerze obrazu, które bÄ…belkuje do document, wiÄ™c możesz nakarmić Matomo, Plausible, Fathom albo wÅ‚asne zaplecze:

Zdarzenie DOM	Odpowiednik w GA
inspot:zoneClick	inspot_zone_click
inspot:zoneHover	— (tylko CustomEvent)
inspot:overlayOpen / inspot:overlayClose	inspot_overlay_open / —
inspot:workspaceEnter	inspot_map_view (poziom 0) / inspot_drilldown
inspot:workspaceBack	inspot_nav_back
inspot:fullscreenOpen / inspot:fullscreenClose	inspot_fullscreen_open / _close

Ładunek zdarzeÅ„ strefy (event.detail):

{
  zoneId: "106",            // id strefy
  label: "Sypialnia",       // tytuł strefy z edytora
  type: "child_image",      // typ strefy: link | child_image | text | entity…
  postId: 42,               // id powiązanego wpisu (strefy wpisów) albo null
  templateId: 3,            // użyty szablon (strefy wpisów) albo null
  linkUrl: null,            // adres docelowy (strefy odnośników) albo null
  workspaceId: "1119",      // obszar roboczy, do którego należy strefa
  mode: "drill-down"        // co zrobiła interakcja
}

Zdarzenia nawigacji (inspot:workspaceEnter / inspot:workspaceBack) niosÄ… { workspaceId, title, depth }; zdarzenia peÅ‚nego ekranu niosÄ… { workspaceId }.

Przykład — wysyłanie kliknięć stref do Plausible:

document.addEventListener("inspot:zoneClick", (e) => {
  plausible("Zone Click", {
    props: { zone: e.detail.label, workspace: e.detail.workspaceId },
  });
});

Przykład — Matomo:

document.addEventListener("inspot:zoneClick", (e) => {
  _paq.push(["trackEvent", "WP InSpot", "Zone Click", e.detail.label]);
});

Obiekt detail jest zamrożony (tylko do odczytu). Zdarzenia wywoÅ‚ujÄ… siÄ™ dla każdego interaktywnego obrazu na stronie; wystarczy jeden nasÅ‚uch na document, żeby objąć je wszystkie.

15.5. Wyłączanie mostka GA

Jeśli wolisz obsłużyć śledzenie samodzielnie (albo klient prosi o jego wyłączenie):

add_filter( 'wp_inspot_analytics', '__return_false' );

albo z poziomu JavaScriptu, zanim odwiedzajÄ…cy wejdzie w interakcjÄ™ z obrazem:

window.wpInSpotAnalytics = false;

Oba przeÅ‚Ä…czniki zatrzymujÄ… wyÅ‚Ä…cznie przekazywanie do GA4/GTM. Zdarzenia DOM inspot:* nadal siÄ™ wywoÅ‚ujÄ… — bez nasÅ‚uchu sÄ… bezczynne i nic nie kosztujÄ….

15.6. Prywatność i RODO

• Ładunki zdarzeÅ„ zawierajÄ… wyÅ‚Ä…cznie identyfikatory treÅ›ci — identyfikatory i tytuÅ‚y obszarów roboczych oraz stref. Å»adnych danych odwiedzajÄ…cych, odcisków palca, ciasteczek ani zapytaÅ„ do stron trzecich.
• WP InSpot nigdy sam nie kontaktuje siÄ™ z Google ani żadnym punktem koÅ„cowym analityki. Zdarzenia trafiajÄ… wyÅ‚Ä…cznie do narzÄ™dzia zainstalowanego przez wÅ‚aÅ›ciciela witryny — obsÅ‚uga zgód zostaje tam, gdzie jej miejsce, czyli w konfiguracji zgód tego narzÄ™dzia (menedżer zgód blokujÄ…cy gtag/GTM automatycznie blokuje też te zdarzenia, bo bez gtag i dataLayer wtyczka nie wysyÅ‚a nic).
• WP InSpot nie przechowuje niczego o odwiedzajÄ…cych, wiÄ™c ta funkcja nie dokÅ‚ada do Twojej polityki prywatnoÅ›ci nic ponad to, czego i tak wymaga Twoje narzÄ™dzie analityczne.

15.7. Analityka — najczęstsze pytania

Czy muszę coś skonfigurować w WP InSpot? Nie. Jeśli GA4 lub GTM jest obecne na stronie, zdarzenia płyną automatycznie. Nie ma dla tego ekranu ustawień — z założenia.

Czy dziaÅ‚a z menedżerami zgód (Cookiebot, Complianz, …)? Tak, automatycznie. Do czasu wyrażenia zgody menedżer wstrzymuje gtag/dataLayer, wiÄ™c WP InSpot nie ma dokÄ…d wysÅ‚ać zdarzeÅ„. Po zgodzie zdarzenia pÅ‚ynÄ…. Wtyczka sprawdza kanaÅ‚ transportu w momencie każdego zdarzenia, a nie przy wczytaniu strony.

Czy mogÄ™ Å›ledzić, które strefy zbierajÄ… najwiÄ™cej kliknięć? Tak — dokÅ‚adnie do tego sÅ‚uży inspot_zone_click z parametrem zone_label. Zarejestruj zone_label jako wymiar niestandardowy w GA4 i zbuduj raport pogrupowany po nim.

Czy to spowalnia stronę? Nie. Mostek to kilka nasłuchów zdarzeń; gdy nie ma żadnej analityki, interakcja kończy się jednym pominiętym wywołaniem funkcji.

16. Dostępność

Interaktywne obrazy WP InSpot da się obsłużyć bez myszy i są przyjazne technologiom wspomagającym:

• odnoÅ›nik pomijajÄ…cy pozwala osobom korzystajÄ…cym z klawiatury przeskoczyć obraz,
• obraz przedstawia siÄ™ czytnikom ekranu i zgÅ‚asza im zmiany swojego stanu,
• obraz jest pojedynczym przystankiem tabulatora; strzaÅ‚ki przenoszÄ… miÄ™dzy strefami, Enter i spacja je otwierajÄ…,
• puste strefy sÄ… ukryte przed technologiami wspomagajÄ…cymi,
• okna, panele i modale zachowujÄ… siÄ™ jak prawidÅ‚owe okna dialogowe — fokus wchodzi do Å›rodka, zostaje w nim uwiÄ™ziony i po zamkniÄ™ciu wraca na strefÄ™,
• efekty stref zatrzymujÄ… siÄ™, gdy strefa jest najechana lub ma fokus klawiatury, wiÄ™c ruch nie konkuruje z czytaniem,
• przy systemowym ustawieniu „ograniczone animacje” przejÅ›cia miÄ™dzy scenami i efekty stref sÄ… wyÅ‚Ä…czone.

Co możesz zrobić jako autor: nadaj czytelną etykietę każdej aktywnej strefie, unikaj treści okien złożonych wyłącznie z obrazu, sprawdź kontrast kolorów stref na tle obrazu i dodaj krótką instrukcję nad bardzo złożonymi obrazami.

17. Import i eksport (Pro)

17.1. Eksport

Eksportuj JSON w panelu ustawień obszaru roboczego pobiera obszar jako plik JSON: tytuł, obrazy (z identyfikatorami i adresami załączników) oraz każdą strefę z jej kształtem, współrzędnymi, typem, treścią i stylowaniem.

17.2. Import

Importuj JSON dokłada strefy z pliku do docelowego obszaru roboczego:

• jeÅ›li docelowy obszar nie ma obrazu, importer odnajduje zaÅ‚Ä…cznik po identyfikatorze albo po adresie URL,
• strefy, których obrazu nie da siÄ™ odnaleźć, sÄ… pomijane,
• odwoÅ‚ania do wpisów, szablonów i obszarów podrzÄ™dnych zostajÄ… zachowane tylko wtedy, gdy te obiekty istniejÄ… w docelowej witrynie,
• po zakoÅ„czeniu importer raportuje, ile stref zaimportowano, a ile pominiÄ™to.

17.3. Przenoszenie między witrynami

Eksport przenosi strukturę stref, a nie całe środowisko. Przed importem w innej witrynie upewnij się, że obrazy są w jej Bibliotece mediów, a wskazywane wpisy, szablony i obszary podrzędne również tam istnieją — czego brakuje, zostanie po prostu pominięte i można to potem podpiąć ręcznie.

18. Witryny wielojęzyczne (WPML / Polylang)

Obszary robocze są treścią przetłumaczalną: rozpoznają je zarówno WPML, jak i Polylang. Gdy strona osadza obszar roboczy, wtyczka automatycznie ustala właściwą wersję językową tego obszaru dla bieżącego języka odwiedzającego — możesz zostawić jeden shortcode i tłumaczyć obszar tak jak każdą inną treść.

W witrynach wielojęzycznych lista obszarów roboczych w kokpicie pokazuje też flagę języka przy każdym obszarze i dokłada filtr języka nad listą, więc szybko odnajdziesz potrzebną wersję.

Sam interfejs wtyczki jest w peÅ‚ni przetÅ‚umaczony na polski, a dziÄ™ki doÅ‚Ä…czonemu szablonowi .pot da siÄ™ go przetÅ‚umaczyć na dowolny inny jÄ™zyk.

19. Integracja z WP InEstate

WP InSpot integruje się z wtyczką WP InEstate dla nieruchomości: eksport i import WP InEstate może przenosić obszary robocze WP InSpot razem z danymi ofert, a eksporter automatycznie dołącza zagnieżdżone obszary połączone z wybranymi. Nie trzeba niczego konfigurować — integracja włącza się, gdy obie wtyczki są obecne.

20. Twoje dane

• WyÅ‚Ä…czenie wtyczki nie zmienia niczego — wszystkie obszary robocze, strefy i ustawienia zostajÄ… na miejscu.
• UsuniÄ™cie wtyczki również domyÅ›lnie zachowuje Twoje dane.
• JeÅ›li chcesz odinstalować jÄ… do czysta, wÅ‚Ä…cz najpierw opcje w Ustawienia → Zachowanie → Dane i odinstalowanie: jedna usuwa tabele wtyczki, ustawienia i wgrane ikony, druga kasuje dodatkowo wszystkie wpisy obszarów roboczych. Obie sÄ… domyÅ›lnie wyÅ‚Ä…czone i dziaÅ‚ajÄ… dopiero przy usuwaniu wtyczki.

Przeniesienie obszaru roboczego do kosza natychmiast zdejmuje go ze strony: każda strona, która go osadza, przestaje go wyświetlać, bez konieczności edytowania tych stron. Przywrócenie obszaru z zakładki Kosz sprawia, że wraca dokładnie na te same strony. Kosz jest odwracalny — nic z obszaru nie ginie, dopóki tam leży.

Trwałe usunięcie pojedynczego obszaru roboczego z kosza kasuje też jego strefy i wpisy o obrazach, więc w bazie nie gromadzą się osierocone wiersze.

21. Typowe scenariusze użycia

21.1. Rzut mieszkania lub budynku

1. Utwórz obszar roboczy z rzutem.
2. Narysuj strefy dla pomieszczeń.
3. Użyj stref tekstowych lub stref wpisów do szczegółów pomieszczeń.
4. Użyj stref zagnieżdżonych obszarów do widoków poszczególnych pomieszczeń lub pięter.
5. Osadź obszar roboczy na stronie oferty.

21.2. Interaktywne zdjęcie produktu

1. Dodaj zdjęcie produktu jako obraz obszaru roboczego.
2. Oznacz cechy znacznikami.
3. Użyj stref tekstowych lub odnośników do opisów.
4. Przy WooCommerce użyj stref wpisów z szablonem produktu — z ceną i przyciskiem Dodaj do koszyka.

21.3. Plan atrakcji lub obiektu

1. Dodaj plan obiektu.
2. Utwórz znaczniki dla punktów zainteresowania.
3. Użyj stref tekstowych do krótkich opisów, a stref wpisów z szablonem do rozbudowanych.
4. Użyj stref zagnieżdżonych obszarów, żeby wchodzić do budynków lub stref terenu.

21.4. Wystawa muzealna lub edukacyjna

1. Dodaj zdjęcie sali, eksponatu albo schemat.
2. Oznacz strefami interesujÄ…ce elementy.
3. Użyj Tekstu do podpisów albo Wpisu do pełnych artykułów.
4. Nadaj każdej strefie czytelną etykietę i sprawdź kontrast stref — zobacz Dostępność.

22. Rozwiązywanie problemów

22.1. Obszar roboczy nie pojawia siÄ™ na stronie

Sprawdź, czy:

• obszaru roboczego nie ma w koszu — obszar w koszu celowo nie renderuje siÄ™ nigdzie, a przywrócenie go z zakÅ‚adki Kosz od razu go przywraca,
• shortcode ma poprawny identyfikator,
• obszar roboczy jest opublikowany,
• obszar roboczy ma przypisany obraz,
• na stronie nie ma konfliktu JavaScriptu,
• pamięć podrÄ™czna strony nie serwuje starej wersji.

22.2. Strefy nie sÄ… widoczne

Sprawdź, czy:

• strefy zostaÅ‚y zapisane,
• kolory i przezroczystoÅ›ci nie czyniÄ… stref niewidocznymi na tle obrazu,
• obrazu nie podmieniono na inny o bardzo różnych proporcjach,
• strefa nie jest strefÄ… pustÄ… bez widocznego stylu.

22.3. Strefa zniknęła z mojego obrazu

Strefa zagnieżdżonego obszaru przestaje być renderowana odwiedzającym, gdy obszar, na który wskazuje, trafił do kosza — wtyczka ją ukrywa, zamiast wysyłać ludzi w ślepy zaułek. Sama strefa nie przepadła: otwórz obszar roboczy w edytorze, a nadal tam jest, dokładnie w miejscu, w którym ją narysowałeś.

Dwa wyjścia: przywróć docelowy obszar roboczy z WP InSpot → Obszary robocze → Kosz albo otwórz strefę i wskaż inny obszar (lub usuń ją, jeśli nie jest już potrzebna).

22.4. Strefa wpisu nie pokazuje danych

Sprawdź, czy:

• powiÄ…zany wpis lub strona sÄ… opublikowane,
• strefa wskazuje istniejÄ…cy wpis,
• szablon nie skÅ‚ada siÄ™ wyÅ‚Ä…cznie z pól, dla których wpis nie ma wartoÅ›ci.

22.5. Odnośnik nie działa

Sprawdź, czy:

• adres jest kompletny (odnoÅ›niki zewnÄ™trzne wymagajÄ… https://…),
• Å›cieżka wewnÄ™trzna zaczyna siÄ™ od /,
• opcja nowej karty jest ustawiona zgodnie z zamiarem.

22.6. Import pomija strefy

Importer pomija strefy, których obraz, wpis, szablon albo obszar podrzędny nie istnieją w docelowej witrynie. Dodaj brakujące media lub treści i uruchom import ponownie.

22.7. Nie da się utworzyć kolejnego obszaru roboczego

Wersja Free pozwala na 3 obszary robocze (opublikowane plus szkice). Przenieś niepotrzebne do kosza albo przejdź na Pro, żeby mieć ich bez ograniczeń. Pamiętaj, że obszary w koszu nie liczą się już do limitu i możesz je później przywrócić z zakładki Kosz.

22.8. Efekt strefy siÄ™ nie animuje

Twój plan nie jest przyczynÄ…: efekty stref dziaÅ‚ajÄ… w każdym planie, Å‚Ä…cznie z Free. Z zaÅ‚ożenia zatrzymujÄ… siÄ™, gdy strefa jest najechana albo ma fokus klawiatury, a dla osób z wÅ‚Ä…czonym systemowym ustawieniem „ograniczone animacje” sÄ… wyÅ‚Ä…czone caÅ‚kowicie — sprawdź to ustawienie na urzÄ…dzeniu, na którym testujesz. PamiÄ™taj też, że strefy typu etykieta tekstowa nie obsÅ‚ugujÄ… efektów.

22.9. Treść otwiera się w panelu dolnym zamiast w oknie

To zachowanie przewidziane dla małych ekranów: poniżej 576 px treść strefy celowo otwiera się w panelu dolnym. Wyłącz Otwieraj treść w panelu dolnym na małych ekranach w Ustawienia → Strefy → Wyświetlanie treści, jeśli chcesz mieć okna przy każdej szerokości. Ten próg jest niezależny od mobilnego punktu przełamania, więc wąskie okno przeglądarki może go wyzwolić, gdy obraz jest jeszcze w układzie desktopowym.

22.10. Obszar roboczy zniknÄ…Å‚ z listy

Zajrzyj do zakładki Kosz — mógł zostać przeniesiony do kosza, a nie usunięty, a Przywróć wraca go jako szkic. Jeśli to był obszar zagnieżdżony, którego rodzic trafił do kosza, poszukaj go na najwyższym poziomie listy: dzieci rodzica z kosza awansują do korzenia, żeby pozostały dostępne.

22.11. Treść strefy nadal pokazuje krótkie „Ładowanie…”

Treść jest normalnie podgrzewana w tle, więc powinno się to zdarzać rzadko. Jest to spodziewane w tych przypadkach:

• odwiedzajÄ…cy otworzyÅ‚ strefÄ™ w pierwszej chwili wczytywania strony, zanim podgrzewanie zdążyÅ‚o siÄ™ skoÅ„czyć,
• obraz ma ponad 20 stref wpisów — pakiet obejmuje pierwsze 20, reszta wczytuje siÄ™ na żądanie,
• przeglÄ…darka odwiedzajÄ…cego ma wÅ‚Ä…czony oszczÄ™dzanie danych, które z zaÅ‚ożenia wyÅ‚Ä…cza wszelkie wstÄ™pne pobieranie,
• patrzysz na podglÄ…d w edytorze, który celowo nigdy nie pobiera z wyprzedzeniem, żeby zawsze pokazywać aktualne, niezapisane dane.

JeÅ›li zdarza siÄ™ to stale poza tymi przypadkami, zwykÅ‚Ä… przyczynÄ… jest wolna odpowiedź serwera na admin-ajax.php — sprawdź to testem konfliktu wtyczek albo wydajnoÅ›ciÄ… PHP u swojego hostingodawcy, bo praca samej wtyczki to tylko niewielka część tego żądania.

22.12. Zdarzenia analityczne nie pojawiajÄ… siÄ™ w GA4

Sprawdź podstawy po kolei: (1) czy gtag albo dataLayer faktycznie sÄ… obecne na stronie z obrazem (podejrzyj źródÅ‚o strony)? (2) czy sam obraz dziaÅ‚a? (3) otwórz DebugView i wejdź w interakcjÄ™ z obrazem — standardowe raporty GA4 majÄ… opóźnienie 24–48 h, DebugView dziaÅ‚a na żywo. JeÅ›li witryna wczytuje GA przez menedżera zgód, najpierw zaakceptuj zgodÄ™. PeÅ‚ny wykaz zdarzeÅ„ znajdziesz w sekcji o analityce.

23. Dobre praktyki redakcyjne

23.1. Nazywanie obszarów roboczych

Nazywaj obszary robocze tak, żeby Å‚atwo je byÅ‚o odnaleźć w wyszukiwarkach i okruszkach, np. „Budynek A — piÄ™tro 2″ zamiast „plan2″. W witrynach wielojÄ™zycznych dołóż kontekst odróżniajÄ…cy tÅ‚umaczenia.

23.2. Nazywanie stref

Etykiety stref widzÄ… odwiedzajÄ…cy: pojawiajÄ… siÄ™ w dymkach, na liÅ›cie mobilnej i w komunikatach czytników ekranu. „Kuchnia — 12,5 m²” mówi odwiedzajÄ…cemu znacznie wiÄ™cej niż „strefa 7″.

23.3. Wybór typu strefy

• Krótki podpis → strefa tekstowa z oknem.
• DÅ‚uższy opis → strefa tekstowa z panelem albo modalem.
• Treść, która już istnieje jako wpis/strona/produkt → strefa wpisu.
• Nawigacja „w gÅ‚Ä…b” → zagnieżdżony obszar roboczy.
• Cokolwiek, co żyje na innej stronie → odnoÅ›nik.

23.4. Praca z obrazami

• Używaj obrazów przygotowanych pod internet; bardzo duże pliki spowalniajÄ… odwiedzajÄ…cych na telefonach.
• Przy podmianie obrazu zachowuj proporcje — strefy zachowujÄ… współrzÄ™dne, wiÄ™c mocno inne kadrowanie wizualnie je przesuwa.
• Przy panoramach wybieraj szerokie, równomiernie oÅ›wietlone zdjÄ™cia.

24. Lista kontrolna przed publikacjÄ…

Przed opublikowaniem strony z obszarem roboczym przejdź przez:

• Obszar roboczy jest opublikowany i ma obraz.
• Wszystkie aktywne strefy majÄ… czytelne etykiety i zamierzony typ.
• Strefy wpisów wskazujÄ… opublikowane treÅ›ci, a szablony pokazujÄ… pola, których oczekujesz.
• Kolory stref sÄ… widoczne na tle obrazu.
• Interaktywny obraz dziaÅ‚a na desktopie i na telefonie, Å‚Ä…cznie z obsÅ‚ugÄ… klawiatury.
• Z zagnieżdżonych obszarów da siÄ™ wrócić, a odnoÅ›niki prowadzÄ… tam, gdzie trzeba.
• PeÅ‚ny ekran dziaÅ‚a, jeÅ›li jest wÅ‚Ä…czony.
• Pamięć podrÄ™czna strony zostaÅ‚a odÅ›wieżona po zmianach.
• JeÅ›li witryna korzysta z GA4 lub Google Tag Managera, wejdź w interakcjÄ™ z obrazem i potwierdź, że zdarzenia inspot_* docierajÄ… (DebugView w GA4 pokazuje je na żywo; standardowe raporty majÄ… dzień–dwa opóźnienia).

25. Informacje techniczne

Informacje dla administratorów i programistów. Zwykli użytkownicy mogą spokojnie pominąć tę sekcję.

25.1. Wymagania i biblioteki

WordPress 5.9+, PHP 8.0+. Widok frontendowy opiera się na Leaflet, rysowanie stref w kokpicie na Leaflet-Geoman, wbudowane ikony znaczników pochodzą z Material Symbols, a licencjonowanie działa na SDK Freemius (2.13.4). Wszystkie zasoby serwowane są lokalnie z wtyczki — bez odwołań do CDN.

25.2. Przechowywanie danych

Obszary robocze to własny typ treści:

inspot_workspace

(nieodpytywalny publicznie, bez archiwum i przepisywania adresów, hierarchiczny, dostępny w REST, widoczny w kokpicie). Dane stref i szablonów żyją w dedykowanych tabelach z Twoim prefiksem WordPressa:

Tabela	Przeznaczenie
{prefix}inspot_images	Obrazy przypisane do obszarów roboczych.
{prefix}inspot_polygons	Strefy narysowane na obrazach.
{prefix}inspot_templates	Szablony prezentacji wpisów.
{prefix}inspot_icon_library	WÅ‚asne ikony SVG.

Ustawienia przechowywane sÄ… w opcji wp_inspot_settings, a wersja schematu w wp_inspot_schema_version. Tabele powstajÄ… przy wÅ‚Ä…czeniu wtyczki i sÄ… automatycznie migrowane przy aktualizacjach.

25.3. Powierzchnia osadzania

Shortcode to [wp_inspot id="123"] (opcjonalny atrybut class); blok Gutenberga to wp-inspot/map (renderowany po stronie serwera). Widget Elementora rejestruje siÄ™ tylko wtedy, gdy pozwala na to licencja Pro.

Punkt koÅ„cowy danych stref (inspot_get_workspace_data) przyjmuje opcjonalny parametr context. Przy context=editor zwraca edytorski widok obszaru roboczego, czyli zachowuje strefy zagnieżdżonych obszarów, których cel jest w koszu albo już nie istnieje, żeby daÅ‚o siÄ™ je naprawić; każda inna wartość, w tym brak parametru, zwraca widok odwiedzajÄ…cego, w którym takie strefy sÄ… pomijane. Parametr wyraża wyÅ‚Ä…cznie intencjÄ™ — jest Å‚Ä…czony z uprawnieniem do edycji, wiÄ™c poproszenie o widok edytorski bez tego uprawnienia po cichu daje widok odwiedzajÄ…cego. Może wyÅ‚Ä…cznie zawÄ™zić to, co widzi wywoÅ‚ujÄ…cy, nigdy poszerzyć.

WewnÄ™trzne identyfikatory — nazwa bloku wp-inspot/map, prefiks klas CSS wp-inspot-map* i zdarzenia analityczne inspot_map_* — celowo zachowujÄ… pierwotne sÅ‚ownictwo wtyczki oparte na „mapie”. Zmiana nazw zepsuÅ‚aby wÅ‚asny CSS, zapisane bloki i istniejÄ…ce raporty analityczne; w 1.2.7 zmieniÅ‚ siÄ™ wyÅ‚Ä…cznie jÄ™zyk interfejsu widoczny dla czÅ‚owieka.

25.4. Model bezpieczeństwa

• Każda operacja w kokpicie wymaga nonce’a WordPressa i odpowiedniego uprawnienia — edycja stref wymaga prawa do edycji danego obszaru roboczego, a ustawienia praw administratora.
• Frontendowe punkty koÅ„cowe danych publicznie serwujÄ… wyÅ‚Ä…cznie opublikowane obszary robocze; szkice widzÄ… tylko osoby mogÄ…ce je edytować (na tym opiera siÄ™ podglÄ…d w edytorze).
• Wszystkie dane stref sÄ… walidowane po stronie serwera (identyfikatory, typy ksztaÅ‚tów i stref, współrzÄ™dne, kolory, przezroczystoÅ›ci, adresy URL); treść tekstowa przechodzi przez wp_kses_post, a adresy przez esc_url_raw.
• Wgrywane ikony SVG sÄ… oczyszczane: skrypty, procedury obsÅ‚ugi zdarzeÅ„, elementy style/foreignObject i odwoÅ‚ania zewnÄ™trzne sÄ… usuwane, a katalog ikon blokuje wykonywanie PHP.

25.5. Uwagi o wydajności

Zasoby frontendowe Å‚adujÄ… siÄ™ wyÅ‚Ä…cznie na stronach zawierajÄ…cych obszar roboczy, a interaktywne obrazy inicjujÄ… siÄ™ przez IntersectionObserver (z wariantem zapasowym), wiÄ™c te poniżej pierwszego ekranu nie kosztujÄ… nic na starcie.

Poza tym o natychmiastowość widoku dba kilka warstw:

• Pierwsza porcja danych w HTML. Dla anonimowych odwiedzajÄ…cych i opublikowanego obszaru roboczego dane obszaru sÄ… osadzone wprost w kodzie strony, wiÄ™c pierwsze renderowanie nie potrzebuje żadnego zapytania AJAX. Zalogowani, którzy mogÄ… edytować obszar, nadal pobierajÄ… dane normalnie, żeby szkice i niezapisane zmiany nigdy nie trafiÅ‚y na stronÄ™ z pamiÄ™ci podrÄ™cznej.
• Pakietowe pobieranie wpisów z wyprzedzeniem. ChwilÄ™ po zbudowaniu widoku wtyczka podgrzewa treść stojÄ…cÄ… za jego strefami wpisów jednym żądaniem obejmujÄ…cym do 20 stref, zamiast osobnego żądania na strefÄ™. Znaczy to wiÄ™cej, niż brzmi: wiÄ™kszość kosztu wywoÅ‚ania AJAX w WordPressie to start frameworka, a nie zapytanie do bazy, wiÄ™c zwiniÄ™cie dwudziestu startów w jeden to różnica miÄ™dzy kilkusekundowym rozgrzewaniem a uÅ‚amkiem sekundy na typowym hostingu współdzielonym.
• Pobieranie zagnieżdżonych obszarów w czasie bezczynnoÅ›ci. Dane zagnieżdżonych obszarów i ich pierwszych obrazów sÄ… podgrzewane w czasie bezczynnoÅ›ci przeglÄ…darki, po kilka żądaÅ„ naraz, żeby wÄ™zeÅ‚ z dziesiÄ…tkami stref podrzÄ™dnych nie zalaÅ‚ serwera. Pakietowanie wpisów i podgrzewanie zagnieżdżonych obszarów dziaÅ‚ajÄ… równolegle, wiÄ™c żadne nie czeka na drugie.
• Pobieranie na podstawie zamiaru. Najechanie lub dotkniÄ™cie strefy podgrzewa dokÅ‚adnie jej dane, zanim padnie klikniÄ™cie.
• Bez migotania Å‚adowania. Gdy treść strefy jest już w pamiÄ™ci podrÄ™cznej, renderuje siÄ™ w tej samej klatce, w której strefa siÄ™ otwiera — okno, panel czy mobilny panel dolny nigdy nie pokazuje stanu Å‚adowania dla treÅ›ci, którÄ… już ma.
• Pamięć podrÄ™czna sesji i scalanie żądaÅ„. Ponownie odwiedzane widoki serwowane sÄ… z pamiÄ™ci, a wyÅ›cig pobierania z wyprzedzeniem i klikniÄ™cia koÅ„czy siÄ™ jednym żądaniem zamiast dwóch.
• Pakietowe odczyty. Wpisy, do których odwoÅ‚ujÄ… siÄ™ strefy wpisów, sÄ… przygotowywane jednÄ… paczkÄ… zapytaÅ„, co eliminuje problem N+1 przy obrazach z dużą liczbÄ… stref.
• Higiena mediów. Wideo i audio w treÅ›ci stref nie sÄ… pobierane od nowa przy każdym najechaniu na strefÄ™.

Całe powyższe pobieranie z wyprzedzeniem jest w ogóle pomijane przy włączonym w przeglądarce oszczędzaniu danych, a podgrzewanie obrazów dodatkowo przy łączach klasy 2G.

25.6. Haki WP InEstate

Integracja opiera się na filtrach i jest bezpieczna także bez WP InEstate:

Filtr	Rola
inestate_export_inspot_workspaces	Eksportuje wybrane obszary robocze do formatu eksportu WP InEstate.
inestate_import_inspot_workspaces	Importuje obszary robocze z danych importu WP InEstate.
inestate_get_inspot_workspace_tree	Dostarcza drzewo obszarów roboczych do interfejsu eksportu.

25.7. Filtry dla programistów

Filtr	Rola
wp_inspot_analytics	Zwróć false, aby wyłączyć przekazywanie do GA4/GTM; zdarzenia DOM inspot:* nadal się wywołują.
wp_inspot_picker_palette	Dostosowuje próbki kolorów motywu proponowane w próbnikach kolorów stref.