Diseña y personaliza tu formulario ActiveCampaign

Con ActiveCampaign, puede personalizar formularios para que coincidan con los colores de su marca, agregar imágenes, cambiar la fuente y mucho más.

Obtenga más información sobre los tipos de formularios que puede crear con ActiveCampaign.

Aprenda a crear un formulario.

Acceder a las opciones de personalización del formulario

Las opciones de personalización de un formulario se encuentran en el " Estilo" en el generador de formularios.

Para acceder a esta pestaña para cualquier formulario:

1. Haga clic en "Sitio" en el menú izquierdo de su cuenta.

2. Haga clic en el " Formularios" en el menú Sitio.

3. Localice el formulario con el que desea trabajar y, a continuación, haga clic en el " Editar" botón.

4. El generador de formularios se cargará. Todas las opciones de edición y estilo aparecerán en el panel derecho. Haga clic en la pestaña "Estilo" situada en el panel derecho.

pestaña Estilo en el generador de formularios.

Personalizar un formulario en línea

Con el formulario en línea, puede elegir un diseño y personalizar el estilo para el formulario y el botón de envío.

Diseño

Haga clic en cualquiera de las opciones para elegir un diseño horizontal o vertical para el formulario.

SMCNALLY Email Marketing - Formulario

Estilo de forma

El " Estilo de formulario" cuadro le permite personalizar cómo se mostrará el formulario a los visitantes de su sitio web. Las opciones de personalización de estilo de formulario incluyen:

Opciones de personalización de estilo de formulario Descripción
Fondo Cambie el color de fondo de su formulario o hálo transparente.

Este tipo de formulario no admite imágenes de fondo. 
Color de fuente Cambie el color del texto que aparece en el formulario.
Fuente Cambie el tipo de fuente en el formulario para que coincida con su marca. 
Frontera Utilice esta opción para agregar un borde al formulario. Los bordes se establecen como un valor de píxel. Puede aumentar o disminuir el borde, cambiar el color del borde y seleccionar entre cuatro tipos de bordes diferentes: Sólido, Punteado, Dashed y Doble. 
Radio de esquina Utilice esta opción para redondear o cuadrar las esquinas del formulario. El radio de la esquina se establece como un valor de píxel. 
Ancho Utilice esta opción para ajustar el ancho del formulario. Ancho se establece como un valor de píxel. 

Botón

El " Botón" cuadro le permite personalizar el aspecto del botón de envío de su formulario. Las opciones de personalización de botones incluyen:

Opciones de personalización de botones Descripción
Fondo Cambie el color de fondo del botón Enviar. 
Mensaje de texto Cambie el color del texto del botón. 
Frontera Utilice esta opción para agregar un borde al botón. Los bordes se establecen como un valor de píxel. Puede aumentar o disminuir el borde, cambiar el color del borde y seleccionar entre cuatro tipos de bordes diferentes: Sólido, Punteado, Dashed y Doble. 
Radio de esquina Utilice esta opción para hacer que las esquinas de su botón se redondeen o cuadradas. El radio de la esquina se establece como un valor de píxel. 
Relleno El relleno es el espacio alrededor del botón. Puede utilizar esta opción para aumentar o disminuir el relleno. Esto se establece como un valor de píxel. 

Tenga en cuenta que no podrá ajustar la altura o anchura del botón aquí. Usted necesitará utilizar el CSS personalizado para hacer estos ajustes.

Personalizar un formulario emergente modal

Con el formulario emergente modal, puede elegir un diseño y personalizar el estilo para el formulario, los campos de entrada y el botón enviar.

Diseño

Hay cuatro opciones que puede elegir para su formulario: sin imagen, imagen a la izquierda, imagen en la parte superior o imagen en el centro.

SMCNALLY Email Marketing - Formulario

Estilo Modal

El " Estilo Modal" cuadro le permite personalizar cómo se mostrará el formulario a los visitantes de su sitio web. Las opciones de personalización de estilo modal incluyen:

Opciones de personalización de estilo modal Descripción
Fondo Haga clic en el selector de color para cambiar el color del formulario o agregar una imagen de fondo.
Color de fuente Cambie el color del texto que aparece en el formulario.
Fuente Cambie el tipo de fuente en el formulario para que coincida con su marca. 
Ancho
Utilice esta opción para ajustar el ancho del formulario. Ancho se establece como un valor de píxel.
Relleno El relleno es el espacio alrededor de su forma. Puede utilizar esta opción para aumentar o disminuir el relleno. Esto se establece como un valor de píxel.
Radio de esquina
Utilice esta opción para redondear o cuadrar las esquinas del formulario. El radio de la esquina se establece como un valor de píxel.
Sombra Utilice esta opción para agregar una sombra al formulario. Hacerlo le ayudará a destacar. Puede elegir entre las siguientes opciones: Ninguno, Ligero, Medio y Pesado.

Entradas

Las entradas se refieren a los campos que los visitantes del sitio web utilizarán para enviarle su información personal. Las opciones de personalización de entrada incluyen:

Opciones de personalización de entrada Descripción
Fondo Haga clic en el selector de color para cambiar el color de los campos de entrada.
Color de fuente Haga clic en el selector de color para cambiar el color del texto del campo de entrada. 
Radio de esquina
Utilice esta opción para redondear o cuadrar las esquinas de los campos de entrada. El radio de la esquina se establece como un valor de píxel.

Botón

El " Botón" cuadro le permite personalizar el aspecto del botón de envío de su formulario. Las opciones de personalización de botones incluyen:

Opciones de personalización de botones Descripción
Fondo Cambie el color de fondo del botón Enviar. 
Mensaje de texto Cambie el color del texto del botón. 
Frontera Utilice esta opción para agregar un borde al botón. Los bordes se establecen como un valor de píxel. Puede aumentar o disminuir el borde, cambiar el color del borde y seleccionar entre cuatro tipos de bordes diferentes: Sólido, Punteado, Dashed y Doble. 
Radio de esquina Utilice esta opción para hacer que las esquinas de su botón se redondeen o cuadradas. El radio de la esquina se establece como un valor de píxel. 
Relleno Utilice esta opción para ajustar el relleno del botón. El relleno se establece como un valor de píxel. 

Tenga en cuenta que no podrá ajustar la altura o anchura del botón aquí. Usted necesitará utilizar el CSS personalizado para hacer estos ajustes.

Personalizar un formulario de caja flotante

Con el formulario de cuadro flotante, puede elegir un diseño y personalizar el estilo para el formulario, los campos de entrada y el botón enviar.

Diseño

Hay cuatro opciones que puede elegir para su formulario: sin imagen, imagen a la izquierda, imagen en la parte superior o imagen en el centro.

SMCNALLY Email Marketing - Formulario

Estilo de caja

El " Estilo de formulario" cuadro le permite personalizar cómo se mostrará el formulario a los visitantes de su sitio web. Las opciones de personalización de estilo de formulario incluyen:

Opciones de personalización de estilo de caja Descripción
Fondo Haga clic en el selector de color para cambiar el color del formulario o agregar una imagen de fondo.
Color de fuente Cambie el color del texto que aparece en el formulario.
Fuente Cambie el tipo de fuente en el formulario para que coincida con su marca. 
Ancho Utilice esta opción para ajustar el ancho del formulario. Ancho se establece como un valor de píxel. 
Relleno El relleno es el espacio alrededor de su forma. Puede utilizar esta opción para aumentar o disminuir el relleno. Esto se establece como un valor de píxel. 
Radio de esquina Utilice esta opción para redondear o cuadrar las esquinas del formulario. El radio de la esquina se establece como un valor de píxel. 
Sombra Utilice esta opción para agregar una sombra al formulario. Hacerlo le ayudará a destacar. Puede elegir entre las siguientes opciones: Ninguno, Ligero, Medio y Pesado. 

Entradas

Las entradas se refieren a los campos que los visitantes del sitio web utilizarán para enviarle su información personal. Las opciones de personalización de entrada incluyen:

Opciones de personalización de entrada Descripción
Fondo Haga clic en el selector de color para cambiar el color de los campos de entrada.
Color de fuente Haga clic en el selector de color para cambiar el color del texto del campo de entrada. 
Radio de esquina
Utilice esta opción para redondear o cuadrar las esquinas de los campos de entrada. El radio de la esquina se establece como un valor de píxel.

Botón

El " Botón" cuadro le permite personalizar el aspecto del botón de envío de su formulario. Las opciones de personalización de botones incluyen:

Opciones de personalización de botones Descripción
Fondo Cambie el color de fondo del botón Enviar. 
Mensaje de texto Cambie el color del texto del botón. 
Frontera Utilice esta opción para agregar un borde al botón. Los bordes se establecen como un valor de píxel. Puede aumentar o disminuir el borde, cambiar el color del borde y seleccionar entre cuatro tipos de bordes diferentes: Sólido, Punteado, Dashed y Doble. 
Radio de esquina Utilice esta opción para hacer que las esquinas de su botón se redondeen o cuadradas. El radio de la esquina se establece como un valor de píxel. 
Relleno Utilice esta opción para ajustar el relleno del botón. El relleno se establece como un valor de píxel. 

Tenga en cuenta que no podrá ajustar la altura o anchura del botón aquí. Usted necesitará utilizar el CSS personalizado para hacer estos ajustes.

Personalizar un formulario de barra flotante

Con el formulario de barra flotante, puede personalizar el estilo de formulario y el botón Enviar. Las opciones de diseño no están disponibles con este tipo de formulario.

Estilo de barra

El " Estilo de barra" cuadro le permite personalizar cómo se mostrará el formulario a los visitantes de su sitio web. Las opciones de personalización de estilo de barra incluyen:

Opciones de personalización de estilo de barra Descripción
Fondo Cambie el color de fondo del formulario.

Este tipo de formulario no admite imágenes de fondo.
Color de fuente Cambie el color del texto que aparece en el formulario.
Fuente Cambie el tipo de fuente en el formulario para que coincida con su marca. 

Botón

El " Botón" cuadro le permite personalizar el aspecto del botón de envío de su formulario. Las opciones de personalización de botones incluyen:

Opciones de personalización de botones Descripción
Fondo Cambie el color de fondo del botón Enviar. 
Mensaje de texto Cambie el color del texto del botón. 
Frontera Utilice esta opción para agregar un borde al botón. Los bordes se establecen como un valor de píxel. Puede aumentar o disminuir el borde, cambiar el color del borde y seleccionar entre cuatro tipos de bordes diferentes: Sólido, Punteado, Dashed y Doble. 
Radio de esquina Utilice esta opción para hacer que las esquinas de su botón se redondeen o cuadradas. El radio de la esquina se establece como un valor de píxel. 
Relleno Utilice esta opción para ajustar el relleno del botón. El relleno se establece como un valor de píxel. 

Tenga en cuenta que no podrá ajustar la altura o anchura del botón aquí. Usted necesitará utilizar el CSS personalizado para hacer estos ajustes.

Cambiar el texto del botón "Enviar"

Puede cambiar el texto del " Enviar" para cualquier formulario.

1. En la página Información general de formularios, haga clic en el botón "Editar" del formulario con el que desea trabajar.

2. Haga clic en el botón "Enviar" en el generador de formularios.

3. El menú de la derecha mostrará la etiqueta del botón y un campo. Escriba el texto que desea utilizar para el botón.

SMCNALLY Email Marketing - Formulario

El nuevo texto del botón se guardará automáticamente.

Personalización avanzada

Cada tipo de formulario en ActiveCampaign tiene una opción CSS personalizada disponible. Esto es para usuarios avanzados que están familiarizados con CSS y se sienten cómodos con su uso. La opción CSS personalizada se encuentra bajo el " Estilo" pestaña para cada formulario y se puede utilizar para agregar más modificaciones a cualquier elemento de formulario. Por ejemplo, puede utilizar esta opción para:

  • Ajuste la anchura y la altura de los campos de entrada
  • Ajuste la anchura y la altura del botón enviar
  • Ajustar el tamaño de fuente
  • Ajuste el tipo de fuente para los elementos singulares. Por ejemplo, puede usar esto para hacer que la fuente de texto del botón sea diferente del resto del formulario

Si desea obtener más información sobre el uso de CSS, consulte este Tutorial de CSS de w3schools.com.

Para utilizar la opción CSS personalizada:

1. En el creador de formularios, haga clic en la pestaña "Estilo".

2. Desplácese hacia abajo hasta que vea el cuadro "Custom CSS".

3. Haga clic en el botón "Inspector" y, a continuación, haga clic en el elemento de formulario que desea modificar.

4. Una vez que haga clic en el elemento que desea personalizar, aparecerá en el cuadro CSS personalizado. Escriba el CSS en este cuadro.

El CSS que agregue al elemento de formulario se guardará automáticamente.

Desactivar la marca ActiveCampaign

Si está en un plan Plus, Professional o Enterprise, puede eliminar la marca ActiveCampaign de su formulario.

Los usuarios del plan Lite no pueden desactivar la personalización de marca.

Desactivar la marca ActiveCampaign

1. En el creador de formularios, haga clic en la pestaña "Estilo".

2. Desplácese hacia abajo hasta que vea el cuadro "Varios".

3. Haga clic en el conmutador de marca DEC para establecerlo en la posición "Off".

Este ajuste se guardará automáticamente.

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 2 de 3

Have more questions? Submit a request

Start free trial