Formulário no lugar errado na página externa

Ao incorporar um formulário da HubSpot em sua página externa, você poderá vê-lo aparecendo em um local diferente do desejado.

Isso pode ocorrer devido ao formulário ser renderizado dinamicamente na página ou a um problema com vários códigos incorporados de formulário sendo adicionados à mesma <div> tag no HTML da página.

Esses problemas podem ser resolvidos personalizando o código de incorporação do formulário. Saiba mais sobre como personalizar o código de incorporação de formulário na documentação para desenvolvedores da HubSpot.

Formulário único

Às vezes, um formulário pode ser renderizado dinamicamente em uma página e carregado em locais diferentes. Às vezes, em navegadores mais antigos, o formulário pode nem ser exibido.

Para garantir que o formulário seja carregado com sucesso em uma parte específica da página, você pode adicionar um atributo de destino ao código incorporado do formulário para especificar o contêiner específico no qual você deseja que o formulário seja renderizado.

Por exemplo, você pode forçar a renderização do formulário em um contêiner na página com a classe CSS da barra lateral. Para adicionar um atributo de destino ao código de incorporação de formulário: 

1. No código de incorporação do formulário, adicione uma vírgula (,) após o formId.
2. Em seguida, insira uma nova linha e digite o destino: '[nome do contêiner]' .

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

Formulários múltiplos

Quando você incorpora o mesmo formulário da HubSpot várias vezes em uma página externa, os formulários podem aparecer lado a lado ou no local errado. Isso acontece se os códigos de incorporação de formulário forem adicionados à mesma <div> tag no HTML da página. 

Para garantir que os formulários sejam carregados e exibidos corretamente, adicione o atributo formInstanceId e especifique um valor exclusivo para cada código de incorporação de formulário:

1. No código de incorporação de formulário, adicione uma vírgula (,) após o valor do atributo formId,
2. Insira uma nova linha e insira formInstanceId: '[number]'.
3. Adicione e numere cada formulário na ordem em que aparece na página. Por exemplo, '1' para a primeira forma, '2' para a segunda forma e assim por diante.

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