¿Cómo centrar un formulario en una plantilla de HubSpot?
Puedes centrar un formulario en una plantilla de HubSpot usando módulos de espaciador horizontales o CSS personalizados.
Usar módulos de espaciador horizontales
En tu cuenta de HubSpot, dirígete aMarketing>Archivos y plantillas>Herramientas de diseño.
Haz clic en elnombre de la plantillaen el visor para editar.
En el inspector de la derecha, haz clic en+Agregarpara insertar dos módulos de separador horizontales, uno a la izquierda y uno hacia la derecha del módulo de formulario.
Uso de CSS personalizadas
En tu cuenta de HubSpot, dirígete aMarketing>Archivos y plantillas>Herramientas de diseño.
En el buscador, busca el archivo CSSdentro de las carpetas y luego haz clic en él para seleccionarlo en el editor.
Agrega el siguiente código para centrartodostus formularios en tu sitio web:
/*Para centrar el formulario en su módulo y aplicar un ancho máximo */
form.hs-form,
.hs_cos_wrapper .form-title {
max-width: 600px;
display: block;
margin: 0 auto;
}
/*para centrar el título del formulario dentro de un módulo de formulario */
.hs_cos_wrapper .form-title {
text-align: center;
}
/*para centrar el botón de envío del formulario */
.hs_submit {
text-align: center;
}
Si solo deseas centrar formularios específicos, puedes agregar una clase personalizada a tu módulo de formulario en tu plantilla y luego ajustar tu CSS para aplicar solo a los módulos con esa clase. Por ejemplo, si agregas el formulario de clase personalizado center-form a tu módulo de formulario en tu plantilla, tu CSS se verá como lo siguiente:
/*Para centrar el formulario en su módulo y aplicar un ancho máximo */
form.hs-form,
.center-form .hs_cos_wrapper .form-title {
max-width: 600px;
display: block;
margin: 0 auto;
}
/*para centrar el título del formulario dentro de un módulo de formulario */
.center-form .hs_cos_wrapper .form-title {
text-align: center;
}
/*para centrar el botón de envío del formulario */
.center-form .hs_submit {
text-align: center;
}
En la parte superior derecha, haz clic en Publicar cambios.
Por ahora, ningún usuario ha respondido a esta publicación. Vuelve pronto para ver si alguien tiene la solución o envía tu propia respuesta si sabes cómo ayudar. Cada grano de arena cuenta.