Easily build and embed forms on your site. Try HubSpot Forms for free.  
Nota: Este contenido se tradujo a través de un software y es posible que no haya sido revisado. La versión en inglés se considera, por tanto, la versión oficial y es posible que haya sido actualizada. Para acceder a la versión en inglés, haz clic aquí.
Forms

Estilo a tu formulario incrustado en una página externa

Última actualización: octubre 29, 2019

Puedes diseñar tu formulario de HubSpot incrustado en tus páginas externas en dos maneras:

  1. Estilo de tu formulario incrustado en el editor de formularios
  2. Estilo de tu formulario incrustado con CSS en tu hoja de estilo externa

 

Estilo de tu formulario incrustado en el editor de formularios

Tema

Si quieres diseñar tus formularios sin escribir ningún código personalizado, puedes aplicar temas preestablecidos a tu formulario incrustado o página de formulario independiente. Los temas agregan más opciones de personalización a tus formularios, además de cualquier configuración de estilo de formulario global.

  • En tu cuenta de HubSpot, dirígete a Marketing > Captación de oportunidades de venta > Formularios.
  • Haz clic en el nombre de un formulario.
  • En el editor de formularios, haz clic en la pestaña Estilo y vista preliminar.
  • En el panel izquierdo, la sección Tema, borra la casilla de comprobación Mantener tema anterior.

Nota: Borrar la casilla de comprobación Mantener tema anterior eliminará el antiguo estilo de HubSpot aplicado a este formulario. Cualquier CSS personalizada o JavaScript que hayas agregado al formulario ya no funcionará.

  • Seleccionar uno de los cuatro temas.

 

Estilo (Marketing Hub Starter, Básico, Pro y Enterprise únicamente)

Además de temas, puedes diseñar formularios incrustados en un nivel más detallado.

  • En tu cuenta de HubSpot, dirígete a Marketing > Captación de oportunidades de venta > Formularios.
  • Haz clic en el nombre de un formulario.
  • En el editor de formularios, haz clic en la pestaña Estilo y vista preliminar.
  • En el panel izquierdo, haz clic en la sección > Estilo para ampliarlo. Aquí, puedes diseñar el ancho del campo del formulario, familia de fuentes, tamaños de fuente, colores de fuentes y botón de formulario.

Estos estilos se establecen en un formulario individual y anularán la configuración de estilo de formulario global.

Nota: temas y estilos establecidos en el editor de formularios solo se aplicarán a formularios incrustados o páginas de formulario independientesFormularios de estilo en tus páginas de HubSpot con las opciones de estilo del módulo de formulario en el editor de contenido.

 

Estilo de tu formulario incrustado con CSS en tu hoja de estilo externa (Marketing Hub Básico, Pro y Enterprise únicamente)

  • En tu cuenta de HubSpot, dirígete a Marketing > Captación de oportunidades de venta > Formularios.
  • Haz clic en el nombre del formulario.
  • En el editor de formularios, haz clic en la pestaña Opciones.
  • Haz clic para activar el interruptor Formulario sin estilo. El formulario se mostrará como un elemento HTML sin procesar en tu sitio web en lugar de dentro de un iFrame, y cualquier estilo de HubSpot predeterminado aplicado al formulario será eliminado.

  • En la parte superior derecha, haz clic en Compartir.
  • En el cuadro de diálogo, haz clic en Copiar para copiar el código de incrustación del formulario.
  • Agrega el código de incrustación del formulario a tu sitio externo. Si ya has incrustado tu formulario, debes reemplazar el código de incrustación existente con esta nueva versión sin estilo.
New Call-to-action
/es/forms/how-do-i-style-my-embedded-form