Come aggiungere il chatbot IA Asyntai a ProcessWire

Guida passo passo per siti web ProcessWire CMS

Piattaforma:

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: aggiungi al file del template (consigliato)

ProcessWire utilizza file di template PHP situati nella directory site/templates/. L'approccio più semplice è aggiungere il codice di incorporamento direttamente al tuo file di template principale:

Accedi ai file della tua installazione ProcessWire tramite FTP, SSH o il tuo gestore file
Vai a site/templates/
Apri il tuo file di template principale — spesso è _main.php o basic-page.php a seconda del profilo del tuo sito
Se stai usando la strategia di output ritardato (predefinita per la maggior parte dei profili del sito), apri _main.php
Trova il tag di chiusura </body>
Incolla il tuo codice di incorporamento Asyntai subito prima:

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

Suggerimento: Posizionare lo script subito prima del tag di chiusura </body> garantisce che il chatbot si carichi dopo il contenuto della pagina, il che è consigliato per prestazioni ottimali e non rallenterà il rendering della pagina.

Metodo alternativo 1: uso di _foot.inc o file append _main.php

Se il tuo sito ProcessWire utilizza l'approccio del file append (comune in molti profili del sito), puoi aggiungere il codice di incorporamento all'inclusione del footer condiviso:

Vai a site/templates/
Apri _foot.inc (o il tuo file di inclusione del footer equivalente)
Incolla il tuo codice di integrazione Asyntai appena prima del tag di chiusura </body>
Salva il file

La strategia di output ritardato di ProcessWire funziona tipicamente con tre file chiave:

_init.php — viene eseguito prima di ogni template, inizializza le variabili
Il tuo file di template (es., basic-page.php) — popola le variabili di contenuto
_main.php — produce il markup HTML finale usando quelle variabili

Se il tuo sito utilizza questo approccio, aggiungere lo script a _main.php prima di </body> garantisce che appaia su ogni pagina.

Nota: I nomi dei file _init.php e _main.php sono configurati nel tuo site/config.php tramite le impostazioni $config->prependTemplateFile e $config->appendTemplateFile. Controlla la tua configurazione se i tuoi file hanno nomi diversi.

Metodo alternativo 2: uso dell'array $config->scripts

ProcessWire fornisce un FilenameArray $config->scripts che puoi usare per gestire i file JavaScript. Nel tuo _init.php o nel file di template individuale, aggiungi:

<?php
$config->scripts->add('https://asyntai.com/static/js/chat-widget.js');
?>

Quindi nel tuo _main.php (o nell'inclusione del footer), esegui un ciclo attraverso l'array degli script per visualizzarli:

<?php foreach($config->scripts as $file): ?>
<script src="<?php echo $file; ?>"></script>
<?php endforeach; ?>

Importante: L'approccio $config->scripts gestisce l'attributo src dello script, ma l'attributo data-asyntai-id deve essere gestito separatamente. Dovrai aggiungere l'attributo data manualmente nell'output del ciclo, oppure usare il metodo del tag script diretto del passaggio 2 per la configurazione più semplice.

Metodo alternativo 3: uso di un hook (ready.php)

Per un approccio più avanzato, puoi usare il sistema di hook di ProcessWire per iniettare automaticamente lo script del chatbot in ogni pagina. Aggiungi quanto segue al tuo file site/ready.php:

<?php
$wire->addHookAfter('Page::render', function(HookEvent $event) {
    $html = $event->return;
    $script = '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>';
    $html = str_replace('</body>', $script . '</body>', $html);
    $event->return = $html;
});
?>

Questo hook intercetta l'output HTML renderizzato di ogni pagina e inietta automaticamente lo script Asyntai subito prima del tag di chiusura </body>.

Suggerimento: L'approccio con hook ready.php è ideale se vuoi il chatbot su ogni pagina senza modificare alcun file di template. Sopravvive anche ai cambiamenti dei template e agli aggiornamenti del tema poiché risiede al di fuori dei file di template.

Passaggio 3: verifica l'installazione

Dopo aver salvato le modifiche, visita il tuo sito ProcessWire 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 tutti i file modificati. Prova a svuotare la cache del browser o a visualizzare in una finestra di navigazione in incognito. Se la cache dei template di ProcessWire è abilitata, potrebbe essere necessario svuotarla andando su Modules → Core → Template Engine Cache o aggiungendo ?nocache=1 al tuo URL. Verifica anche che il tuo file di template sia effettivamente utilizzato dalle pagine che stai visualizzando.