Configurez et stylisez les formulaires sur les pages HubSpot

Après avoir créé un formulaire dans HubSpot, vous pouvez l'ajouter à n'importe quel module de formulaire  sur une page HubSpot. Sur chaque page, vous pouvez également configurer ce qui se passe après l'envoi du formulaire et personnaliser le style des éléments de votre formulaire, tels que le bouton d'envoi et les champs du formulaire.

Avant de commencer

Avant de mettre en place vos formulaires sur une page HubSpot, veuillez noter ce qui suit : 

• Les paramètres et les changements de style ne s'appliqueront qu'au module de formulaire de la page sélectionnée. Les modifications apportées aux paramètres et au style n'affecteront pas votre formulaire sur d'autres pages.
• La mise à jour du contenu des formulaires, tels que les champs de formulaire, entraîne la mise à jour du formulaire sur toutes les autres pages, y compris tous les formulaires intégrés ou les pages de formulaire autonomes. 

Configurer vos formulaires

• Dans votre compte HubSpot, naviguez vers vos pages d'atterrissage ou pages du site web.
• Survolez une page existante avec un module de formulaire et cliquez sur Editer, ou Créer une nouvelle page.
• Dans l'éditeur de pages, cliquez sur le module de formulaire. Si votre page n'a pas encore de module de formulaire, apprenez comment ajouter des modules à une page. 
• Dans l'onglet Content du panneau de gauche, personnalisez les paramètres du formulaire pour cette page :
  • Titre du formulaire : entrez un nom pour le formulaire.
  • Choisissez un formulaire: choisissez un formulaire pour cette page.
    • Pour utiliser un formulaire existant, cliquez sur le menu déroulant et sélectionnez un formulaire . 
    • Pour créer et utiliser un nouveau formulaire, cliquez sur Actions > Créer un nouveau formulaire. En savoir plus sur pour la mise en place de formulaires
    • Pour voir les soumissions pour ce formulaire, cliquez sur Actions > Voir les soumissions du formulaire.
    • Pour cloner ce formulaire, cliquez sur Actions > Cloner le formulaire.
    • Pour consulter d'autres pages utilisant le formulaire sélectionné, cliquez sur Actions > Pages utilisant ce formulaire.
    • Pour modifier le formulaire dans l'éditeur de formulaires, cliquez sur Actions > Aller dans l'éditeur de formulaires complet. 
      
      

Personnalisez le contenu de votre formulaire

Pour modifier les champs de votre formulaire, le texte des boutons et les options de confidentialité des données et de consentement :

• Cliquez sur pour développer la section Contenu du formulaire .
• Configurez le contenu de votre formulaire : 
  • Champs du formulaire : glisser-déposer champs pour modifier l'ordre d'affichage dans le formulaire. Il n'est pas possible de glisser-déposer les champs de formulaire dans les formulaires à plusieurs colonnes ou lorsqu'ils font partie d'un module personnalisé. Pour ajouter des champs de formulaire supplémentaires :
    • Cliquez sur + Ajouter un autre champ de formulaire.
    • Cliquez sur le menu déroulant Choose a property et utilisez la barre de recherche pour rechercher une propriété. 
    • Cliquez sur la propriété pour l'ajouter comme champ de formulaire. 

• • Texte du bouton : saisissez le texte à afficher sur le bouton de soumission.
  • Options relatives à la confidentialité des données et au consentement : dans le menu déroulant, sélectionnez l'avis et les informations relatives au consentement à afficher.
  • Captcha (prévention du SPAM) : cliquez pour activer Captcha (prévention du SPAM) pour afficher le reCAPTCHA invisible de Google.

Remarque : la mise à jour du contenu de votre formulaire mettra à jour le formulaire sur toutes les autres pages où le formulaire est utilisé, y compris tous les formulaires intégrés ou les pages de formulaires autonomes.

Configurez vos actions post-soumission 

Par défaut, les formulaires ajoutés aux pages HubSpot affichent un message en ligne Merci d'avoir soumis le formulaire. Le formulaire n'affichera pas l'action post-soumission configurée dans l'éditeur de formulaire.

Dans l'éditeur de pages, vous pouvez personnaliser une action post-soumission différente. Pour configurer ce qui se passe après l'envoi d'un formulaire :

• Cliquez pour agrandir la section Merci.
• Dans la section What will a visitor see after submitting your form , configurez vos actions post-submit : 
  • Redirection vers une autre page : redirige un visiteur vers une autre page après la soumission du formulaire.
    • Cliquez sur Redirection vers une autre page.
    • Cliquez sur le menu déroulant Redirect link et sélectionnez une page HubSpot existante ou entrez une URL .
  • Afficher un message de remerciement en ligne : affiche un message après que le visiteur a soumis le formulaire. Vous pouvez saisir un message de remerciement dans la zone de texte.

Configurer l'automatisation des formulaires

Gérez l'automatisation de vos formulaires, comme la création de contacts et les options d'envoi d'e-mails marketing, ainsi que tous les workflows associés à vos formulaires :

• Lorsqu'un Workflow est ajouté dans les paramètres d'automatisation du module de formulaire, le déclencheur d'inscription à la soumission de formulaire correspondant sera ajouté au Workflow.
• La suppression d'un Workflow des paramètres d'automatisation du module de formulaire le supprimera également des déclencheurs d'enrôlement du Workflow.
• Si le déclencheur d'inscription au formulaire utilisé dans un workflow ne spécifie pas de page, le déclencheur ne peut pas être supprimé de la page et doit être supprimé du workflow.

Dans la section Form automation, vous pouvez configurer les options d'automatisation suivantes : 

• Toujours créer un nouveau contact pour une adresse e-mail : crée un nouvel enregistrement de contact chaque fois qu'un formulaire est soumis avec une nouvelle adresse e-mail, indépendamment de toute correspondance avec des contacts existants à partir de la soumission du formulaire. 
• Définirles contacts créés comme contacts marketing : définir tous les contacts créés à l'aide de ce formulaire comme des contacts marketing.
• Suivi par e-mail: envoie un e-mail de suivi aux visiteurs qui ont envoyé le formulaire. Les e-mails de suivi ne peuvent être envoyés qu'aux contacts marketing. 
  • Pour ajouter un e-mail de suivi :
    • Cliquez sur Sélectionnerun e-mail +.
    • Dans la boîte de dialogue, cliquez sur le menu déroulant Sélectionner un e-mail et sélectionnez un e-mail automatisé existant ou cliquez sur Créer un nouvel e-mail pour créer un nouvel e-mail automatisé.
    • Cliquez sur Enregistrer. L'e-mail de suivi sélectionné s'affiche dans le panneau de gauche. 
    • Après avoir configuré vos e-mails de suivi, cliquez en haut à droite sur Publier ou Mettre à jour pour appliquer ces changements. L'e-mail de suivi ne sera pas activé tant que les modifications n'auront pas été publiées. 

• • Pour modifier l'e-mail de suivi utilisé, survolez l'e-mail et cliquez sur l'icône en forme de crayon située à côté de l'e-mail. 
  • Pour supprimer l'e-mail de suivi, survolez l'e-mail et cliquez sur l'icône X à côté de l'e-mail. L'e-mail ne devrait plus s'afficher. 
  • Si le formulaire était précédemment associé à un ancien e-mail de suivi, une alerte s'affiche à l'adresse . Ce formulaire utilise un ancien e-mail de suivi. Bien que les anciens e-mails de suivi ne puissent pas être modifiés, si l'e-mail a été publié précédemment, il peut être mis à jour pour devenir un e-mail automatisé. Les e-mails automatisés mis à jour peuvent ensuite être modifiés. 
    • Pour mettre à jour un e-mail de suivi précédemment publié et le transformer en un e-mail automatisé qui peut être modifié, cliquez sur Update email. Cliquez ensuite sur Update. Si l'e-mail n'a pas été publié précédemment, cette option ne s'affiche pas. 

• • • Pour supprimer un e-mail de suivi publié ou non publié, cliquez sur Supprimer. Cliquez ensuite sur Supprimer. 

• Workflows connectés : tous les workflows et les workflows simples utilisant le formulaire comme déclencheur d'inscription s'affichent. En savoir plus sur en utilisant l'automatisation avec les formulaires. 
  • Pour utiliser le formulaire comme déclencheur d'un Workflow, cliquez sur Add form to a workflow ou Add form to another workflow. 
    • Cliquez sur Ajouter le formulaire à un workflow.
    • Sélectionnez un workflow existant ou cliquez sur Créer un nouveau workflow pour créer un nouveau workflow. Si vous créez un nouveau Workflow, configurez votre Workflow, puis revenez au module de formulaire de votre page de destination ou de votre page de site web. 
  • Pour ajouter un autre workflow, cliquez sur Ajouter un formulaire à un autre workflow, puis sélectionnez un workflow existant ou cliquez sur Créer un nouveau workflow.
  • Pour supprimer le formulaire en tant que déclencheur d'un Workflow, survolez le Workflow et cliquez sur l'icône de suppression située à côté du Workflow. 

Configurer des options de formulaire supplémentaires

Vous pouvez également configurer des paramètres supplémentaires tels que la sélection des destinataires des notifications du formulaire. De plus, si vous avez installé l'intégration HubSpot-Salesforce, vous pouvez également associer le formulaire à une campagne Salesforce active.

Pour configurer les options supplémentaires de votre formulaire, descendez au bas du panneau de gauche, puis configurez les options suivantes :

• Envoyer les notifications de formulaire aux adresses e-mail spécifiées au lieu des valeurs par défaut du formulaire : par défaut, les notifications de soumission de formulaire seront envoyées à tous les destinataires ajoutés dans l'onglet Options du formulaire. Pour écraser les destinataires par défaut du formulaire et sélectionner les destinataires des notifications pour les soumissions sur cette page :
  • Cliquez sur ce bouton pour activer l'option Envoyer les notifications aux adresses e-mail spécifiées au lieu des valeurs par défaut du formulaire .
  • Cliquez sur le menu déroulant Adresses E-mail et sélectionnez vos destinataires. Seuls les utilisateurs de HubSpot peuvent être sélectionnés comme destinataires des notifications de formulaire. 
  • Pour supprimer un destinataire, cliquez sur l'icône X en regard de son adresse e-mail. 
• Campagne Salesforce : Si l'intégration Salesforce est activée, vous pouvez associer un formulaire à une campagne Salesforce active en cliquant sur le menu déroulant et en sélectionnant une campagne. En savoir plus sur l'association de formulaires à des campagnes Salesforce.
  
  

Styliser vos formulaires sur les pages HubSpot

Vous pouvez personnaliser le style de l'ensemble du formulaire et apporter des modifications spécifiques au bouton d'envoi ou aux champs du formulaire. Pour personnaliser le style de votre formulaire :

• En haut du panneau de gauche, cliquez sur l'onglet Styles.
• Cliquez sur les onglets Module, Champs, ou Boutons pour sélectionner l'élément de votre formulaire que vous souhaitez styliser.
• Personnaliser l'élément sélectionné de votre formulaire en utilisant les options de texte et d'alignement ci-dessous.
• Cliquez sur Publier ou Mettre à jour pour activer les modifications.

Remarque : Les formulaires qui apparaissent sur les pages HubSpot ne peuvent être personnalisés que sur des pages spécifiques. Les formulaires intégrés dans des pages externes ou dans des pages de formulaires autonomes doivent être stylisés dans l'éditeur de formulaires ou stylisés avec CSS dans votre feuille de style externe.