> For the complete documentation index, see [llms.txt](https://docs.aisuru.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.aisuru.com/istruzione-gestione-contenuti-agenti/istruzione-sezione-avanzata/html-messaggi.md).

# Formattazione dei messaggi: HTML e formule matematiche

AIsuru offre potenti strumenti di formattazione che ti consentono di arricchire le risposte del tuo Agente con HTML e formule matematiche, creando esperienze conversazionali più ricche e interattive.

### Codice HTML nei messaggi

L'HTML nei messaggi viene interpretato e visualizzato automaticamente quando il messaggio viene mostrato. Non devi abilitare alcuna impostazione specifica: basta includere il codice HTML desiderato nella risposta dell'Agente.

#### Come usare l'HTML nel tuo Agente

Per utilizzare questa funzionalità, inserisci semplicemente il codice HTML:

* **Nella** [**risposta del tuo contenuto**](/istruzione-gestione-contenuti-agenti/contenuti/creazione-manuale-dei-contenuti.md#how-to-create-a-simple-content)**:** in questo caso, il codice HTML sarà sempre lo stesso (utile, ad esempio, per i moduli);
* **Nelle** [**Istruzioni IA**](/ai-generativa/prompt-engineering.md)**:** ricorda di spiegare all'IA generativa quando e come utilizzare il tuo codice HTML.

{% hint style="info" %} <mark style="color:blue;">Una volta fatto, assicurati di testarlo per confermare che il codice venga visualizzato correttamente. Per implementazioni più complesse, ricorda che puoi</mark> <mark style="color:blue;">**aggiungere codice JavaScript e CSS negli**</mark> [<mark style="color:blue;">**snippet di codice eseguibili**</mark>](/istruzione-gestione-contenuti-agenti/istruzione-sezione-avanzata/personalizzazione-dei-contenuti/gestione-dei-testi-preformattati-snippet-di-codice.md)<mark style="color:blue;">.</mark>
{% endhint %}

#### Esempio: visualizzare immagini da un sito web

Ecco un esempio di come istruire l'Agente a mostrare le immagini che trova in una determinata pagina web:

{% code fullWidth="false" %}

```
When the user asks to see a photo:
1. Call the "photo_album" function;
2. Read the photo names returned by the function;
3. Find the photo the user asked to see and remember the path
and filename (/img/example.png)
4. Respond by including the HTML code that lets the user see the photo

HTML code to show the photo to the user:
<img style="max-width: 100%; height: auto;" src="XXX">

REMEMBER TO REPLACE XXX with the absolute path of the image!
So not ".../img/example.png" but "www.[example].org/img/example.png"
```

{% endcode %}

### Formule matematiche

AIsuru supporta la visualizzazione di formule matematiche tramite MathJax. Puoi includere formule matematiche in due modi:

* **Nei contenuti**:
  * Racchiudi la formula tra parentesi quadre;
  * Esempio: \[E = mc^2] verrà visualizzato come formula matematica;
  * Puoi usare la sintassi LaTeX per formule complesse: \[\frac{-b \pm \sqrt{b^2-4ac}}{2a.}]
* **Nelle Istruzioni IA**:
  * Puoi istruire l'IA a generare formule matematiche;
  * Specifica nelle istruzioni che deve usare la sintassi LaTeX per le formule matematiche;
  * L'IA genererà automaticamente le formule nel formato corretto.

### Vantaggi della formattazione avanzata

L'integrazione di HTML e formule matematiche nelle risposte dell'Agente offre diversi vantaggi:

* **Presentazione di informazioni complesse** in modo strutturato e visivamente accattivante;
* **Visualizzazione di formule matematiche** in un formato professionale e leggibile;
* Creazione di **esperienze interattive** direttamente nella chat.

### Copia dei messaggi formattati

AIsuru fornisce due pulsanti di copia che appaiono in ogni risposta:

* **Copia contenuto**: copia il testo del messaggio renderizzato e formattato (solo testo semplice).
* **Copia codice sorgente**: copia il testo originale con tutti i tag HTML o la formattazione Markdown;

Questa funzionalità è particolarmente utile quando:

* Devi riutilizzare codice HTML o Markdown;
* Devi condividere sia la visualizzazione renderizzata sia il codice sorgente di una risposta.

Ad esempio, quando copi una risposta di un Agente che contiene un'immagine, il pulsante "**Copia contenuto**" copierà solo il testo descrittivo, mentre "**Copia codice sorgente**" includerà anche il tag HTML dell'immagine con il relativo URL.

Sfruttando questa potente funzionalità, puoi trasformare le conversazioni con il tuo Agente da semplici scambi di testo a esperienze ricche e coinvolgenti per i tuoi utenti.