Documentatie

Shopify

Voeg je agent toe aan elke Shopify-winkel door de embedcode in je thema te plakken.

Voeg je AI-agent toe aan een Shopify-winkel door de embedcode te plakken in het theme.liquid-bestand van je thema. Werkt met elk Shopify-plan.

Haal eerst je embedcode op via Chatbot > Publiceren in het dashboard.

Methode 1: theme.liquid bewerken (aanbevolen)

Voeg de widget site-breed toe door je gepubliceerde thema te bewerken:

  1. Ga in de Shopify-admin naar Online Store → Themes.
  2. Klik op de rij van je live thema op het menu ... (Actions) → Edit code.
  3. Open theme.liquid in de map Layout aan de linkerkant.
  4. Scroll naar beneden en plak je embedcode net vóór de afsluitende </body>-tag.
  5. Klik op Save.

Voorbeeldformaat (gebruik de echte waarden van Chatbot > Publiceren):

<script
  src="YOUR_WIDGET_URL"
  data-chatbot="YOUR_CHATBOT_ID"
  async
></script>

De widget verschijnt op elke pagina van je storefront — product, collectie, winkelwagen, homepage.

Methode 2: eerst dupliceren, dan bewerken

Wil je een veilige terugvaloptie:

  1. Online Store → Themes.
  2. Klik op je live thema op het menu ... (drie stipjes) → Duplicate. Onderaan de themalijst verschijnt een kopie.
  3. Bewerk theme.liquid van de kopie zoals hierboven.
  4. Klik op het menu ... bij de kopie → Preview om te testen.
  5. Klik, als je tevreden bent, op het menu ... → Publish om het live te zetten.

Methode 3: plakken op een specifieke pagina

Om de widget alleen op één pagina toe te voegen (bijv. een supportpagina):

  1. Ga in de Shopify-admin naar Online Store → Pages.
  2. Open de pagina die je wilt bewerken.
  3. Klik op het <>-icoon (Show HTML) in de content-editor.
  4. Plak je embedcode aan het einde van de inhoud.
  5. Save.

De widget laadt dan alleen op die pagina.

Vereisten

  • Het thema dat je bewerkt, moet een gepubliceerd of betaald thema zijn. Code van een proefthema kan niet worden opgeslagen.
  • Je storefrontdomein moet in de lijst met toegestane domeinen van je agent staan als je domeinbeperkingen hebt ingeschakeld.

Na het publiceren

Shopify levert storefrontassets via zijn CDN. Wijzigingen zijn binnen een minuut of twee zichtbaar. Zie je de widget niet:

  1. Ververs de pagina hard (⌘+Shift+R op Mac, Ctrl+F5 op Windows).
  2. Open de site in een incognitovenster.
  3. Controleer de browserconsole op foutmeldingen.

Problemen oplossen

Widget verschijnt niet.

  • Controleer of je het live thema hebt bewerkt (of de kopie hebt gepubliceerd).
  • Controleer of de snippet vóór </body> staat, niet binnen <head>.
  • Controleer of je storefrontdomein is toegestaan bij Chatbot > Publiceren > Beveiliging.

Widget overlapt de chat of winkelwagenlade van Shopify.

  • Pas de widgetpositie aan in de Ontwerp-instellingen van je agent.

Widget verschijnt in de editor, maar niet in de live winkel.

  • Zorg dat je na het plakken op Save hebt geklikt — de code-editor slaat niet automatisch op.

Testen

  1. Open je storefront in een incognitovenster.
  2. Zoek naar de chatbubbel in de hoek.
  3. Klik om te openen en verstuur een testbericht.

Verbind een winkel voor bestelopzoekingen en productzoekopdrachten

De widget insluiten en je winkel verbinden zijn twee aparte dingen. De embedcode hierboven plaatst de chatwidget op je storefront. Een aparte Shopify-verbinding — gemaakt vanuit het tabblad Acties → Integrations van je agent — laat de agent bovendien je live catalogus doorzoeken en de status van een bestelling opzoeken tijdens het gesprek.

Je kunt elk van beide los gebruiken. Gebruik alleen de embed als de agent uitsluitend vanuit je trainingsinhoud moet antwoorden, en voeg de winkelverbinding toe wanneer je live product- en bestelgegevens wilt.

Het verbinden van de winkel levert alleen de inloggegevens, maar schakelt op zichzelf niets in: voeg daarna onder het tabblad Acties van je agent de acties Producten zoeken en Bestelstatus opvragen toe en schakel elke actie in die je de agent wilt laten gebruiken.

Stel Shopify-acties in →

Volgende stappen