Come installare un chatbot AI in WordPress passo dopo passo
Una configurazione campo per campo su WordPress con posizionamento mobile e inline, regole esatte per i domini, una domanda di test reale e correzioni pratiche per la cache.
Un chatbot AI per WordPress richiede più di un semplice plugin attivato: occorre verificare l'assistente corretto, il dominio autorizzato, il posizionamento e le risposte in tempo reale.
Il plugin per WebChatAgent connette WordPress senza dover modificare i file del tema. WordPress memorizza solo il Chatbot ID e lo stato di attivazione del widget mobile. Aspetto, knowledge base, strumenti e logica di risposta rimangono nella dashboard di WebChatAgent.
Questa guida usa un sito WordPress locale temporaneo denominato Northstar Support Demo e un account di test WebChatAgent in lingua inglese e modalità Light Mode. Installiamo la versione 1.1.3 del plugin, colleghiamo un assistente, pubblichiamo una pagina con chat inline e verifichiamo il risultato senza toccare un sito di produzione.
Non considerare il pulsante di chat visibile come prova finale. L'hostname deve essere autorizzato, l'assistente corretto deve rispondere e una domanda basata su fonti deve restituire l'informazione prevista.
Player a due clic conforme alla privacy
Come installare un chatbot AI in WordPress (passo dopo passo)
Installa un chatbot AI su WordPress con il plugin ufficiale, ID assistente, autorizzazione dominio, blocchi inline, shortcode e test dal vivo.
Il player di YouTube rimane bloccato finché non selezioni Riproduci. Il caricamento connette il browser a YouTube e potrebbe trasferire dati tecnici a Google.
Apri direttamente su YouTubeCosa otterrai alla fine
- Il plugin ufficiale installato e attivo
- L'esatto hostname di WordPress autorizzato in WebChatAgent
- Il Chatbot ID corretto salvato con il widget mobile abilitato
- Una pagina di chat inline creata con il blocco o lo shortcode
- Un controllo ripetibile su risposte reali ed errori di dominio
Prima di iniziare
- Accesso come amministratore a WordPress
- Un chatbot WebChatAgent con almeno una fonte indicizzata
- Gli hostname esatti di produzione e staging
- Una domanda basata sulle fonti con una risposta esatta nota
- Autorizzazione a cancellare la cache di WordPress, del page builder e della CDN
Un unico ID collega due ambienti
WebChatAgent gestisce la configurazione dell'assistente. Il plugin per WordPress inietta gli script e passa il Chatbot ID selezionato ai posizionamenti mobile e inline.
Allowed websites rappresenta la barriera di sicurezza. Un ID corretto può comunque mostrare un errore di configurazione o nessun widget utilizzabile se l'hostname della pagina non è presente nell'elenco.
01–11
Configura passo dopo passo
Trova e attiva il plugin ufficiale
Verifica nome del plugin, autore e versione prima dell'attivazione.
Nell'area di amministrazione di WordPress, apri Plugin → Aggiungi plugin e cerca “WebChatAgent”. Seleziona AI Chatbot & Live Chat – WebChatAgent di WebChatAgent. Installalo dalla directory, quindi fai clic su Attiva.
Il test controllato ha utilizzato la versione 1.1.3 su WordPress 7.0. È preferibile utilizzare una versione più recente e compatibile se disponibile nella directory; non caricare file ZIP sconosciuti provenienti da siti di terze parti.
Conferma il plugin attivo e la nuova voce di menu
WordPress segnala l'attivazione e aggiunge WebChatAgent al menu principale.
Torna su Plugin installati. La riga di WebChatAgent deve mostrare Disattiva, non Attiva, e la notifica verde “Plugin activated” deve comparire una sola volta. Il passaggio successivo è accedere al menu principale WebChatAgent a sinistra.
Se l'attivazione fallisce, controlla i requisiti di WordPress e PHP indicati nella directory dei plugin prima di modificare qualsiasi impostazione in WebChatAgent.
Copia l'intero Chatbot ID dall'assistente prescelto
L'UUID determina quale assistente comparirà su WordPress.
Apri l'assistente desiderato nella dashboard in lingua inglese di WebChatAgent. Usa Chatbot actions → Copy chatbot ID, oppure copia l'UUID indicato in Widget Integration. L'ID corrisponde anche all'ultimo segmento dell'URL della dashboard.
Verifica il nome dell'assistente prima di copiare l'ID. L'esempio verificato utilizza Northstar Support; incollare per errore l'ID di un bot dedicato alle vendite può sembrare tecnicamente corretto pur generando risposte errate.
Autorizza ogni singolo hostname esatto di WordPress
Gli hostname di produzione, www e staging sono voci distinte.
In WebChatAgent, apri Settings e inserisci gli hostname esatti sotto Allowed websites. Inserisci gli hostname senza `https://`, porta o percorso di pagina, e premi Invio dopo ciascuno.
Ad esempio, `www.northstar-demo.example` non autorizza automaticamente `support.northstar-demo.example`. Aggiungi solo gli host che caricheranno effettivamente il widget. Durante il test è stato riprodotto intenzionalmente l'errore di dominio del plugin prima di correggere l'elenco degli host autorizzati.
Apri la scheda General del plugin WordPress
Vengono memorizzati localmente solo due valori per il widget mobile.
Seleziona WebChatAgent nel menu principale di WordPress. La scheda General spiega che WordPress memorizza il Chatbot ID e l'interruttore per il widget mobile. Le altre schede mostrano in sola lettura i valori configurati nella dashboard.
Prima del collegamento, la pagina mostra un link per creare o aprire un account WebChatAgent e un'area di anteprima. Tieni aperta la dashboard di WebChatAgent in un'altra scheda per confrontare facilmente il nome dell'assistente e l'ID.
Incolla l'ID e abilita il widget mobile
Salva un singolo UUID completo senza spazi.
Incolla l'UUID copiato nel campo Chatbot ID, attiva “Enable the chat widget on your site” e seleziona Save Settings. L'opzione controlla solo il pulsante mobile; i posizionamenti inline funzionano in modo indipendente.
Non digitare a mano l'ID leggendolo da uno screenshot. Copialo direttamente, quindi confronta i primi e gli ultimi quattro caratteri prima di salvare.
Verifica lo stato di salvataggio e presta attenzione ai messaggi di errore
Un dato salvato localmente non è automaticamente autorizzato da WebChatAgent.
La notifica verde “Settings saved successfully” conferma solo che WordPress ha memorizzato i valori. Se non è possibile caricare la configurazione del chatbot, la schermata stessa indica di verificare Allowed Domains e Chatbot ID.
Questo costituisce un utile test di errore controllato. Ricontrolla l'hostname esatto, il sottodominio `www` o di staging e l'UUID completo. Salva prima in WebChatAgent, poi ricarica WordPress. Non disattivare le restrizioni di dominio per nascondere il problema.
Scegli il blocco Gutenberg o lo shortcode per la chat inline
Entrambe le soluzioni riutilizzano l'ID salvato, a meno che non sia impostato un override specifico per la pagina.
Apri la scheda Inline Embed. Usa il blocco Gutenberg WebChatAgent Inline Chat, oppure lo shortcode `[webchatagent_inline]` nell'Editor classico, in un blocco Shortcode, in un page builder o in un widget di testo.
È possibile impostare un bot specifico per pagina utilizzando `[webchatagent_inline chatbot-id="OTHER_UUID"]`. Documenta con cura gli override, poiché possono spiegare il motivo per cui la chat inline e il pulsante mobile mostrano assistenti diversi.
Aggiungi la chat inline a una pagina reale
La pagina di esempio utilizza un blocco Shortcode standard.
Crea una pagina denominata “Ask Northstar Support”, aggiungi il blocco Shortcode di WordPress e incolla `[webchatagent_inline]`. Se utilizzi il blocco nativo di WebChatAgent, cerca “WebChatAgent Inline Chat” e lascia vuoto il campo opzionale ID per riutilizzare le impostazioni di General.
Mantieni uno spazio verticale sufficiente attorno all'integrazione e verifica l'anteprima dell'editor per tablet e dispositivi mobili prima di pubblicare.
Pubblica e registra l'URL esatto di test
Una pagina pubblicata offre una destinazione di test univoca e ripetibile nel browser.
Fai clic su Pubblica, controlla visibilità e URL, quindi conferma la pubblicazione. Apri l'URL pubblico finale in una finestra di navigazione in incognito, evitando che cookie di amministrazione o stati obsoleti del widget mascherino eventuali problemi.
Per gli ambienti di staging, escludi la pagina dai risultati di ricerca e rimuovila dopo l'approvazione. La pagina del tutorial locale conteneva solo dati fittizi di Northstar.
Verifica posizionamento, identità dell'assistente e una risposta reale
Verifica l'intera esperienza per l'utente, non solo il caricamento dello script.
La pagina pubblicata mostra la chat inline all'interno del contenuto e il pulsante mobile Open chat in basso a destra. Se desideri un solo posizionamento, disattiva l'opzione per il pulsante mobile o rimuovi il blocco inline.
Domanda esatta di test: “What is the internal escalation code for an urgent service incident?” Risultato atteso ed effettivamente riscontrato: `NORDSTERN-42`. Il frame verificato di 1440 × 1000 mostra la risposta reale basata sulle fonti nel sito di test WordPress, dopo aver autorizzato l'esatto hostname locale.
Se il widget non compare, svuota la cache di WordPress, del page builder e della CDN. Escludi `web-chat-agent.js` e, per le pagine inline, `chat-widget-inline.js` dalle regole di delay/defer o di combinazione degli script, quindi ripeti il test in una nuova finestra in incognito.
Esempio e risultato
Guarda il test pratico e il relativo risultato
Ogni tutorial include un input definito, il risultato atteso e un riepilogo trasparente di quanto effettivamente verificato in ambiente di prova.
Esempio pratico: installare il chatbot AI WebChatAgent in WordPress: guida completa per principianti
Questo scenario esatto è stato completato utilizzando l'account di prova temporaneo.
Input esatto del test
Open the WordPress sample page and ask: “What is the internal escalation code for an urgent service incident?”
Risultato previsto
Il widget si carica correttamente, si apre ed estrae il valore dal PDF indicizzato.
Cosa è stato effettivamente verificato
La pagina temporanea di WordPress ha caricato sia il posizionamento inline che quello mobile. Il widget inline reale ha risposto: “The support verification code is NORDSTERN-42.”
Consigli e suggerimenti
Rendi affidabile la configurazione
Esegui i test con esempi realistici, registra i dati di base e modifica una sola impostazione alla volta. In questo modo i miglioramenti reali risulteranno evidenti.
Tratta gli hostname come voci di sicurezza precise
Aggiungi separatamente gli host di produzione, www e staging necessari. Rimuovi gli host temporanei dopo l'approvazione.
Scegli il modello prima del controllo qualità su WordPress
Usa il modello più rapido ed economico che superi i test sulle risposte note e sui casi in cui ammettere correttamente di non conoscere l'informazione. WordPress non modifica la qualità del modello.
Ripeti i test dopo ogni aggiornamento delle fonti
Rimuovi le pagine duplicate e i PDF obsoleti, reindicizza e ripeti le stesse domande di valutazione sulla pagina pubblica di WordPress.
Cosa fare se qualcosa non funziona
Risoluzione dei problemi
Verifica lo stato, i permessi e i dati di test in modo sistematico prima di modificare il modello o il prompt.
L'opzione prevista non è visibile
Verifica il piano dell'account, i permessi delle funzionalità e il chatbot selezionato. Le funzionalità a pagamento o in versione beta possono risultare nascoste se non sono soddisfatti i requisiti preliminari.
Il risultato del test non è coerente
Reimposta la conversazione di test, mantieni identico il testo immesso e modifica una sola impostazione alla volta, in modo da identificare con precisione la causa.
Pronto per un test strutturato
Ripeti il test di risposta sulla home page, su una pagina interna memorizzata in cache e su uno schermo mobile. Verifica i posizionamenti previsti, la gestione del consenso e l'identità dell'assistente prima del lancio ufficiale.