> ## 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 un FORMULARIO en GreatPages

Cómo agregar un formulario en una página de GreatPages.

1. Accede al editor de páginas;

![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_1f3d77o.png =650x380)

2. Haz clic en el ícono de **"Formulario"** que se encuentra 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-_135obzo.png =650x543)

3. Luego se abrirá el elemento de formulario en tu página. Para editarlo, haz un clic en el formulario y haz clic en **"Editar"**;

![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_1mkeand.png =650x528)

4. En el lado derecho de la pantalla se abrirán las opciones de edición. En el menú **"Estilos"** editarás la parte visual del formulario, como:

![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_1sach4h.png =650x311)

###### Títulos y campos

![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/image_18irugq.png =650x452)


* **Posición de los títulos**: En esta configuración definirás si deseas dejar el título del formulario más hacia adentro o hacia afuera;
* **Estilo del texto**: Seleccione la opción de estilo de texto que desee utilizar. La configuración de cada estilo de texto se encuentra en la configuración de la Guía de estilos, en la sección **"Fuentes"**;

###### Estilos de los campos

![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/image_vd65oz.png =650x692)


* **Altura de los campos**: La altura de los campos varía entre 36px y 76px. Cuanto mayor sea la cantidad de píxeles, más distante quedará un campo del otro;
* **Color de fondo**: Color de fondo del campo del formulario;
* **Entre los ítems**: Espacio entre campos;
* **Interno**: Espacio interno entre nombres de campos;
* **Borde**: En la configuración de los bordes, puedes dejarlos redondeados. Cuanto mayor sea la cantidad de píxeles, más redondeado quedará el borde;
* **Sombra**: Efecto de sombra alrededor del texto.

###### Estilos del botón

![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/image_131iuoy.png =650x587)


* **Texto del botón**: Texto de acción utilizado en el botón de conversión del formulario;
* **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;
* **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;
* **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;
* **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/image_gko715.png =650x679)


* **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.

5.  En el menú **"Configurar"** podrás hacer configuraciones más avanzadas:

![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_4cgmd4.png =650x303)

* **Campos del formulario**: Es la opción donde se editan o agregan nuevos campos de formulario. Para anãdir nuevos campos haz un clic en el botón **"Anãdir campo"**;
* **Redirigir a**: Es el campo donde insertas un enlace de redirección y, al hacer clic para enviar el formulario, el visitante será redirigido al enlace configurado;
* **Mensaje de éxito**: Es a través de este campo que configuras el mensaje que aparecerá para tu usuario después del envío del formulario;
* **Integraciones**: Con este campo, integrarás con plataformas de e-mail marketing;
* **Visibilidad**: El campo donde defines si el formulario aparecerá o no en la versión Desktop y Mobile.

6. Y por último, tenemos la configuración del código externo, a la que se puede acceder haciendo clic en **"Configurar"**;

![](https://storage.crisp.chat/users/helpdesk/website/-/a/6/a/b/a6ab90d8350d6000/captura-de-tela-2026-08-07-as-_1w9wrr7.png =650x326)

* **Selector CSS del elemento**: Campo disponible para copiar el ID del bloque;
* **Edita el HTML**: Utilice este campo únicamente si desea editar la apariencia del botón de acción del formulario mediante código.
* **Javascript del botón**: Utilice este campo únicamente si desea agregar código que se ejecute solo cuando se haga clic en este botón.

¡Esperamos haberte ayudado! Ante cualquier duda contacta a nuestro soporte, siempre estamos a disposición. :)