Cómo integrar HubSpot y Webflow

Si has decidido alojar y crear tu sitio web en Webflow pero quieres seguir usando los formularios de HubSpot y conectar ambos sistemas, quizá te preguntes cuál es la mejor forma de lograrlo. En este artículo exploramos las mejores formas de integrar Webflow con HubSpot para que aproveches al máximo las dos herramientas.

Opción 1: integración de HubSpot con Webflow Enterprise

Por desgracia, de momento la integración «oficial» con HubSpot solo está disponible si compras la versión Enterprise de Webflow. Esto significa que la integración es bastante sencilla y funciona de forma inmediata, pero ¿qué pasa si no quieres o no necesitas un plan Webflow Enterprise solo por necesitar la integración con HubSpot?

Opción 2: usar formularios que no son de HubSpot

HubSpot tiene una opción de configuración que permite rastrear los envíos de formularios que no son de HubSpot en un sitio web donde esté instalado el código de seguimiento de HubSpot. Para que funcione, debes tener esta opción activada en los ajustes de HubSpot, en el apartado Formularios.

Una vez activada, si el código de seguimiento de HubSpot está instalado en el sitio web y en la página donde está el formulario, HubSpot recopilará la información de ese formulario. Hay algunas condiciones y limitaciones para que esto funcione, que HubSpot detalla en este artículo. Para que los envíos de un formulario se recopilen en HubSpot, el formulario debe:

• ser un formulario HTML estático.
• estar envuelto en etiquetas HTML <form>.
• no estar dentro de un <iframe>.
• tener un campo de entrada de correo electrónico.

Si no estás muy seguro de esto, quizá necesites la ayuda de un desarrollador. Una vez configurado, cuando alguien envíe el formulario de Webflow aparecerá en la sección de formularios de HubSpot. Ten en cuenta que puedes ver nombres de formulario poco habituales, porque HubSpot toma el nombre del código CSS del sitio web.

La herramienta identifica los formularios de tu sitio web a partir del selector CSS del formulario. Esto significa que si tu formulario tiene un ID CSS "gform_7.", aparecerá en tu panel de formularios como "#gform_7." Cuando un formulario aparezca en la herramienta de formularios que no son de HubSpot, puedes cambiarle el nombre para que tú y tu equipo lo identifiquéis fácilmente.

La ventaja de la opción 2 es que usas el creador de formularios de Webflow y puedes darles el estilo que quieras, sin tener que incrustar formularios de Hubspot que pueden verse distintos y requieren código Javascript adicional.

El otro inconveniente de esta opción es que no puedes usar formularios que no son de HubSpot como activadores de eventos para Google Ads. No es imprescindible, pero si quieres usar los envíos de formularios como evento en HubSpot para retroalimentar Google Ads, tiene que ser un formulario de HubSpot, lo cual es un poco molesto.

Opción 3: usar formularios de HubSpot incrustados

La tercera opción es usar la opción de incrustación habitual de HubSpot para tus formularios. Es sencillo: solo tienes que copiar el código de incrustación del formulario de HubSpot y pegarlo en tu página en el Designer de Webflow. Para ello tendrás que usar la función de incrustación (Embed) de Webflow.

Este es un vídeo de la base de conocimientos de Webflow sobre el código de incrustación. Si tienes un Workspace Core, Growth, Agency o Freelancer, o si tu sitio tiene un plan de sitio activo, puedes usar el elemento Embed.

A continuación tienes un ejemplo de código de incrustación de un formulario de Hubspot, que puedes obtener en HubSpot haciendo clic en el formulario y luego en compartir.

El posible inconveniente de integrar formularios de HubSpot con Webflow de esta forma es que el estilo de tu formulario puede ser distinto al de los formularios de Webflow. Aunque puedes cambiar la configuración del formulario en HubSpot para quitar todos los estilos, después resulta algo engorroso crear y aplicar estilos CSS a todos los elementos del formulario para que coincidan con tus formularios de Webflow.

Resumen

HubSpot y Webflow no se llevan tan bien como otras herramientas, pero aun así son bastante fáciles de configurar. La función de formularios que no son de HubSpot es muy útil para integrar tus formularios de Webflow con HubSpot, aunque pierdes algo de funcionalidad. Lo ideal es incrustar tu formulario de HubSpot y adaptar su estilo al de tu sitio web, por lo que quizá necesites la ayuda de un desarrollador web.