Création de formulaires pour prospects personnalisés pour HubSpot

Dans cette rubrique, vous apprendrez comment utiliser un formulaire HubSpot pour capturer des données de prospect à l'intérieur d'un lecteur Brightcove.

Le module Campaign offre la possibilité de créer des formulaires de prospects personnalisés qui vous permettent de capturer des informations sur les téléspectateurs pendant que les vidéos sont lues dans les lecteurs Brightcove. Les données de prospect sont envoyées à HubSpot et traitées par lui.

La création d'un formulaire de clients potentiels passe par les étapes suivantes :

  1. Créer un formulaire dans HubSpot
  2. Copier et modifier le code d'intégration du formulaire
  3. Créer un formulaire pour prospects personnalisé dans le module Campagne
  4. Attribuer le formulaire de prospection à un joueur
  5. Valider les données du formulaire dans HubSpot

Création d'un formulaire dans HubSpot

Les formulaires HubSpot peuvent être utilisés pour générer des informations de prospect auprès des visiteurs du site Web. Ces formulaires peuvent également être affichés à l'intérieur des joueurs de Brightcove. Les étapes ci-dessous créeront un formulaire simple pour capturer les informations de l'utilisateur. Pour plus de détails sur les formulaires HubSpot, consultez la documentation HubSpot.

  1. Connectez-vous à votre compte HubSpot.
  2. Cliquez sur Commercialisation > Formes. Si vous utilisez le menu Classique, cliquez sur > Formulaires Contacts.
  3. Cliquez sur Créer un formulaire.
  4. Cliquez sur Formulaire intégré puis cliquez Prochain. Par défaut, le formulaire contiendra un E-mail champ et un Soumettre bouton.
  5. Assurez-vous que le modèle vide est sélectionné. Cliquez sur Démarrer.
  6. Cliquez sur le nom par défaut dans l'en-tête et nommez le formulaire. Appuyez sur Entrée pour enregistrer les modifications.
  7. Cliquez sur le nom par défaut dans l'en-tête et nommez le formulaire. Appuyez sur Entrée pour enregistrer les modifications.
  8. Le côté gauche de la page contient une liste de champs qui peuvent être ajoutés au formulaire. Faites glisser et déposez le Prénom et Nom de famille champs que vous voulez sur le formulaire sur le côté droit de la page.
  9. Pour rendre un champ obligatoire, passez la souris dessus et cliquez sur Plus > Rendre obligatoire. Les champs obligatoires affichent un * en regard de l'étiquette du champ.
  10. Cliquez sur le lien Options en haut de la page.
  11. Pour ce qui se passe après l'envoi de ce formulaire par un visiteur, cliquez sur Afficher un message de remerciement. Conservez le message par défaut car il ne sera jamais affiché.
  12. Cliquez sur le lien Style et aperçu en haut de la page. Par défaut, un aperçu du Bureau s'affiche.
  13. Cliquez sur Publier en haut de la page pour publier les modifications apportées au formulaire.

Copie et modification du code d'intégration du formulaire

Pour utiliser le formulaire à l'intérieur du module Campaign, vous devrez copier et modifier le code d'intégration du formulaire. En outre, vous voudrez peut-être faire un style de base au formulaire. Dans les étapes ci-dessous, nous allons copier le code d'intégration du formulaire dans un éditeur HTML, puis apporter quelques modifications de style au formulaire.

  1. Cliquez sur Partager en haut à droite de la page et copiez le code d'intégration dans le Presse-papiers.
  2. Collez le code d'intégration dans l'éditeur HTML de votre choix.
  3. Le code d'intégration a besoin d'un petit changement afin que Campaign sache fermer le formulaire lorsqu'il est soumis. Localisez la ligne qui a formId: Ajouter une virgule à la fin de la ligne.
  4. Ajoutez cette ligne sous la formId: ligne.
      onFormSubmit: bcLeadForm.submit
  5. Par défaut, lorsque le formulaire est affiché à l'intérieur d'un lecteur Brightcove, le formulaire s'affiche sur un fond transparent au-dessus du lecteur. Ajoutez le CSS suivant au code d'intégration pour changer la couleur d'arrière-plan en gris.
    <style>
    body {
    background-color: rgba(204,204,204,0.9);
    margin: 0;
    padding: 20px;
    height: 100%;
    }
    </style>

Création d'un formulaire pour prospects personnalisé dans le module Campagne

Une fois le code d'intégration du formulaire modifié, créez un formulaire de prospect personnalisé dans le module Campagne et associez le formulaire de prospect à un lecteur activé pour la Campagne.

  1. Ouvrez le Campagne module.
  2. Cliquez sur Formulaires de prospect dans la navigation de gauche. Si des formulaires de clients potentiels ont déjà été créés, ils s'afficheront ici.
  3. Cliquez sur Create Lead Form.
  4. Donnez au formulaire un nom descriptif.
  5. Choisissez la langue dans Form Language.
  6. Sélectionnez le moment d'affichage dans Form Timing. Cela permet de déterminer quand s'affichera le formulaire de clients potentiels.
    modifier le formulaire de prospect (1)
  7. Définissez le type de formulaire sur Custom Lead Form.
  8. Coller le code d'intégration du formulaire .
    modifier le formulaire de prospece
  9. (Facultatif) Cliquez sur Preview Form pour afficher un aperçu du formulaire.
  10. Cliquez sur Save pour enregistrer le formulaire.

Affectation d'un formulaire de clients potentiels à un lecteur

Une fois le formulaire de client potentiel créé, vous devez l'affecter à un lecteur. Pour ce faire, procédez comme suit :

  1. Cliquez sur Joueurs de la campagne dans la navigation de gauche.
  2. Localisez votre joueur et utilisez la liste déroulante Formulaire de prospect pour sélectionner le formulaire de prospect.

La configuration est désormais terminée ; vous êtes prêt à capturer les informations sur les clients potentiels. Lorsqu'une vidéo est publiée à l'aide d'un lecteur compatible avec Campaign, le formulaire pour prospects apparaîtra en fonction des paramètres de synchronisation du formulaire.

Validation des données du formulaire dans HubSpot

Les prospects capturés à l'aide du formulaire de prospect personnalisé seront ajoutés en tant que contacts dans votre compte HubSpot. Un moyen facile de visualiser les données capturées par le formulaire de prospect consiste à créer une Smart List dans HubSpot.

  1. Connectez-vous à votre compte HubSpot.
  2. Cliquez sur Commercialisation > Formes.
  3. Lorsque vous survolez un formulaire, un menu Actions apparaît. Cliquez sur Actions > Afficher les soumissions. Une liste des soumissions de formulaires apparaîtra.
    assign-lead-forme-joueur
  4. Lorsque vous passez la souris sur une ligne, cliquez sur Voir la soumission pour afficher les données du formulaire.
    assign-lead-forme-joueur