Hur du lägger till ElevenLabs Conversational AI-widget på din Wix-webbplats

Vill du förbättra din kundsupport och ditt engagemang genom att lägga till ElevenLabs Conversational AI på din Wix-webbplats? Då har du kommit rätt. Den här guiden går igenom hela processen steg för steg och hjälper dig att undvika vanliga fallgropar.

Innan du börjar

Innan du börjar behöver du följande:

1. Wix Premium-konto: Det går bara att bädda in anpassad JavaScript med Premium-abonnemang.
2. ElevenLabs-konto: Du behöver ett ElevenLabs-konto för att skapa Conversational AI-röstassistenter. Registrera dig här.
3. Tillgång till Wix Editor med Dev Mode aktiverat: Du behöver Dev Mode för att lägga till anpassad kod på din webbplats.

Steg-för-steg-guide

Steg 1: Förbered din ElevenLabs-widget

1. Logga in på ditt ElevenLabs-konto.
2. Gå till avsnittet Conversational AI.
3. Konfigurera din konversationsagent och kopiera JavaScript-koden för inbäddning.

Steg 2: Aktivera Dev Mode i Wix

1. Öppna din Wix-webbplats i Editorn.
2. Klicka på Dev Mode i toppmenyn för att aktivera avancerade funktioner, som att lägga till anpassad kod.

Obs: Om Dev Mode inte syns kontrollerar du att du använder hela Wix Editor, inte Wix ADI (Artificial Design Intelligence).

Steg 3: Lägg till JavaScript-koden för inbäddning

1. Gå till Settings > Custom Code i Wix Editor.
2. Klicka på + Add Custom Code.
3. Klistra in ElevenLabs JavaScript-kod i det angivna fältet.
4. Under Apply Code To väljer du All Pages (eller en specifik sida för widgeten).
5. Spara och publicera ändringarna.

Vanliga problem och felsökning

Har du stött på problem när du lägger till en Conversational AI-widget på din Wix-webbplats? Följ de här enkla stegen för att lösa problemet.

Problem 1: Widgeten kopplas från eller laddas inte

• Orsak: Felaktig konfiguration av Allowlist eller att du använder ett kostnadsfritt Wix-abonnemang.
• Lösning: Kontrollera att webbplatsens URL antingen har tagits bort från Allowlist eller är korrekt konfigurerad i ElevenLabs instrumentpanel.

Problem 2: JavaScript fungerar inte

• Orsak: JavaScript-koden har inte lagts till korrekt.
• Lösning: Kontrollera en extra gång att JavaScript-koden har klistrats in i rätt fält under Custom Code.

Problem 3: Kostnadsfritt Wix-abonnemang

• Orsak: Det går inte att bädda in anpassad JavaScript med kostnadsfria Wix-abonnemang.
• Lösning: Uppgradera till ett Wix Premium-abonnemang.

Avancerade tips

Vill du skapa bästa möjliga upplevelse för besökarna på din webbplats? Ta del av de här avancerade rekommendationerna. 

Justera Allowlist

Om widgeten fortfarande inte fungerar efter att du har bäddat in koden följer du de här stegen:

1. Logga in på ditt ElevenLabs-konto.
2. Gå till Allowlist-inställningarna för din Conversational AI-agent.
3. Kontrollera att din webbplats domän har lagts till korrekt. Om problemen kvarstår kan du prova att ta bort domänen från Allowlist och testa igen.

Testa på en publicerad domän

Widgeten kanske inte fungerar korrekt i Wix förhandsgranskningsläge. Publicera webbplatsen och testa den på den aktiva domänen för att kontrollera att den fungerar som förväntat.

Testa kompatibilitet mellan webbläsare

När widgeten är publicerad testar du den i flera webbläsare, som Chrome, Firefox, Edge och Safari. Vissa funktioner kan fungera annorlunda mellan webbläsare på grund av skillnader i hur JavaScript hanteras.

1. Öppna din webbplats i varje webbläsare.
2. Interagera med widgeten och kontrollera hur väl den svarar.
3. Leta efter problem som trasig formatering eller funktionsfel. Om problem uppstår granskar du JavaScript-koden eller kontaktar ElevenLabs kundtjänst för vägledning.

Mobilanpassning

Kontrollera att widgeten fungerar smidigt på mobila enheter, eftersom många användare besöker webbplatser via smarttelefoner eller surfplattor.

1. Använd Wix Mobile Editor för att förhandsgranska webbplatsens mobila layout.
2. Testa widgeten på fysiska enheter för att bekräfta att den fungerar och är enkel att använda.
3. Kontrollera om element överlappar varandra eller om det finns formateringsproblem. Om justeringar behövs använder du Wix verktyg för mobil design för att optimera placering och storlek.

Tips för felsökning av JavaScript

Om widgeten inte fungerar som förväntat kan webbläsarens utvecklarverktyg hjälpa dig att identifiera problem.

1. Öppna din webbplats i en webbläsare (Chrome rekommenderas).
2. Högerklicka var som helst på sidan och välj Inspect för att öppna DevTools.
3. Gå till fliken Console och leta efter felmeddelanden relaterade till widgeten.
4. Om du ser fel kontrollerar du JavaScript-koden för inbäddning och ser till att alla nödvändiga URL:er har lagts till i Allowlist. Den här metoden kan även visa saknade beroenden eller andra problem som hindrar widgeten från att fungera korrekt.

Avslutande tankar

Att integrera ElevenLabs Conversational AI-widget i Wix kräver noggrann konfigurering, men med rätt steg kan du snabbt komma igång. Se till att du har ett Wix Premium-abonnemang, följ stegen ovan och felsök vanliga problem vid behov. Om du stöter på fler problem kan du kontakta ElevenLabs kundtjänst för hjälp.

Eller, om du inte redan har gjort det, registrera dig för Conversational AI Agents-plattformen i dag.