Hoe voegt u de Asyntai AI-chatbot toe aan HubSpot

Stapsgewijze handleiding voor HubSpot CMS-websites

Insluitcode ophalen

Stap 1: Uw insluitcode ophalen

Ga eerst naar uw Asyntai Dashboard en scroll naar het gedeelte "Insluitcode". Kopieer uw unieke insluitcode die er als volgt uitziet:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Opmerking: De bovenstaande code is slechts een voorbeeld. U moet uw eigen unieke insluitcode kopiëren vanuit uw Dashboard omdat deze uw persoonlijke widget-ID bevat.

Stap 2: Site-instellingen gebruiken (aanbevolen)

De eenvoudigste manier om de chatbot aan alle pagina's van uw HubSpot-website toe te voegen:

  1. Log in op uw HubSpot-account
  2. Klik op het instellingenpictogram (tandwiel) in de hoofdnavigatiebalk
  3. Navigeer in de linkerzijbalk naar Website > Pages
  4. Scroll down to the "Site footer HTML" section
  5. Plak uw Asyntai-insluitcode in het tekstveld
  6. Klik op "Save" onderaan de pagina

Tip: Het toevoegen van het script aan de Site footer HTML zorgt ervoor dat het op alle pagina's na de hoofdinhoud wordt geladen, wat de aanbevolen plaatsing is voor chatwidgets.

Alternatief: Paginaspecifieke installatie

Als u de chatbot alleen op specifieke pagina's wilt:

  1. Ga naar Marketing > Website > Website Pages (of Landing Pages)
  2. Klik op de pagina die u wilt bewerken
  3. Klik in de pagina-editor op Settings bovenaan
  4. Scroll naar beneden naar "Advanced options"
  5. Zoek de sectie "Footer HTML"
  6. Plak uw Asyntai-insluitcode
  7. Klik op "Apply changes" en publiceer uw pagina

Opmerking: Paginaspecifieke code wordt alleen op die specifieke pagina geladen. Gebruik deze methode als u de chatbot op bepaalde pagina's wilt in plaats van op uw hele site.

Alternatief: Design Manager gebruiken

Voor meer controle kunt u een JavaScript-bestand toevoegen via de Design Manager:

  1. Go to Marketing > Files and Templates > Design Tools
  2. Klik in de linkerzijbalk op File > New file
  3. Selecteer "JavaScript" in het dropdownmenu
  4. Geef uw bestand een naam (bijv. asyntai-chatbot.js)
  5. Voeg de volgende code toe:
    (function() {
      var script = document.createElement('script');
      script.async = true;
      script.src = 'https://asyntai.com/static/js/chat-widget.js';
      script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
      document.body.appendChild(script);
    })();
  6. Vervang YOUR_WIDGET_ID door uw werkelijke widget-ID
  7. Klik op "Publish changes"
  8. Voeg dit bestand toe aan uw template met behulp van require_js of koppel het in uw site-instellingen

Alternatief: Aangepaste modules gebruiken

Maak een herbruikbare module voor de chatbot:

  1. Go to Marketing > Files and Templates > Design Tools
  2. Klik op File > New file > Module
  3. Noem het "Asyntai Chatbot"
  4. Plak uw insluitcode in het bestand module.html
  5. Publiceer de module
  6. Voeg de module toe aan de footersectie van uw template, of sleep deze naar individuele pagina's

Tip: Met een aangepaste module kunt u de chatbot eenvoudig toevoegen aan of verwijderen van specifieke templates of pagina's via de drag-and-drop-editor.

Stap 3: Installatie verifiëren

Bezoek na het opslaan van uw wijzigingen uw HubSpot-website in een nieuw browsertabblad of incognitovenster. U zou de chatwidgetknop rechtsonder in de hoek moeten zien. Klik erop om te controleren of deze correct opent en werkt.

Ziet u de widget niet? Zorg ervoor dat u op "Save" of "Publish" hebt geklikt na het toevoegen van de code. HubSpot cachet pagina's, dus probeer uw site te bekijken in een incognitovenster of wis uw browsercache. Als u de code aan een specifieke pagina hebt toegevoegd, zorg er dan voor dat die pagina gepubliceerd is.

HubSpot CMS Hub vereist: Het toevoegen van aangepast JavaScript vereist HubSpot CMS Hub (Starter, Professional of Enterprise). Als u de gratis HubSpot CMS-tools gebruikt, heeft u mogelijk beperkte mogelijkheden voor het toevoegen van aangepaste scripts.