Come aggiungere il chatbot IA Asyntai a Umbraco
Guida passo passo per i siti web Umbraco CMS
Passaggio 1: ottieni il tuo codice di incorporamento
Per prima cosa, vai alla tua Dashboard Asyntai e scorri fino alla sezione "Codice di incorporamento". Copia il tuo codice di incorporamento univoco che apparirà così:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
Nota: Il codice sopra è solo un esempio. Devi copiare il tuo codice di incorporamento univoco dalla tua Dashboard poiché contiene il tuo ID widget personale.
Passaggio 2: Modifica del template Master (consigliato)
Il modo più semplice per aggiungere il chatbot a tutte le pagine è modificare il template Master:
- Accedi al tuo Backoffice Umbraco
- Vai su Settings nella barra laterale sinistra
- Espandi Templates
- Clicca sul tuo template Master (o sul template di layout principale utilizzato dal tuo sito)
- Trova il tag di chiusura
</body> - Incolla il codice di incorporamento Asyntai appena prima del tag
</body> - Clicca su "Save"
Suggerimento: Aggiungere lo script prima del tag di chiusura </body> assicura che venga caricato dopo il contenuto della pagina, come consigliato per i widget di chat, senza rallentare il caricamento della pagina.
Alternativa: Utilizzo del Document Type Site Settings
Per una maggiore flessibilità, puoi aggiungere un campo personalizzato per gestire gli script del footer:
- Vai su Settings → Document Types
- Modifica il tuo document type Site Settings (o creane uno se non esiste)
- Aggiungi una nuova proprietà chiamata "Footer Scripts" con un tipo di dati Textarea
- Salva il Document Type
- Vai su Content e modifica il nodo Site Settings
- Incolla il codice di integrazione Asyntai nel campo Footer Scripts
- Nel tuo template Master, aggiungi questo codice prima di
</body>:@Html.Raw(Model.Value("footerScripts")) - Salva sia il contenuto che il template
Nota: L'utilizzo di @Html.Raw() è importante per renderizzare correttamente i tag script senza codifica HTML.
Alternativa: Utilizzo della cartella Scripts
Puoi anche creare un file JavaScript nel Backoffice di Umbraco:
- Vai su Settings → Scripts
- Clicca con il tasto destro su Scripts e seleziona "Create"
- Crea un nuovo file chiamato asyntai-chatbot.js
- Aggiungi il seguente codice:
(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);
})(); - Sostituisci
YOUR_WIDGET_IDcon il tuo ID widget effettivo - Salva il file
- Includi questo script nel tuo template Master prima di
</body>:<script src="/scripts/asyntai-chatbot.js"></script>
Alternativa: Per pagina specifica con RenderSection
Se vuoi il chatbot solo su pagine specifiche:
- Nel tuo template Master, aggiungi prima di
</body>:@RenderSection("footerScripts", required: false) - In the specific page template where you want the chatbot, add:
@section footerScripts {
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
}
Passaggio 3: verifica l'installazione
Dopo aver salvato le modifiche, visita il tuo sito web in una nuova scheda del browser o in una finestra di navigazione in incognito. Dovresti vedere il pulsante del widget chat nell'angolo in basso a destra. Cliccaci sopra per assicurarti che si apra e funzioni correttamente.
Non vedi il widget? Assicurati di aver salvato il template dopo aver apportato le modifiche. Prova a svuotare la cache del browser o a visualizzare il sito in una finestra di navigazione in incognito. Se utilizzi Umbraco Cloud, le modifiche dovrebbero essere distribuite automaticamente. Per Umbraco self-hosted, potrebbe essere necessario riavviare l'applicazione o svuotare la cache.
Weebly