Come aggiungere il widget di Conversational AI di ElevenLabs al tuo sito Wix

Vuoi migliorare il supporto clienti e il coinvolgimento aggiungendo l'IA conversazionale di ElevenLabs al tuo sito Wix? Sei nel posto giusto. Questa guida ti accompagna nell'intero processo, passo dopo passo, aiutandoti a evitare gli errori più comuni.

Prima di iniziare

Prima di iniziare, assicurati di avere quanto segue:

1. Account Wix Premium: l'integrazione di JavaScript personalizzato è disponibile esclusivamente nei piani Premium.
2. Account ElevenLabs: ti serve un account ElevenLabs per creare agenti vocali IA conversazionali. Registrati qui.
3. Accesso a Wix Editor con Dev Mode attiva: ti serve la Dev Mode per aggiungere codice personalizzato al tuo sito.

Guida passo passo

Passaggio 1: prepara il widget di ElevenLabs

1. Accedi al tuo account ElevenLabs.
2. Vai alla sezione IA conversazionale.
3. Configura il tuo agente conversazionale e copia il codice di incorporamento JavaScript fornito.

Passaggio 2: attiva la Dev Mode in Wix

1. Apri il tuo sito Wix nell'Editor.
2. Nel menu in alto, fai clic su Dev Mode per attivare funzionalità avanzate, come l'aggiunta di codice personalizzato.

Nota: se la Dev Mode non è visibile, assicurati di usare l'Editor Wix completo e non Wix ADI (Artificial Design Intelligence).

Passaggio 3: aggiungi il codice di incorporamento JavaScript

1. Nell'Editor Wix, vai a Settings > Custom Code.
2. Fai clic su + Add Custom Code.
3. Incolla il codice JavaScript di ElevenLabs nel campo apposito.
4. In Apply Code To, seleziona All Pages (oppure scegli una pagina specifica per il widget).
5. Salva e pubblica le modifiche.

Problemi comuni e risoluzione dei problemi

Hai riscontrato un problema nell'aggiungere un widget di IA conversazionale al tuo sito Wix? Segui questi semplici passaggi per risolverlo.

Problema 1: il widget si disconnette o non si carica

• Causa: configurazione errata della Allowlist oppure utilizzo di un piano Wix gratuito.
• Soluzione: assicurati che l'URL del tuo sito sia stato rimosso dalla Allowlist oppure configurato correttamente nella dashboard di ElevenLabs.

Problema 2: JavaScript non funziona

• Causa: il codice JavaScript non è stato aggiunto correttamente.
• Soluzione: verifica attentamente che il codice JavaScript sia incollato nel campo corretto in Custom Code.

Problema 3: piano Wix gratuito

• Causa: l'integrazione di JavaScript personalizzato non è supportata nei piani Wix gratuiti.
• Soluzione: passa a un piano Wix Premium.

Suggerimenti avanzati

Se vuoi creare la migliore esperienza possibile per i visitatori del tuo sito, dai un'occhiata a queste best practice avanzate. 

Modificare la Allowlist

Se il widget continua a non funzionare dopo aver incorporato il codice, segui questi passaggi:

1. Accedi al tuo account ElevenLabs.
2. Vai alle impostazioni della Allowlist del tuo agente di IA conversazionale.
3. Assicurati che il dominio del tuo sito sia aggiunto correttamente. Se il problema persiste, prova a rimuovere il dominio dalla Allowlist e ripeti il test.

Test su un dominio live

Il widget potrebbe non funzionare correttamente nella modalità di anteprima di Wix. Pubblica il tuo sito e testalo sul dominio live per assicurarti che funzioni come previsto.

Test di compatibilità tra browser

Quando il widget è online, testalo su più browser, come Chrome, Firefox, Edge e Safari. Alcune funzionalità potrebbero comportarsi diversamente da un browser all'altro a causa delle differenze nella gestione di JavaScript.

1. Apri il tuo sito web in ciascun browser.
2. Interagisci con il widget e verifica la sua reattività.
3. Cerca problemi come stili non applicati correttamente o errori di funzionalità. Se emergono problemi, controlla il codice JavaScript o contatta l'assistenza ElevenLabs per ricevere indicazioni.

Adattabilità ai dispositivi mobili

Verifica che il widget funzioni senza problemi sui dispositivi mobili, dato che molti utenti accedono ai siti web tramite smartphone o tablet.

1. Usa il Mobile Editor di Wix per visualizzare in anteprima il layout mobile del tuo sito.
2. Testa il widget su dispositivi fisici per confermarne la funzionalità e la facilità d'uso.
3. Verifica che non vi siano elementi sovrapposti o problemi di formattazione. Se servono modifiche, usa gli strumenti di progettazione mobile di Wix per ottimizzarne posizione e dimensioni.

Suggerimenti per il debug JavaScript

Se il widget non funziona come previsto, gli strumenti per sviluppatori del browser possono aiutarti a individuare i problemi.

1. Apri il tuo sito in un browser (Chrome consigliato).
2. Fai clic con il pulsante destro in un punto qualsiasi della pagina e seleziona Inspect per aprire DevTools.
3. Vai alla scheda Console e cerca messaggi di errore relativi al widget.
4. Se visualizzi errori, confronta il codice di incorporamento JavaScript e assicurati che tutti gli URL necessari siano stati aggiunti alla Allowlist. Questo metodo può anche evidenziare dipendenze mancanti o altri problemi che impediscono al widget di funzionare correttamente.

Considerazioni finali

Integrare il widget di IA conversazionale di ElevenLabs in Wix richiede un'attenta configurazione, ma con i passaggi giusti puoi renderlo operativo in poco tempo. Assicurati di avere un piano Wix Premium, segui i passaggi sopra indicati e risolvi i problemi comuni quando necessario. Se riscontri altri problemi, contatta l'assistenza ElevenLabs assistenza per ricevere aiuto.

Oppure, se non l'hai ancora fatto, registrati oggi alla piattaforma di agenti IA conversazionali.