niech claude code doda live chat do twojej strony

21 października 2026 · pisze kuba · 6 min czytania

Claude Code wrzuci live chat na twoją stronę w jednej sesji: doda snippet do layoutu, przeczyta twoje kolory i fonty, żeby ostylować widżet, i da ci dwa linki, które musi kliknąć człowiek. Z tego poradnika dowiesz się, jak to ustawić, jaki prompt wkleić, co agentowi wolno, a czego nie, i jak sprawdzić jego robotę.

co robi agent, a co zostaje po twojej stronie

Spookat jest zbudowany tak, żeby agent od kodu mógł zrobić cały setup. Manual to jeden plik pisany dla agentów, llms.txt, a do tego jest zdalny serwer MCP z narzędziami na wszystko, czego setup potrzebuje.

Agent robi klepanie:

znajduje wspólny layout i dodaje jeden tag script
czyta kolory i fonty strony i ustawia styl widżetu, akcent, font, pozycję i powitanie
mówi ci dokładnie, co zrobił i co zostało

Człowiek robi dwie rzeczy, które nigdy nie powinny dziać się same:

podłączenie Slacka albo Discorda. connect_chat zwraca link dla tego, kto może dodawać aplikacje w twoim workspace’ie. Ta osoba zatwierdza to w Slacku albo Discordzie.
płatność. change_plan zwraca link do checkoutu. Agenci nigdy nie płacą i nie anulują.

Wygląd agent publikuje sam: publish wrzuca go na żywo, bez zatwierdzania. Każda zmiana, którą robi agent, pojawia się w logu aktywności strony w dashboardzie i tam możesz cofnąć publikację.

krok 1: podepnij claude code do spookat

W terminalu projektu:

claude mcp add --transport http spookat https://api.spookat.com/mcp

Klucz nie jest potrzebny. Za pierwszym razem, gdy Claude Code użyje narzędzia Spookat, otworzy się karta w przeglądarce: logujesz się, zaznaczasz strony, których może używać, i wybierasz, co mu wolno. Jeśli wolisz klucz, zrób go w dashboardzie w install, secret keys, i przekaż jako nagłówek:

claude mcp add --transport http spookat https://api.spookat.com/mcp --header "Authorization: Bearer sk_live_…"

Klucze zaczynają się od sk_live_, należą do jednej strony i widać je tylko raz. Trzymaj je poza repo.

nie masz jeszcze konta w spookat

Nie potrzebujesz go na start. Agent może sam zarejestrować stronę: jeden request z twoją domeną daje snippet i link do przejęcia strony dla ciebie, a jeszcze jeden daje klucz tylko do setupu. Protokół jest w auth.md, a agent czyta go sam, kiedy manual go tam odeśle.

Klucz tylko do setupu może stylować widżet, publikować wygląd i odczytać snippet. Nie może podłączać kanału, dotykać płatności ani czytać czatów. To czeka, aż przejmiesz stronę.

krok 2: wklej prompt

Add Spookat chat to my site. Read https://spookat.com/llms.txt first, then match the chat style to my site.

To cały prompt. Reszta jest w manualu. Jeśli chcesz go pokierować, dopisz linijkę: styl, który lubisz, powitanie albo stronę, po której ma siedzieć launcher.

Tak wygląda typowy przebieg:

Czyta llms.txt, potem sprawdza, czy narzędzia Spookat odpowiadają. Jeśli jesteś zalogowany, woła get_config i widzi twoją stronę. Jeśli nie, rejestruje stronę.
Pyta cię o prawdziwą domenę, jeśli nie znajdzie jej w projekcie. Nigdy jej nie zgaduje i nigdy nie zgaduje klucza.
Znajduje layout wspólny dla wszystkich stron i dodaje tag przed </body>:

<script src="https://cdn.spookat.com/s/YOUR_SITE_KEY.js" async></script>

Przegląda twój CSS, wybiera jeden z 8 stylów, ustawia kolor marki jako akcent i font, który pasuje. Może użyć fontu systemowego albo jednego z 17 fontów, które hostujemy.
Woła preview i daje ci link, pod którym widzisz draft w prawdziwym widżecie.
Woła publish i wygląd jest na żywo. Potem connect_chat i oddaje ci link. Jeśli sam zarejestrował stronę, ten czeka na twoje przejęcie (krok 3).
Kończy podsumowaniem: co zmienił w kodzie, co opublikował i co jeszcze musisz kliknąć.

krok 3: przejęcie, jeśli agent zarejestrował stronę

Kiedy agent sam zarejestrował stronę, dostajesz link do przejęcia. Otwórz go, zaloguj się albo załóż konto (bez karty) i przejmij stronę. Wybierasz też, co zostaje agentowi:

klucz admin, żeby dalej ustawiał rzeczy, albo
klucz agent, żeby czytał setup i później odpisywał na czaty.

Strona rusza, kiedy spełnione są dwie rzeczy, w dowolnej kolejności: przejąłeś ją, a widżet załadował się na twojej domenie. Wtedy startuje twój 14-dniowy trial. Wcześniej widżet widać na stronie, ale mówi, że czat niedługo ruszy, i nie przyjmuje wiadomości. Nieprzejęte strony i ich klucze kasujemy po 7 dniach.

Jeśli agent nie może cię złapać w sesji, może poprosić nas o wysłanie linku mailem. W tym mailu nie ma nic, co napisał agent.

krok 4: przejrzyj diffa

Traktuj to jak każdą inną zmianę od agenta. Diff powinien być mały:

jeden tag script we wspólnym layoucie, z async
może blok window.Spookat = { … } nad nim, jeśli agent przypiął wygląd w kodzie zamiast w dashboardzie

Czego nie powinno tam być: kopii tagu w każdym komponencie strony, tag managera, preloadu panelu czatu ani niczego, co ładuje panel przed kliknięciem. Jeśli coś takiego widzisz, każ agentowi to wyrzucić. Launcher jest jednym małym plikiem celowo.

Gdzie idzie tag, zależy od frameworka:

framework	gdzie
Next.js (app router)	`app/layout.tsx`, wewnątrz `<body>`
Next.js (pages router)	`pages/_document.tsx` albo `pages/_app.tsx`
Astro, SvelteKit, Nuxt, Remix	bazowy layout
Vite + React, czysty HTML	`index.html` albo wspólny include stopki

krok 5: sprawdź to sam

Wdróż albo odpal stronę i otwórz ją w oknie prywatnym z otwartym DevTools:

Network, filtr spookat: jeden request przed kliknięciem, launcher z cdn.spookat.com. Dwa, oba z cdn.spookat.com, jeśli twój kod ustawia w window.Spookat inny styl niż opublikowany. Nic do api.spookat.com.
Application: żadnych cookies od Spookat, żadnego storage, dopóki nie wyślesz pierwszej wiadomości.
Kliknij launcher: panel się ładuje, potem możesz pisać. Po przejęciu strony i podłączeniu kanału twoja testowa wiadomość pojawia się na Slacku albo Discordzie.

Główny poradnik ma dłuższą wersję tego testu, z opisem każdego requestu.

po setupie: agent może też odpisywać

Na pro i wyżej ten sam serwer MCP ma narzędzia do rozmów: lista tego, co czeka, odczyt czatu, odpowiedź, notatka, przekazanie człowiekowi. Odpowiedzi są oznaczone jako AI w widżecie i w wątku twojego zespołu, a odpowiedź kogoś z zespołu zawsze przejmuje czat. Ty wybierasz, kiedy agent może odpisywać: zawsze pierwszy, tylko jeśli nikt nie odpisał w 3 minuty, poza godzinami pracy albo tylko drafty. Zasady są opisane w dokumentacji.

inni agenci

Nic tu nie jest specyficzne dla Claude Code. Serwer MCP mówi Streamable HTTP, a prompt działa w każdym agencie, który umie przeczytać URL i edytować twój kod. W Cursorze serwer idzie do .cursor/mcp.json:

{
  "mcpServers": {
    "spookat": { "url": "https://api.spookat.com/mcp" }
  }
}

Bez klucza Cursor otworzy tę samą stronę logowania.

kiedy coś idzie nie tak

Narzędzia Spookat nie odpowiadają. Odpal /mcp w Claude Code, żeby zobaczyć status serwera. Jeśli mówi, że potrzebuje uwierzytelnienia, wybierz go i zaloguj się jeszcze raz. Jeśli dodałeś go z kluczem, sprawdź, czy klucz nie został unieważniony w dashboardzie.

Agent dał tag w złe miejsce. Powiedz mu, gdzie ma być: „Move the Spookat script to the root layout, remove every other copy.” Jedno zdanie zwykle wystarcza.

Launcher jest, ale czat nie może się połączyć. Czat łączy się tylko z domeny, na którą zarejestrowana jest strona, i jej subdomen. Na localhost albo adresie podglądu zobaczysz przycisk i nic więcej. Sprawdzaj na prawdziwej domenie.

Narzędzie odmawia. Przed przejęciem klucz tylko do setupu nie może podłączać kanału ani czytać czatów i mówi to wprost. Po przejęciu klucz agent nie może zmieniać wyglądu, publikować ani dotykać płatności: po to się go wybiera. Zrób w dashboardzie klucz admin, jeśli chcesz, żeby agent dalej ustawiał rzeczy.

Mail z linkiem do przejęcia nie przyszedł. Wysyłamy jeden dziennie na adres i nie ma w nim nic, co napisał agent. Otwórz link do przejęcia z sesji.

Agent chce budować własny czat. Niektóre prompty dryfują w tę stronę. Powiedz, że chcesz Spookat, wskaż llms.txt i wraca na tor.

checklista

claude mcp add zrobione i jesteś zalogowany (albo agent zarejestrował stronę).
Jeden tag we wspólnym layoucie, async, nic więcej nie ładuje się przed kliknięciem.
Wygląd jest na żywo i ci się podoba. Jeśli nie, cofnij go w logu aktywności.
Slack albo Discord podłączony przez link.
Strona przejęta, jeśli zarejestrował ją agent.
Sprawdzone w oknie prywatnym: jeden request przed kliknięciem (dwa, oba z cdn.spookat.com, jeśli twój kod ustawia nieopublikowany styl), zero cookies.

Wklej prompt, kliknij dwa linki i wracaj do tej części produktu, za którą ludzie płacą.