Documentatie

Framer

Voeg je agent toe aan een Framer-site met Custom Code.

Voeg je AI-agent toe aan een Framer-site via Custom Code. De snippet wordt op elke pagina geladen zodra deze gepubliceerd is.

Open in Agentkit Channels → Website embed → Chat widget, schakel het kanaal in en kopieer de volledige gegenereerde code. Die bevat een inline opstartscript en een apart script dat de widget laadt.

Snel instellen

  1. Open je project in Framer.
  2. Klik in de linkerzijbalk op Project Settings (het tandwielicoon).
  3. Selecteer het tabblad Custom Code.
  4. Klik voor je eerste item op Add Script; klik anders op het +-pictogram.
  5. Geef het script een herkenbare naam (bijv. Agentkit Widget).
  6. Plak beide gegenereerde scripttags samen in het veld Custom Code. Laat de script-URL en agent-ID ongewijzigd.
  7. Kies bij plaatsing voor End of <body> tag (Body End) — dit is de aanbevolen optie voor chatwidgets.
  8. Kies ervoor om te laden op All Pages.
  9. Klik op Save.
  10. Klik rechtsboven op Publish om de update live te zetten.

Gebruik geen voorbeeld met één scripttag en typ de widget-URL niet zelf. Controleer na publicatie in de paginabron of beide gegenereerde <script>-tags aanwezig zijn. Open daarna de widget en stuur een testbericht. Handleiding voor de JavaScript-widget →

Waarom End of <body>, niet Head

Framer verdeelt Custom Code in Head Code en End of <body> Code. Chatwidgets horen aan het einde van <body> te staan, zodat ze de eerste render van de pagina niet vertragen — dat sluit ook aan bij het async-attribuut op het script.

Head Code is gereserveerd voor dingen die heel vroeg moeten draaien, zoals analytics-pixels of font-preloads.

Pagina-specifieke installatie

Om de widget alleen op specifieke pagina's te laden:

  1. Selecteer een pagina in het lagenpaneel van Framer.
  2. Open Page Settings (rechterpaneel).
  3. Voeg daar Custom Code toe in plaats van in Project Settings.

Code op paginaniveau draait alleen op die specifieke pagina.

Plannen & domeinen

Na het publiceren

Framer Custom Code draait niet in de editor of preview — alleen op de gepubliceerde site. Klik na Save op Publish en open vervolgens de live-URL.

Problemen oplossen

Widget verschijnt niet in de editorpreview.

  • Dat is normaal. Custom Code draait alleen op de gepubliceerde site.

Widget verschijnt ook niet op de gepubliceerde site.

  • Controleer of je zowel op Save als op Publish hebt geklikt.
  • Controleer de domeinbeperkingen voor je gepubliceerde Framer-domein.
  • Ververs de pagina hard (⌘+Shift+R) om de CDN-cache te omzeilen.

Widget flitst even op en verdwijnt dan.

  • Controleer op paginaovergangen of animaties van Framer die de DOM opnieuw kunnen laden. De widget hoort bij elke paginalading opnieuw te mounten — gebeurt dat niet, neem dan contact op met support.

Testen

  1. Open de gepubliceerde URL in een incognitovenster.
  2. Zoek naar de chatbubbel.
  3. Klik om te openen en verstuur een testbericht.

Volgende stappen