Documentazione

Framer

Aggiungi il tuo agente a un sito Framer usando il codice personalizzato.

Aggiungi il tuo agente AI a un sito Framer tramite codice personalizzato. Lo snippet si carica su ogni pagina una volta pubblicata.

Per prima cosa, ottieni il tuo codice di embed da Chatbot > Pubblica nel pannello.

Configurazione rapida

  1. Apri il tuo progetto in Framer.
  2. Nella barra laterale sinistra, clicca su Project Settings (l'icona a forma di ingranaggio).
  3. Seleziona la scheda Custom Code.
  4. Clicca su + Add Script.
  5. Assegna allo script un nome riconoscibile (ad esempio Widget Agentkit).
  6. Incolla il tuo codice di embed nel corpo dello script.
  7. Nel posizionamento, scegli End of <body> tag (Body End) — questa è l'opzione consigliata per i widget di chat.
  8. Scegli di caricarlo su All pages.
  9. Clicca su Save.
  10. Clicca su Publish in alto a destra per rendere subito attivo l'aggiornamento.

Formato di esempio (usa i valori reali da Chatbot > Pubblica):

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

Perché a fine <body> e non nell'Head

Framer separa il codice personalizzato in Head Code e End of <body> Code. I widget di chat dovrebbero andare a fine <body> per non ritardare il primo rendering della pagina — questo corrisponde anche all'attributo async sullo script.

Head Code è riservato a ciò che deve essere eseguito molto presto, come i pixel di analytics o il preload dei font.

Installazione su pagine specifiche

Per caricare il widget solo su pagine specifiche:

  1. Seleziona una pagina nel pannello dei layer di Framer.
  2. Apri Page Settings (pannello a destra).
  3. Aggiungi il codice personalizzato lì invece che in Project Settings.

Il codice a livello di pagina viene eseguito solo su quella pagina specifica.

Piani e domini

  • Il Custom Code è disponibile sui siti Framer, ma eseguirlo su un dominio personalizzato (diverso da *.framer.website) in genere richiede un piano a pagamento.
  • Il widget funziona sull'URL predefinito *.framer.website se il tuo piano consente il Custom Code su quel dominio.

Dopo la pubblicazione

Il codice personalizzato di Framer non viene eseguito nell'editor o nell'anteprima — solo sul sito pubblicato. Dopo aver cliccato su Save, clicca su Publish e poi apri l'URL live.

Risoluzione dei problemi

Il widget non appare nell'anteprima dell'editor.

  • È normale. Il Custom Code viene eseguito solo sul sito pubblicato.

Il widget non appare nemmeno sul sito pubblicato.

  • Conferma di aver cliccato sia Save sia Publish.
  • Conferma che il tuo dominio sia consentito in Chatbot > Pubblica > Sicurezza.
  • Forza l'aggiornamento (⌘+Shift+R) per bypassare la cache del CDN.

Il widget lampeggia e poi scompare.

  • Controlla se ci sono transizioni di pagina o animazioni di Framer che potrebbero ricaricare il DOM. Il widget dovrebbe rimontarsi a ogni caricamento pagina — se non succede, contatta il supporto.

Test

  1. Apri l'URL pubblicato in una finestra in incognito.
  2. Cerca la chat bubble.
  3. Clicca per aprirla e invia un messaggio di prova.

Prossimi passi