> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/experience-cloud/experience-cloud-es/experience-components/ax-button-dialog.md).
# AX - Diálogo de botones
## Resumen
**AX - Diálogo de botones** es un componente de Experience Cloud que abre una ventana modal emergente al hacer clic en páginas de Experience Sites, mostrando contenido sin alejar a los usuarios de su página actual.
Úsalo para mostrar detalles adicionales, contenido de video, mensajes de confirmación, formularios o advertencias que aparecen en una superposición. Coloca cualquier componente de Experience Cloud dentro del modal para crear el contenido emergente en Experience Builder.
Perfecto para detalles de «Más información», demostraciones en video, términos y condiciones, mensajes de confirmación o cualquier contenido que necesite aparecer temporalmente sobre la página actual en tu portal.
***
## Configuración del Avonni Button Dialog
### **Hacer que tu Button Dialog sea genial**
1. **Añade el componente:** Encuentra el componente Avonni Button Dialog y arrástralo a tu sitio web.
2. **Haz que se vea genial:** Puedes cambiar el texto del botón (la etiqueta), el estilo de color (la variante) y cualquier otro detalle visual que te guste.
3. **Haz clic y crea:** Aparecerá un cuadro emergente (un modal) cuando hagas clic en el botón. Puedes arrastrar todo tipo de cosas geniales a este cuadro, como el componente de video de Avonni u otras cosas interesantes.
### **Ajustes adicionales**
* **Ocultar encabezado:** Esto elimina la barra de título en la parte superior del cuadro emergente.
* **Tamaño:** Elige qué tan grande o pequeño quieres que sea el cuadro emergente.
* **Mostrar pie de página:** Añade una sección en la parte inferior del emergente, ideal para botones como «Aceptar» o «Cancelar».
* **Relleno interno del contenido:** Esto controla el espacio entre lo que hay dentro del cuadro y los bordes del cuadro.
***
## Configuración
{% tabs %}
{% tab title="Configuración del botón" %}
| Nombre | Descripción |
| ------------------------- | --------------------------------------------------------------------------------------------------------------------------- |
| **Etiqueta** | Texto mostrado en el botón. |
| **Nombre del icono** | El nombre de Lightning Design System del icono que se mostrará en el botón. |
| **Posición del icono** | La posición del icono con respecto a la etiqueta; las opciones son 'izquierda' o 'derecha'. |
| **Variante** | Define la apariencia del botón, como 'brand', 'neutral', etc., según los estilos predefinidos del Salesforce Design System. |
| **Alineación horizontal** | Alinea el botón horizontalmente dentro de su contenedor; las opciones incluyen 'izquierda', 'centro' o 'derecha'. |
| **Estirar** | Determina si el botón debe expandirse para llenar el ancho de su contenedor. |
| **Deshabilitado** | Deshabilita el botón, impidiendo la interacción del usuario. |
| {% endtab %} | |
{% tab title="Configuración del diálogo" %}
| Nombre | Descripción |
| ------------------------- | --------------------------------------------------------------------------------------------------- |
| **Ocultar encabezado** | Alterna la visibilidad del encabezado del diálogo. |
| **Tamaño** | Establece el tamaño del diálogo; las opciones pueden incluir '`pequeño`', '`mediano`', o '`grande`. |
| **Mostrar pie de página** | Determina si se muestra el pie de página del diálogo, que puede contener botones de acción. |
| {% endtab %} | |
{% tab title="🎨 Estilo" %}
| Nombre | Descripción |
| ----------------- | ------------------------------------------------------------------------ |
| **Encabezado** | Especifica el color de fondo del encabezado del diálogo. |
| **Contenido** | Establece el color de fondo del área de contenido principal del diálogo. |
| **Pie de página** | Define el color de fondo del área del pie de página. |
| {% endtab %} | |
| {% endtabs %} | |
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## 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, and the optional `goal` query parameter:
```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-es/experience-components/ax-button-dialog.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
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.