Chatbot AI per Wix, Webflow e Squarespace

Per aggiungere un chatbot AI a un sito fatto con Wix, Webflow o Squarespace ti basta una riga di codice, la stessa per tutte e tre le piattaforme. Cambia solo il punto in cui incollarla: ogni builder ha il suo pannello per il codice personalizzato, e su alcuni serve un piano a pagamento.

Qui trovi il percorso esatto per ciascuna piattaforma, i piani che lo permettono e cosa controllare se la chat non compare. Se prima vuoi capire cosa fa un assistente di questo tipo e come sceglierlo, parti dalla guida al chatbot AI per sito web.

Prima di iniziare

Prima di aprire il pannello del tuo sito, crea il chatbot. Registrati su Kiedi, inserisci l'indirizzo del sito e lascia che legga le pagine pubbliche. Poi aggiungi i documenti che vuoi usare, come listini, cataloghi o condizioni di vendita, in PDF, Word, TXT o Markdown (i PDF scansionati dal piano Pro). Se non l'hai mai fatto, la guida su come creare un chatbot ti accompagna passo per passo.

Fai qualche domanda di prova dalla dashboard, con le domande che ti fanno davvero i clienti. Quando le risposte ti convincono, apri la pagina di installazione e copia lo snippet. Ha questa forma, con il tuo codice al posto di IL-TUO-ID:

<script src="https://www.kiedi.me/widget.js" data-bot-id="IL-TUO-ID" defer></script>

Copialo intero, senza cambiare nulla. Se vuoi il pulsante della chat a sinistra, per esempio perché a destra hai già il pulsante di WhatsApp, puoi aggiungere data-position="left".

Un'ultima cosa: lo snippet va messo in un'impostazione che vale per tutto il sito, non dentro una singola pagina. Se lo incolli in un blocco HTML di una pagina, la chat compare solo lì e sparisce se quel blocco viene cancellato.

Wix

Su Wix il chatbot si aggiunge dalla dashboard del sito, con la funzione Codice personalizzato (Custom Code). Prima controlla i requisiti: secondo la guida di Wix sul codice personalizzato, il sito deve essere pubblicato e avere un dominio collegato. Per collegare un tuo dominio serve un piano a pagamento, come spiega Wix nella pagina su dominio e piano del sito.

1. Apri Impostazioni › Codice personalizzato

   Dalla dashboard del sito vai in Impostazioni (Settings). Nella sezione Sviluppo e integrazioni (Development & integrations) scegli Codice personalizzato (Custom Code), poi premi il pulsante per aggiungere un nuovo codice in alto a destra.

2. Incolla lo snippet e applicalo a tutte le pagine

   Incolla lo snippet nel riquadro del codice e dagli un nome riconoscibile, per esempio "Chatbot Kiedi". Tra le pagine a cui applicarlo scegli Tutte le pagine (All pages), che vale anche per le pagine che creerai in futuro, e l'opzione per caricarlo a ogni pagina aperta dal visitatore.

   Come posizione scegli Corpo - fine, cioè la parte finale della pagina. Premi Usa e apri il sito pubblicato per controllare.

Il codice non si vede nell'editor, solo sul sito pubblicato. E fai attenzione se un giorno cambi dominio: Wix avvisa che, assegnando un dominio diverso al sito, i codici personalizzati vengono cancellati. In quel caso incolla di nuovo lo snippet.

Webflow

Su Webflow lo snippet va nel campo Footer code delle impostazioni del sito. Il codice inserito lì viene messo prima della chiusura del tag body su tutte le pagine, come spiega la guida di Webflow sul codice personalizzato.

Anche qui serve un piano adatto. Secondo la stessa guida, possono usare il codice personalizzato i siti con un Site plan attivo oppure i workspace Core, Growth, Agency o Freelancer. Se non sei sicuro di cosa includa il tuo, verifica sul tuo piano prima di iniziare.

I passaggi sono questi:

1. Apri il progetto e vai in Site settings.
2. Scegli la scheda Custom code.
3. Incolla lo snippet nel campo Footer code, non in Head code.
4. Salva le modifiche.
5. Pubblica il sito.

L'ultimo passaggio è quello che si dimentica più spesso. Webflow spiega che il codice personalizzato si vede in anteprima ma va online solo quando pubblichi il sito. Se hai sia l'indirizzo webflow.io sia il tuo dominio, controlla di aver pubblicato su quello che usano i clienti.

Squarespace

Su Squarespace si usa l'Iniezione di codice, che inserisce il codice su ogni pagina del sito. Apri il pannello Pagine, scegli Codice personalizzato in fondo e poi Iniezione di codice. Incolla lo snippet nel campo Piè di pagina e premi Salva: secondo la guida di Squarespace sull'iniezione di codice, il codice del Piè di pagina viene inserito prima della chiusura del tag body su tutte le pagine.

Nelle pagine di checkout Squarespace non permette codice personalizzato, quindi lì la chat non compare: è normale.

Squarespace precisa anche che non dà assistenza sulle modifiche fatte con il codice. Se qualcosa non va, il supporto giusto è quello di Kiedi.

Il chatbot legge le pagine fatte con questi builder?

Di solito sì. Kiedi legge il testo delle pagine pubbliche del sito, e i siti fatti con questi strumenti hanno in genere il testo leggibile nella pagina.

Ci sono però delle eccezioni. Alcuni contenuti compaiono solo dopo che il browser ha eseguito del codice JavaScript, per esempio certi elenchi caricati da app esterne, gallerie, recensioni o widget di prenotazione. Quei testi a volte il chatbot non li vede. Lo stesso vale per il testo dentro le immagini, che non viene letto, e per le pagine protette da password.

Controllare è semplice. Dopo aver collegato il sito, fai al chatbot una domanda la cui risposta sta in una pagina precisa. Se risponde che non ha l'informazione, apri la sezione Fonti e guarda se quella pagina c'è. Se manca, o se c'è ma senza il testo che ti serve, copia il testo e aggiungilo nelle Fonti come testo libero. Da quel momento il chatbot lo usa come qualsiasi pagina.

Ricorda anche che Kiedi rilegge il sito in automatico solo una volta al mese con lo Starter e una a settimana con Pro e Agenzia. Quando modifichi una pagina sul builder, apri la sezione Fonti di Kiedi e premi "Aggiorna", altrimenti il chatbot continua a rispondere con la versione precedente.

Problemi comuni

Il widget non compare. Apri il sito pubblicato in una finestra in incognito, non l'editor o l'anteprima. Se ancora non c'è, dal computer premi F12 e guarda la scheda Console. Il messaggio "[kiedi] Attributo data-bot-id mancante." vuol dire che lo snippet è stato copiato a metà: ricopialo intero. Il messaggio "[kiedi] Chat non disponibile per questo sito." vuol dire che il codice è giusto ma il chatbot non è attivo, per esempio perché l'abbonamento non è attivo.

Hai salvato ma non hai pubblicato. Su Webflow le modifiche al codice diventano visibili solo dopo la pubblicazione. Su Wix il codice personalizzato funziona solo sul sito pubblicato con il dominio collegato.

Lo snippet è finito in una sola pagina. Succede se lo incolli in un blocco HTML o in un elemento incorporato. Spostalo nelle impostazioni del sito.

Il codice è sparito. Su Wix succede se cambi dominio. Su tutte le piattaforme succede se cambi template o tema senza riportare lo snippet.

Il cookie banner blocca la chat. Alcuni banner bloccano gli script esterni finché il visitatore non accetta i cookie. Il widget di Kiedi salva nel browser solo un identificativo tecnico, che tiene insieme la conversazione e scade 30 giorni dopo l'ultimo utilizzo, e nessun cookie di profilazione. Di solito si può quindi classificare come necessario: trovi i dettagli nella cookie policy.

Il pulsante copre altri elementi. Su mobile controlla che la chat non si sovrapponga al pulsante di WhatsApp, alla barra dei cookie o a un pulsante di acquisto. Se succede, sposta il pulsante sull'altro lato dalla dashboard di Kiedi o con data-position.

Se il tuo sito è su WordPress, Shopify, PrestaShop o Joomla, trovi le guide dedicate per il chatbot su WordPress e WooCommerce, per il chatbot su Shopify e per il chatbot su PrestaShop e Joomla.

Domande frequenti