Hur du skapar en FlowHunt AI-chattbot för Shopify

Den här guiden visar dig hur du kopplar FlowHunt till din Shopify-butik, lägger till ett förbyggt Shopify-chattbotflöde, publicerar det och bäddar in chattboten på din butikssida.

Förutsättningar

• En Shopify-butik med administratörsbehörighet
• Ett FlowHunt-konto med arbetsyteåtkomst: https://app.flowhunt.io/
• Viktigt: Använd samma e-postadress för ditt FlowHunt-konto som för ditt Shopify-administratörskonto.

1) Integrera Shopify med FlowHunt (via Shopify App Store)

1. Öppna Shopify App Store och sök efter “FlowHunt”.
2. Klicka på Installera och, om du blir ombedd, välj rätt butik.
3. Granska de begärda behörigheterna och klicka på Installera app / Auktorisera.

Efter installationen omdirigeras du till Shopify och/eller FlowHunt. Anslutningen skapas via marknadsplatsens installationsflöde.

2) Installera FlowHunt-appen på din Shopify-butik

1. På Shopify-auktoriseringsskärmen, granska de begärda behörigheterna.
2. Klicka på Installera app för att slutföra installationen.

3) Bekräfta att Shopify-integrationen är aktiverad

Efter en lyckad installation, gå tillbaka till FlowHunt → Integrationer. Du ska se att Shopify är markerad som Ansluten/Aktiverad.

Om den inte är aktiverad, klicka på Anslut igen och följ auktoriseringsflödet.

4) Lägg till en Shopify-chattbot från Flow Library

1. Gå till Flow Library i FlowHunt.
2. Sök efter “Shopify Chatbot”.
3. Öppna mallen och klicka på Lägg till i arbetsyta.

Detta lägger till ett färdigt Shopify-chattbotflöde i din arbetsyta.

5) Anpassa chattboten för ditt varumärke

Öppna flödet du just lagt till och justera:

• Systemprompt och ton: Sätt din varumärkesröst och säkerhetsramar.
• Kunskapskällor: Koppla din produktkatalog, FAQ, policyer eller andra dokument.
• Verktyg och åtgärder: Aktivera valfritt orderuppslag, statuskontroller eller CRM-uppdateringar om din plan och konfiguration tillåter det.
• UI/varumärke: Konfigurera widgetnamn, hälsningsfraser och eventuella synliga etiketter senare i Chattbotar-sektionen.

När du är klar, Spara dina ändringar.

6) Publicera flödet

Klicka på Publicera på flödet så att det blir tillgängligt att användas av en chattbot på din webbplats/butikssida.

7) Skapa en ny Integrationskod (Chattbot)

1. Gå till Chattbotar i FlowHunt.
2. Klicka på Ny Integrationskod.
3. Välj det publicerade flödet du skapade ovan.
4. Konfigurera widgetalternativ (tema, position, öppningsbeteende, språk, domän-vitlista, etc.).
5. Spara. FlowHunt genererar då en skriptkod (din Integrationskod).

Spara denna kod – du kommer att klistra in den i ditt Shopify-tema i nästa steg.

8) Bädda in chattboten på din Shopify-butik

Du kan lägga till Integrationskoden på två sätt. Välj det alternativ som passar dig bäst.

Alternativ A — Lägg till i theme.liquid (hela webbplatsen)

Detta lägger till chattboten på varje sida i din butik. Följ dessa detaljerade steg:

Steg 1: Gå till din Shopify-admin och välj Onlinebutik > Teman

Steg 2: Klicka på Anpassa bredvid ditt aktiva tema
Steg 3: Klicka på de 3 prickarna (⋯) uppe till vänster och välj Redigera kod

Steg 4: Leta upp din theme.liquid-fil i Layout-mappen (/layout/theme.liquid)

Steg 5: Klistra in Integrationskoden precis före den avslutande </body>-taggen
Steg 6: Spara dina ändringar genom att trycka Ctrl + S (eller Cmd + S på Mac)

Efter att du sparat, besök din butik och uppdatera sidan. Chattboten ska nu synas på alla sidor.

Viktiga noteringar:

• Att klistra in koden före </body> säkerställer att widgeten laddas på varje sida
• Låt FlowHunt-koden vara oförändrad
• Chattboten syns på alla sidor i din butik

Alternativ B — Lägg till via Custom Liquid-sektion (specifika sidor)

Detta gör att du kan visa chattboten endast på utvalda sidor eller mallar. Perfekt om du bara vill ha chattboten på produktsidor eller specifika landningssidor.

Steg 1: Gå till Onlinebutik > Teman och klicka på Anpassa bredvid ditt aktiva tema

Steg 2: Navigera till den specifika mall du vill lägga till chattboten på (t.ex. Produktsidor, Kollektionssidor, eller en specifik sida)

Steg 3: Klicka på Lägg till sektion eller Lägg till block (beroende på ditt tema)
Steg 4: Leta upp och välj Custom Liquid bland alternativen
Steg 5: Klistra in din FlowHunt Integrationskod i Custom Liquid-innehållet

Steg 6: Klicka på Spara och sedan Förhandsgranska för att testa chattboten på just den mallen

Viktiga noteringar:

• Denna metod ger dig exakt kontroll över var chattboten visas
• Du måste upprepa stegen för varje mall där du vill ha chattboten
• Perfekt för att testa chattboten på specifika sidor innan du lanserar på hela webbplatsen
• Chattboten syns endast på de mallar du har konfigurerat

Verifiering och testning

• Öppna din butik i ett inkognitofönster/privat läge för att undvika cachade resurser.
• Ställ vanliga frågor (leverans, returer, produktillgänglighet) för att kontrollera flödet.
• Granska samtalsloggarna i FlowHunt (aktivera Verbose om nödvändigt) för att se vilka dokument eller verktyg som användes.

Felsökning

• Chattboten visas inte: Kontrollera att Integrationskoden är inkluderad på sidan, att ditt tema är publicerat och att domänen är tillåten i Chattbotar-inställningarna.
• Dubbla widgets: Ta bort eventuella dubbla kodsnuttar och behåll endast en aktiv Integrationskod.
• Saknade svar: Kontrollera Kunskapskällor och inställningar för Document Retriever i ditt flöde, och publicera igen.
• Shopify-behörighetsfel: Återanslut Shopify under FlowHunt → Integrationer och installera om vid behov.