Come aggiungere più widget a un sito Web con JavaScript

Puoi aggiungere più widget a un sito web aggiungendo un codice widget a ciascuna pagina.


Tuttavia, se hai dimestichezza con il codice o hai uno sviluppatore nel tuo team, c'è un modo più veloce per aggiungere più widget a un sito web di grandi dimensioni.


In questo articolo, ti mostreremo come modificare il codice del tuo widget in modo che il widget caricato su ogni pagina sia basato su una funzione e condizioni impostate da te. Ad esempio, su un sito multilingue, è possibile modificare il codice del widget per caricare automaticamente un widget in base alla lingua della pagina.


Per iniziare, avrai bisogno dell'ID del tuo widget e della tua proprietà.

Qual è la differenza tra una proprietà e un widget?

Ecco una breve spiegazione della differenza tra una proprietà e un widget:


Una proprietà è rappresentata da un insieme di dati e impostazioni. Può essere associata a un sito Web, un'azienda, un'organizzazione o persino un evento. La creazione di una nuova proprietà consente di impostare una nuova Knowledge Base, widget, messaggi di attivazione, scorciatoie, agenti, schede e altro. I componenti aggiuntivi devono essere acquistati separatamente per ogni proprietà.


Un widget è l'interfaccia utente, in cui i visitatori possono chattare, lasciare messaggi e accedere a qualsiasi contenuto condiviso tramite le schede widget tawk.to. Ogni proprietà può avere fino a 20 widget. Puoi personalizzare il contenuto, il design, la lingua e le impostazioni di visibilità di ogni singolo widget. Se hai acquistato componenti aggiuntivi, funzioneranno per tutti i widget di chat appartenenti alla  stessa proprietà.


La creazione di una nuova proprietà consente di creare una nuova KB, modificare i messaggi dei trigger, le scorciatoie, assegnare gli agenti e altro ancora. I componenti aggiuntivi devono essere acquistati separatamente per ogni proprietà.


Nota: solo un widget alla volta può funzionare sullo stesso sito web. Gli esempi seguenti caricano una singola proprietà/widget in base ai criteri scelti. Per utilizzare questo metodo, dovrai rimuovere il plug-in di WordPress, se attualmente in uso.

Personalizzazione del codice per la tua proprietà e widget

Per cambiare il widget che viene caricato sulla tua pagina, modifica il seguente attributo src in base al widget che desideri incorporare:

Nei seguenti esempi, chatId è composto da 'ID-tua- Proprietà/ID-tuo-widget' che viene risolto dalla funzione getChatId.


Puoi trovare l'ID della tua proprietà nella Panoramica della Proprietà. Vai su Pannello di Controllo⮕ Amministrazione ⮕ Panoramica Proprietà e copia l'ID della tua proprietà.

Per trovare l'ID del tuo widget, vai su Pannello di Controllo⮕ Amministratore ⮕ Chat Widget.


Seleziona il widget che desideri incorporare nel menu a discesa Chat Widget. Quindi copia il codice nell'ultima sezione del tuo link diretto alla chat.

Ecco dove aggiungere l'ID proprietà e l'ID widget:

Per cambiare il widget, cambia l'ID del widget alla fine del codice.


Per modificare sia la proprietà che il widget, dovrai fornire opzioni sia per l'ID proprietà che per l'ID widget.


Ecco il risultato dell' utilizzo dell'ID proprietà e dell'ID widget negli esempi precedenti:

Ecco come modificare il codice del tuo widget per poter includere più widget

Ecco un'utilizzo standard del codice di incorporamento del widget.

In ogni esempio, l'unico scopo della funzione getChatId è quello di fornire l'id della chat per il caricamento del codice di incorporamento. Puoi modificare la funzione in base a qualsiasi criterio. Vedi i modelli 2 e 3 per esempi basati sulla lingua della pagina.

Casi d'uso

L'articolo ti è stato d'aiuto?

A 60 su 91 è piaciuto quest'articolo

Hai ancora bisogno d'aiuto? Inviaci un messaggio