Integrations
      Voltar para o início
      1. Central de Ajuda
      2. Ion
      3. Integrations

      HubSpot: enviar dados para formulário HubSpot

      Dados coletados por meio de suas experiências do Ion podem ser enviados a um formulário HubSpot aproveitando a integração "post to web form" do Ion. Este artigo traz o passo a passo para criar uma integração que mande dados para um formulário HubSpot. Certifique-se de checar a seção "Opções avançadas" deste artigo para saber como postar em vários formulários HubSpot, incluindo dados de diálogo valiosos e o cookie de rastreamento HubSpot.

      Antes de começarmos

      Existem alguns pontos que você precisa ajustar na HubSpot antes de configurar a integração. O documento de suporte da HubSpot traz mais informações sobre os itens destacados abaixo:

      • Nomes de campo do formulário HubSpot
      • GUID do formulário HubSpot
      • URL do HubSpot endpoint

      Existem algumas etapas a serem seguidas na plataforma Ion antes de configurar a integração. O documento de suporte Antes de Começar traz mais informações sobre os itens listados abaixo:

      • Criar campos de coleta de dados
      • Criar formulários no Ion
      • Configurar publicação de teste

      Vamos começar!

      1. Crie um mapeamento de campo

      Seguir as etapas abaixo mapeará seus campos de coleta de dados do Ion para seus nomes de campo correspondentes na HubSpot. Para começar, adicione seu novo mapeamento de campo:

      1. Clique na guia "Integrations" no painel de navegação lateral do Ion Console.

      2. Clique no botão verde “New field mapping”.

      3. Rotule o mapeamento de campo como "HubSpot" e, opcionalmente, adicione uma descrição.

      4. No menu "Integration Type", selecione “Post to Web Form”.

      5. Salve.

      2. Adicione campos de saída ao mapeamento de campo

      Os campos de saída definem os dados que você enviará desde o início até o formulário da web da HubSpot.

      1. Clique no botão verde “New outbound field” para adicionar um novo campo ao seu mapeamento de campo.

      2. Ao adicionar um novo campo, você deverá selecionar do menu "Data Collection" ou "Core Field", implementar um modelo de mashup ou adicionar um campo via JavaScript.

      • Para adicionar um campo de formulário, use o menu "Data Collection" para selecionar a categoria do campo de dados e o campo de coleta de dados.
      • OU, para adicionar um campo tipo core do Ion, selecione "Core Field" no menu.
      • OU, para exportar vários campos do Ion para um campo externo, use a opção "Mashup Field" conectando {{DataName}} {{DataName2}} etc. no editor.
      • OU, para reformatar um valor antes de exportar, use o campo JavaScript para adicionar lógica em torno do valor coletado. Para acessar os campos de coleta de dados via JavaScript, use respondent.dataname.

      3. Opcionalmente, torne seu campo obrigatório para executar a integração.

      4. Opcionalmente, adicione um valor padrão.

      5. Insira o nome do campo externo

      6. Salve.

      7. Repita o processo para cada campo que deve ser incluído no mapeamento de campo.

      8. Pule os campos de entrada.

      Alguns dados do visitante serão enviados automaticamente pelo Ion e salvos como propriedades deste novo contato criado na Hubspot após a conversão. Assim, não é necessário adicionar campos extras para coletar os seguintes dados: 

      - Data da Conversão 
      - Origem do Tráfego 
      - Número de Acessos realizado por este visitante a este Formulário
      - Formulário da primeira conversão deste contato
      - Endereço do IP do usuário (Cidade, País e Região)

      Outros dados também poderão ser enviados e salvos como propriedades. Isto dependerá de quais informações a Hubspot consigue identificar em suas páginas. Para conferir a lista completa, consulte as propriedades atreladas aos contatos que converteram em seus Formulários integrados com Ion. 

       

      3. Crie a integração

      1. Volte para a tela "Integrations".

      2. Clique na guia "Integrations".

      3. Clique no botão verde “New integration”.

      4. Insira "Post to HubSpot" como label.

      5. Opcionalmente, adicione uma descrição.

      6. Selecione o mapeamento de campo que você acabou de criar

      7. Cole a URL do seu formulário no editor

      8. Defina o número máximo de tentativas

      • Se houver uma interrupção do serviço com a plataforma externa, o Ion tentará novamente a postagem no início da próxima hora por quantas tentativas você indicar aqui.

      9. Ative “Empty Fields” para excluir campos externos que não possuem valores dos dados POST.

      10. Selecione POST como o método.

      11. Opcionalmente, adicione o endereço de e-mail de depuração.

      • Os endereços de e-mail especificados aqui receberão um e-mail sempre que a integração for executada, exibindo os dados postados e a resposta obtida. Isso geralmente é usado apenas para testes e solução de problemas.

      12. Pule salvar a resposta como, autenticação e cabeçalhos personalizados.

      13. Salve.

      4. Adicione a integração às páginas do Ion

      A plataforma Ion executa a integração com base nas regras que você criar. As regras podem ser adicionadas a qualquer item acionável em sua publicação. As regras de integração são normalmente executadas no nível do formulário, no envio do formulário ou em uma etapa de avaliação. Siga as etapas abaixo para adicionar a integração às suas páginas do Ion.

      1. Navegue até a publicação.

      2. Clique no formulário, botão ou link que você deseja para fazer o gatilho para executar sua integração.

      3. No Creative Studio, clique em "+RULES".

      4. Selecione a condição que precisa ser atendida para executar a integração.

      • “No conditions required” é a opção mais usada.

      5. Selecione “Run integration” como a ação.

      6. Salve.

      5. Teste a integração

      Use a publicação que você configurou antes de iniciar as etapas de integração para testá-la. Note que as integrações não são executadas no modo de visualização, então você deve abrir uma URL para teste. A integração será executada assim que você enviar o formulário do Ion ou concluir a ação que executa a regra de integração. Se você estiver na lista de distribuição de e-mail de depuração, receberá um e-mail que exibe os dados postados e a resposta do servidor externo. Você também pode verificar se os dados enviados foram recebidos pela plataforma externa.

      Opções avançadas

      Postar em vários formulários da HubSpot

      Se você deseja postar leads do Ion em formulários de campanhas específicas da HubSpot, existem duas alternativas para você atingir esse objetivo:

      1. Torne o URL do endpoint HubSpot dinâmico, compatível com uma regra de formulário que salva o GUID de formulário.

      Na integração do Ion, substitua o GUID no terminal por um marcador dinâmico, assim:

      https://forms.hubspot.com/uploads/form/v2/:portal_id/ {{HubFormGUID}}

      Acima da ação da regra no nível do formulário que executa a integração, salve o valor GUID:

      Condition: No conditions required

      Action: Save data - HubFormGUID = cole o GUID aqui 

      2. Crie uma nova integração para cada formulário HubSpot

      Em vez de aproveitar um endpoint dinâmico, você pode criar uma nova integração para cada formulário HubSpot que você deseja postar. Dado que os nomes de campo do HubSpot sejam consistentes, você pode aproveitar o mesmo mapeamento de campo para cada integração e apenas colar um novo endpoint em "+Integration".

      Incluir dados de diálogo no post

      Os dados coletados fora de seus formulários do Ion podem ser incluídos no post para o HubSpot. Os resultados gerados por meio de cálculos de regras, Ion Core Fields e parâmetros de string de consulta são exemplos de endpoints suplementares que podem ser incluídos na postagem do HubSpot. Desde que esses pontos de dados estejam disponíveis quando a integração for executada, eles podem ser incluídos para aprimorar o registro de contatos! Para fazer isso, crie campos para receber os pontos de dados desejados em seu(s) formulário(s) da HubSpot e inclua-os no mapeamento de campo do Ion.

      Adicionar rastreamento de atividade de lead da HubSpot

      Para associar análise de métricas a um registro de contato no HubSpot, você precisará adicionar o código de rastreamento HubSpot às suas páginas de formulário do Ion e incluir um campo especial chamado "HS Context" na postagem. O "HS Context" é um bloco formatado em JSON que contém informações contextuais para o envio do formulário, incluindo o valor do token do cookie de rastreamento da HubSpot, o endereço IP do lead convertido, a URL em que o formulário é enviado e o nome da página em que o formulário é enviado.

      1. Adicione seu código de rastreamento da HubSpot à biblioteca de scripts do Ion.

      • Navegue até a biblioteca de scripts (Libraries > Scripts).
      • Clique no botão verde “New script category” e crie uma categoria chamada HubSpot (ou navegue até a categoria de script existente).
      • Clique no botão verde “New script”, rotule seu novo script "Visitor Tracking", cole o código de rastreamento HubSpot e salve.

      2. Adicione o scriptlet do servidor que salva o valor do HS Context

      • Navegue até a biblioteca de server scriptlets (Libraries > Server Scriptlets)
      • Clique no botão verde “New scriptlet category” e crie uma categoria chamada HubSpot
      • Clique no botão verde “New scriptlet”, rotule seu novo scriptlet "Save HS Context" e cole o seguinte código no editor de scriptlets:
      var hutk = actionReadCookie("hubspotutk");
      actionSaveData("hutk",hutk);
      var ip = respondent.ipaddress;
      var tsurl = respondent.deeplinkurl;
      var pname = respondent.pagelabel;
      var hscontext = {"hutk":hutk,"ipAddress":ip,"pageUrl":tsurl, "pageName":pname};
      var hub = JSON.stringify(hscontext); 
      actionSaveData("hscontext",hub); 

      3. Atualize o mapeamento de campo da sua integração para incluir o valor de HS Context como um campo de saída

      • Navegue até o mapeamento do campo de integração (Integrations > Field Mappings > [Seu Mapeamento de Campo]).
      • Clique no botão verde “New outbound field” e crie um novo campo de saída que use {{hscontext}} no modelo mashup e o campo externo hs_context.
      • Salve.

      4. Adicione seu script de rastreamento de visitante da HubSpot à publicação de teste

      • Navegue até a tela de "Creative Management" para a sua publicação.
      • Clique no botão “Edit creative properties” no lado direito da tela de gerenciamento de publicações.
      • A partir da biblioteca do editor de scripts </body> da publicação, selecione HubSpot como a categoria e "Visitor Tracking" como o script nos menus suspensos
      • Salve.

      5. Adicione o scriptlet HubSpot Save HS Context à sua publicação de teste

      • Navegue até a página do formulário no Creative Studio
      • Encontre suas regras de nível de formulário e adicione uma ação à sua regra de integração que executa o server scriptlet "Save HS Context" antes da integração do HubSpot.
      • Condições: No conditions required
      • Ação: Run server scriptlet - HubSpot/Save HS Context
      • Ação: Run integration in background - Post to HubSpot

      Observação: Em vez disso, você pode executar a integração a partir do scriptlet, se quiser reduzir a quantidade de ações de regra. Ao usar este método, selecione "Run server scriptlet" como sua ação de regra e remova a ação "Run integration in background". Será necessário fazer modificações no scriptlet.

      Bom trabalho!

      Depois de concluir essas etapas, sua integração está pronta para uso. Você pode adicionar uma regra para executar a integração em todos os criativos aplicáveis. Se você tiver alguma dúvida, entre em contato via help@rockcontent.com.