Shopify-integration

Tilføj ChatReact AI-chatbots, kontaktformularer og FAQ-akkordeoner til din Shopify-butik med den officielle ChatReact Shopify-app.

Installation

1. Installer ChatReact-appen fra Shopify App Store
2. Åbn appen i din Shopify-administrationspanel

Der er ikke behov for en separat konto-forbindelse — du knytter appen til dine chatbots og formularer ved at indsætte deres ID'er fra ChatReact-dashboardet.

Funktioner

Shopify-appen tilbyder tre widget-typer:

Opsætning af Chat Widget

Opsætning af chat-widget tager to trin: opret en widget-tilknytning i ChatReact-appen, og aktiver derefter App Embed i dit tema.

Trin 1: Opret en widget-tilknytning

1. Åbn ChatReact-appen i din Shopify-administration
2. På fanen Chat Widget klik på Add Assignment
3. Indtast dit Chatbot ID (findes i ChatReact-dashboardet under Settings → Embed)
4. Klik på Save Assignment

Trin 2: Aktiver App Embed

1. Gå til Online Store → Themes → Edit theme
2. Klik på ikonet App embeds (puslespilsbrik) i nederste venstre sidebjælke
3. Skift ChatReact Chat Widget til ON
4. Klik på Save

Chat-widgetten vises på alle sider, der dækkes af en af dine widget-tilknytninger.

Widget-tilknytninger

Hver tilknytning linker en chatbot til din butik. Der er to tilknytningstyper:

• Everywhere: Widget vises på alle sider (standard). Du kan valgfrit tilføje Exclude URLs — én sti per linje, med understøttelse af * wildcard (f.eks. /blogs/*)
• Specific Page: Widget vises kun på den sidesti, du indtaster (f.eks. /pages/about)

Hvis en side har sin egen Specific Page-tilknytning, vises den pågældende chatbot der i stedet for Everywhere-chatbotten.

Tilføjelse af Form- og FAQ-widgets

Form- og FAQ-widgets tilføjes som App Blocks i Theme Editor:

1. Gå til Online Store → Themes → Edit theme
2. Naviger til den side, hvor du vil have widgetten
3. Klik på Add block og søg efter "ChatReact"
4. Vælg ChatReact Form eller ChatReact FAQ
5. Indtast Form ID eller Chatbot ID i blokkens indstillinger

Manuel embed (Liquid)

Hvis du foretrækker at redigere skabeloner direkte, kan du også tilføje widgetterne til enhver Liquid-skabelon:

<!-- Form widget -->
<div id="chatreact-form"></div>
<script src="https://www.chatreact.ai/embed/form.js"
  data-form-id="YOUR_FORM_ID"
  data-container="chatreact-form"
  async></script>

<!-- FAQ widget -->
<div id="chatreact-faq"></div>
<script src="https://www.chatreact.ai/embed/faq-widget.js"
  data-chatbot-id="YOUR_CHATBOT_ID"
  data-container="chatreact-faq"
  async></script>

Styling af Form Widget

Tilpas formularens udseende i Theme Editor:

Styling af FAQ Widget

Håndtering af widgets

ChatReact-appen i din Shopify-administration giver tre faner:

1. Chat Widget — Opret og administrer widget-tilknytninger, der styrer hvilke sider der viser chat-widgetten
2. Forms — Trin-for-trin indlejringsinstruktioner, den manuelle Liquid-snippet, og hvor du finder dit Form ID
3. FAQ Widget — Indlejringsinstruktioner for FAQ-widgetten og hvor du finder dit Chatbot ID

Valg af Form og FAQ foretages i Theme Editor: indtast Form ID eller Chatbot ID i blokkens indstillinger.

Sprogunderstøttelse

Appen understøtter alle 24 EU-sprog:

• Chat-widgetten registrerer automatisk hver besøgendes browsersprog og sammenligner det med din chatbots understøttede sprog, med fallback til chatbotens primære sprog
• Form- og FAQ-blokkene har hver deres Language-indstilling i Theme Editor — den er standardindstillet til Auto-detect og kan overskrives pr. blok

Afinstallation

Når du afinstallerer ChatReact-appen, bliver alle widget-konfigurationer og gemte data automatisk ryddet op i din Shopify-butik.

Næste skridt

• Widget Embedding →
• FAQ Management →
• Form Configuration →