lascia che claude code aggiunga la live chat al tuo sito

Claude Code può mettere una live chat sul tuo sito in una sola sessione: aggiunge lo snippet al tuo layout, legge i tuoi colori e i tuoi font per dare stile al widget e ti dà i due link che deve cliccare una persona. Questa guida mostra la configurazione, il prompt, cosa l’agente può e non può fare e come controllare il suo lavoro.
cosa fa l’agente e cosa resta a te
Spookat è costruito perché un agente di codice possa fare tutta la configurazione. Il manuale è un file scritto per agenti, llms.txt, e c’è un server MCP remoto con strumenti per tutto quello che serve a una configurazione.
L’agente si occupa di scrivere:
- trova il tuo layout condiviso e aggiunge l’unico tag script
- legge i colori e i font del tuo sito e imposta stile, accento, font, posizione e saluto del widget
- ti dice esattamente cosa ha fatto e cosa manca
Una persona fa le due cose che non devono mai succedere da sole:
- collegare Slack o Discord.
connect_chatrestituisce un link per chi può aggiungere app nel tuo workspace. Lo approva in Slack o in Discord. - pagare.
change_planrestituisce un link di checkout. Gli agenti non pagano e non disdicono mai.
L’aspetto lo pubblica l’agente stesso: publish lo mette online, senza approvazione. Ogni modifica dell’agente compare nel log delle attività del sito, nella dashboard, e lì puoi annullare una pubblicazione.
passo 1: collega claude code a spookat
Nel terminale del tuo progetto:
claude mcp add --transport http spookat https://api.spookat.com/mcp
Non serve una chiave. La prima volta che Claude Code usa uno strumento di Spookat si apre una scheda del browser: accedi, spunti i siti che può usare e scegli cosa può fare. Se preferisci una chiave, creala nella dashboard in installazione, chiavi segrete, e passala come header:
claude mcp add --transport http spookat https://api.spookat.com/mcp --header "Authorization: Bearer sk_live_…"
Le chiavi iniziano con sk_live_, appartengono a un sito e vengono mostrate una sola volta. Tienile fuori dal repository.
ancora nessun account spookat
Non ti serve per iniziare. L’agente può registrare il sito da solo: una richiesta con il tuo dominio gli porta lo snippet e un link di rivendicazione per te, e un’altra la chiave solo per la configurazione. Il protocollo è in auth.md, e l’agente lo legge da solo quando il manuale lo manda lì.
La chiave di configurazione può dare stile al widget, pubblicare l’aspetto e leggere lo snippet. Non può collegare un canale, toccare la fatturazione né leggere le chat. Tutto questo aspetta che tu rivendichi il sito.
passo 2: incolla il prompt
Add Spookat chat to my site. Read https://spookat.com/llms.txt first, then match the chat style to my site.
Questo è tutto il prompt. Il resto è nel manuale. Se vuoi indirizzarlo, aggiungi una riga: lo stile che ti piace, il saluto o da che lato deve stare il launcher.
Com’è un’esecuzione tipica:
- Legge
llms.txt, poi controlla se gli strumenti di Spookat rispondono. Se hai effettuato l’accesso, chiamaget_confige vede il tuo sito. Altrimenti registra il sito. - Ti chiede il tuo vero dominio se non lo trova nel progetto. Non ne inventa mai uno, e non inventa mai una chiave.
- Trova il layout che condividono tutte le pagine e aggiunge il tag prima di
</body>:
<script src="https://cdn.spookat.com/s/YOUR_SITE_KEY.js" async></script>
- Guarda il tuo CSS, sceglie uno dei 8 stili, imposta il colore del tuo brand come accento e un font adatto. Può usare il tuo font di sistema o uno dei 17 font che ospitiamo.
- Chiama
previewe ti dà un link dove vedi la bozza nel widget vero. - Chiama
publishe l’aspetto è online. Poiconnect_chate ti passa il link. Se ha registrato il sito, quello aspetta la tua rivendicazione (passo 3). - Chiude con un riepilogo: cosa è cambiato nel codice, cosa ha pubblicato e cosa ti resta da cliccare.
passo 3: la rivendicazione, se l’agente ha registrato il sito
Quando l’agente ha registrato il sito da solo, ricevi un link di rivendicazione. Aprilo, accedi o registrati (senza carta) e rivendica il sito. Scegli anche cosa tiene l’agente:
- una chiave admin, per continuare a configurare, oppure
- una chiave agent, per leggere la configurazione e rispondere alle chat più avanti.
Il sito va online quando sono vere due cose, in qualsiasi ordine: l’hai rivendicato e il widget si è caricato sul tuo dominio. La tua prova di 14 giorni parte in quel momento. Prima, il widget compare sul tuo sito ma dice che la chat apre a breve e non accetta messaggi. I siti non rivendicati e le loro chiavi vengono eliminati dopo 7 giorni.
Se l’agente non riesce a raggiungerti durante la sessione, può chiederci di mandarti il link di rivendicazione via email. Quell’email non contiene niente di scritto dall’agente.
passo 4: rivedi il diff
Trattalo come qualsiasi altra modifica fatta da un agente. Il diff dovrebbe essere piccolo:
- un tag script nel layout condiviso, con
async - forse un blocco
window.Spookat = { … }sopra, se l’agente ha fissato l’aspetto nel codice invece che nella dashboard
Cosa non dovrebbe contenere: una copia del tag in ogni componente di pagina, un tag manager, un preload del pannello della chat o qualsiasi cosa che carichi il pannello prima di un clic. Se vedi una di queste cose, chiedi all’agente di toglierla. Il launcher è un file piccolo apposta.
Dove va il tag dipende dal tuo framework:
| framework | dove |
|---|---|
| Next.js (app router) | app/layout.tsx, dentro <body> |
| Next.js (pages router) | pages/_document.tsx o pages/_app.tsx |
| Astro, SvelteKit, Nuxt, Remix | il layout di base |
| Vite + React, HTML puro | index.html o l’include del footer condiviso |
passo 5: controllalo tu
Fai il deploy o avvia il sito, poi aprilo in una finestra privata con i DevTools aperti:
- Network, filtrato per
spookat: una richiesta prima di un clic, il launcher dacdn.spookat.com. Due, entrambe dacdn.spookat.com, se il tuo codice imposta inwindow.Spookatuno stile diverso da quello che hai pubblicato. Niente versoapi.spookat.com. - Application: nessun cookie di Spookat, nessuno storage finché non invii un primo messaggio.
- Clicca sul launcher: il pannello si carica, poi puoi scrivere. Dopo la rivendicazione e il collegamento del canale, il tuo messaggio di prova compare in Slack o in Discord.
La guida principale ha la versione lunga di questo controllo, con cosa sia ogni richiesta.
dopo la configurazione: l’agente può anche rispondere
Da pro in su, lo stesso server MCP ha strumenti per le conversazioni: elencare cosa aspetta, leggere una chat, rispondere, aggiungere una nota, passarla a una persona. Le risposte sono etichettate come IA nel widget e nel thread del tuo team, e la risposta di un collega prende sempre il sopravvento. Scegli tu quando può rispondere: sempre per primo, solo se nessuno ha risposto in 3 minuti, fuori dall’orario di lavoro o solo bozze. La documentazione descrive le regole.
gli altri agenti
Niente di tutto questo è specifico di Claude Code. Il server MCP parla Streamable HTTP, e il prompt funziona in qualsiasi agente che sappia leggere un URL e modificare il tuo codice. In Cursor, il server va in .cursor/mcp.json:
{
"mcpServers": {
"spookat": { "url": "https://api.spookat.com/mcp" }
}
}
Lascia fuori la chiave e Cursor apre la stessa pagina di accesso.
quando non va come previsto
Gli strumenti di Spookat non rispondono. Esegui /mcp in Claude Code per vedere lo stato del server. Se dice che serve l’autenticazione, selezionalo e accedi di nuovo. Se l’hai aggiunto con una chiave, controlla che non sia stata revocata nella dashboard.
L’agente ha messo il tag nel posto sbagliato. Digli dove: “Move the Spookat script to the root layout, remove every other copy.” Di solito basta una frase.
Il launcher compare, ma la chat non si connette. La chat si connette solo dal dominio per cui è registrato il sito e dai suoi sottodomini. Su localhost o su un URL di anteprima vedrai il pulsante e nient’altro. Controlla sul dominio vero.
Uno strumento dice di no. Prima della rivendicazione, la chiave di configurazione non può collegare un canale né leggere le chat, e lo dice. Dopo la rivendicazione, una chiave agent non può cambiare l’aspetto, pubblicare né toccare la fatturazione: è proprio il motivo per sceglierla. Crea una chiave admin nella dashboard se vuoi che l’agente continui a configurare.
L’email di rivendicazione non è arrivata. Ne mandiamo una per indirizzo al giorno, senza niente di scritto dall’agente. Apri invece il link di rivendicazione dalla sessione.
L’agente vuole costruirsi la sua chat. Alcuni prompt scivolano in quella direzione. Di’ che vuoi Spookat, indica llms.txt e torna in carreggiata.
checklist
claude mcp addfatto, e accesso effettuato (o l’agente ha registrato il sito).- Un tag nel layout condiviso,
async, nient’altro che si carica prima di un clic. - L’aspetto è online e ti piace. Se no, annullalo dal log delle attività.
- Slack o Discord collegato tramite il link.
- Sito rivendicato, se l’agente l’ha registrato.
- Controllato in una finestra privata: una richiesta prima del clic (due, entrambe da
cdn.spookat.com, se il tuo codice imposta uno stile che non hai pubblicato), nessun cookie.
Incolla il prompt, clicca i due link e torna alla parte del tuo prodotto per cui le persone pagano.