# AX - Button Dialog

## Panoramica

**AX - Finestra Di Dialogo Pulsante** è un componente di Experience Cloud che apre una finestra modale quando viene cliccato sulle pagine di Experience Sites, mostrando contenuti senza spostare gli utenti dalla pagina corrente.

Usalo per mostrare dettagli aggiuntivi, contenuti video, messaggi di conferma, moduli o avvisi che appaiono in sovrapposizione. Inserisci qualsiasi componente di Experience Cloud all'interno della modale per costruire il contenuto del popup in Experience Builder.

Perfetto per dettagli "Scopri di più", dimostrazioni video, termini e condizioni, richieste di conferma o qualsiasi contenuto che deve apparire temporaneamente sopra la pagina corrente nel tuo portale.

<figure><img src="/files/306743490b10a570cad4d4f41b0bc84c18ba5e02" alt=""><figcaption></figcaption></figure>

***

## Configurazione del Button Dialog di Avonni

### **Rendere eccellente il tuo Button Dialog**

1. **Aggiungi il componente:** Trova il componente Avonni Button Dialog e trascinalo sul tuo sito web.
2. **Fallo apparire al meglio:** Puoi cambiare il testo del pulsante (l'etichetta), lo stile colore (la variante) e qualsiasi altro dettaglio visivo desideri.
3. **Clicca e crea:** Una finestra popup (una modale) apparirà quando clicchi il pulsante. Puoi trascinare ogni tipo di elemento interessante in questa finestra, come il componente Avonni Video o altre cose utili.

### **Impostazioni extra**

* **Nascondi Intestazione:** Rimuove la barra del titolo nella parte superiore della finestra popup.
* **Dimensione:** Scegli quanto grande o piccola vuoi che sia la finestra popup.
* **Mostra Piè di pagina:** Aggiunge una sezione nella parte inferiore del popup – ottima per pulsanti come "OK" o "Annulla".
* **Padding di contenuto ritratto:** Controlla lo spazio tra gli elementi all'interno della finestra e i bordi della finestra.

<figure><img src="/files/3add415e4770389149bbd2125f9db05627281eaa" alt=""><figcaption></figcaption></figure>

***

## Impostazioni

{% tabs %}
{% tab title="Configurazione del pulsante" %}

| Nome                         | Descrizione                                                                                                                  |
| ---------------------------- | ---------------------------------------------------------------------------------------------------------------------------- |
| **Etichetta**                | Testo visualizzato sul pulsante.                                                                                             |
| **Nome Icona**               | Il nome dell'icona del Lightning Design System da visualizzare sul pulsante.                                                 |
| **Posizione Icona**          | La posizione dell'icona rispetto all'etichetta; le opzioni sono 'left' o 'right'.                                            |
| **Variante**                 | Definisce l'aspetto del pulsante, come 'brand', 'neutral', ecc., secondo gli stili predefiniti nel Salesforce Design System. |
| **Allineamento Orizzontale** | Allinea orizzontalmente il pulsante all'interno del suo contenitore; le opzioni includono 'left', 'center' o 'right'.        |
| **Allunga**                  | Determina se il pulsante dovrebbe espandersi per riempire la larghezza del suo contenitore.                                  |
| **Disabilitato**             | Disabilita il pulsante, impedendo l'interazione dell'utente.                                                                 |
| {% endtab %}                 |                                                                                                                              |

{% tab title="Configurazione della finestra di dialogo" %}

| Nome                      | Descrizione                                                                                           |
| ------------------------- | ----------------------------------------------------------------------------------------------------- |
| **Nascondi Intestazione** | Attiva o disattiva la visibilità dell'intestazione della dialog.                                      |
| **Dimensione**            | Imposta la dimensione della dialog; le opzioni possono includere '`piccola`', '`media`', o '`grande`. |
| **Mostra Piè di pagina**  | Determina se visualizzare il piè di pagina della dialog, che può contenere pulsanti di azione.        |

{% endtab %}

{% tab title="🎨 Stile" %}

| Nome              | Descrizione                                                               |
| ----------------- | ------------------------------------------------------------------------- |
| **Intestazione**  | Specifica il colore di sfondo dell'intestazione della dialog.             |
| **Contenuto**     | Imposta il colore di sfondo per l'area contenuti principale della dialog. |
| **Piè di pagina** | Definisce il colore di sfondo per l'area del piè di pagina.               |

{% endtab %}
{% endtabs %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-it/experience-components/ax-button-dialog.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.