> ## Knowledge Base Index > Fetch the complete knowledge base index at: https://ajuda.greatsoftwares.com.br/sitemap.xml > Use this file to discover available pages before exploring further. > Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash). # Cómo agregar BOTONES en GreatPages Sigue el paso a paso para agregar un **botón** en tu página en el **GreatPages**. 1. Accede a tu editor de página; ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_zb23ee.png =650x380) 2. Necesitarás hacer clic en el **ícono de botón**, en el menú lateral izquierdo de la pantalla; ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_1xtirga.png =650x630) 3. Enseguida, el botón será insertado en la página. Podrás editarlo como quieras. Si haces clic en el botón **"Editar"** se abrirá una pantalla en el lado derecho de la pantalla, donde podrás editar los *Estilos* del botón (su parte visual), insertar *animaciones* y *configurarlo* (agregar scripts directo en el botón - edición avanzada). ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_r31we1.png =650x318) ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/image_canxzd.png =650x738) ###### ENLACE Ahora, para agregar un enlace en el botón necesitarás hacer clic en la sección de **"Enlace"**, y hace un clic en el botón **"Añadir enlace"** indicada en la imagen abajo. ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_1pgeqz7.png =650x612) Podrás optar por agregar un **Enlace Externo** (otra URL, fuera de esta página), **Enlace Interno** (vincular el clic en el botón a un bloque específico dentro de la misma página) o **Pop-up** (caja que se abrirá en la pantalla al accionar el clic). ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_1w9ejxe.png =650x600) ###### ESTILOS Debajo de la configuración de enlaces de página, tenemos la configuración de estilo, comenzando con: ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_1pp6h2e.png =650x654) * **Estilo del texto**: El estilo de texto determina el tamaño de la fuente en comparación con la configuración del Design System de la página. * **Color del botón**: Aquí puedes configurar cuál será el color de fondo del botón y el color del texto del botón. Recuerda que el color elegido seguirá el estilo de todos los demás botones de la página, a menos que guardes un color nuevo para este botón. * **Color de hover**: Color aplicado al pasar el cursor sobre el botón. Por defecto, el color utilizado automáticamente contrasta con el color del botón. * **Contenido**: Texto de acción utilizado en el botón de conversión del formulario. ###### BORDE Y SOMBRA Si sigues desplazándote hacia abajo en la pantalla de configuración de estilo, verás las opciones de configuración de borde y sombra. ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-08-as-_h1kmk0.png =650x666) * **Borde**: En esta parte configuras mejor los bordes del botón, dejándolo más o menos redondeado de acuerdo con la cantidad de píxeles. * **Sombra**: Efecto de sombra alrededor del botón. ###### ANIMACIÓN ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-08-as-_1actz9v.png =650x619) * **Efecto**: Selecciona el estilo de efecto deseado para el elemento. Al alternar entre los efectos, podrás ver cómo funciona cada uno. * **Dirección**: Aquí puedes configurar cuál será la dirección de la animación, por ejemplo: hacia arriba, hacia abajo, hacia la derecha o hacia la izquierda. * **Velocidad**: Donde definirás cuál será la velocidad de tu animación. Cuanto más cerca de 250ms, más rápida será la velocidad; cuanto más cerca de 2000ms, más lenta será la velocidad de la animación. * **Retraso**: Esta configuración te permite definir el tiempo de retraso de tu animación. Ese tiempo varía de 0ms hasta 2000ms. * **Repetir**: En esta función puedes elegir si la animación aparecerá solo una vez o continuamente. 4. Tras configurar el aspecto visual del botón de acción, puedes hacer clic en "**Configurar**" para cambiar su visibilidad. Esta función es útil si deseas ocultar este elemento en cualquier versión de la página; ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-08-as-_nv37us.png =650x706) 5. Finalmente, si haces clic en "Código", puedes editar el HTML del botón, añadir un script que se ejecutará al hacer clic o copiar el ID de este elemento. Recuerda que estas son funciones avanzadas; úsalas solo si tienes los conocimientos necesarios o si te están enseñando a utilizarlas. ![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-08-as-_dwk2r7.png =650x627) ¡Esperamos haberte ayudado! Cualquier duda ponte en contacto con nuestro equipo. :-)