Formulario en el lugar equivocado en la página externa

Al incrustar un formulario de HubSpot en tu página externa, es posible que aparezca en una ubicación diferente a la deseada.

Esto puede deberse a que el formulario se muestra dinámicamente en la página o a un problema con varios códigos de incrustación de formularios que se añaden a la misma etiqueta <div> en el HTML de la página.

Estos problemas pueden resolverse personalizando el código de incrustación del formulario. Más información sobre cómo personalizar el formulario para insertar código en la documentación para desarrolladores de HubSpot.

Formulario único

A veces, un formulario puede renderizarse dinámicamente en una página y cargarse en diferentes ubicaciones. A veces, en navegadores antiguos, el formulario ni siquiera se muestra.

Para garantizar que el formulario se cargue correctamente en una parte específica de la página, puedes agregar un atributo objetivo al código de incrustación del formulario para insertar el contenedor específico en el que deseas que se muestre el formulario.

Por ejemplo, puedes forzar que el formulario se muestre en un contenedor de la página con la clase CSS sidebar. Para añadir un atributo de destino al código de incrustación del formulario: 

1. En el código de incrustación del formulario, añade una coma (,) después del formId.
2. A continuación, introduce una nueva línea y escribe target: '[nombre del contenedor]' .

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js"></script>
<script>
hbspt.forms.create({
region: "na1",
portalId: "1234567",
formId: "f0123bdf-4cfa-47cd-8b61-15ce95286047",
 target: ".sidebar"
 });
</script>

Múltiples formas

Cuando incrustas el mismo formulario de HubSpot varias veces en una página externa, los formularios pueden aparecer uno al lado del otro o en una ubicación incorrecta. Esto sucede si el formulario inserta códigos se agregan a la misma <div> etiqueta en el HTML de la página. 

Para asegurarte de que los formularios se cargan y muestran correctamente, añade el atributo formInstanceId y especifica un valor único para cada código de incrustación de formulario:

1. En el código de incrustación del formulario, añade una coma (,) después del valor del atributo formId, 
2. Introduce una nueva línea e introduce formInstanceId: '[number]'.
3. Añade y numera cada formulario en el orden en que aparece en la página. Por ejemplo, "1" para el primer formulario, "2" para el segundo formulario, y así sucesivamente.

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js"></script>
<script>
hbspt.forms.create({
region: "na1",
portalId: "1234567",
formId: "f0123bdf-4cfa-47cd-8b61-15ce95286047",
 formInstanceId: '1'
 });
</script>