Configurez et stylisez les formulaires sur les pages HubSpot
Dernière mise à jour: mai 23, 2024
Disponible avec le ou les abonnements suivants, sauf mention contraire :
Tous les produits et les abonnements |
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
Pour mettre en place votre formulaire sur une page HubSpot :-
Accédez à votre contenu :
- Pages de site web : Dans votre compte HubSpot, accédez à Contenu web > Pages de site web.
- Pages de destination : Dans votre compte HubSpot, accédez à Contenu > Pages de destination.
- Cliquez sur le nom de votre page.
- Dans l'éditeur de contenu, 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 : cliquer et faire glisser les 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.
- Champs du formulaire : cliquer et faire glisser les 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 :
-
- 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.
- Redirection vers une autre page : redirige un visiteur vers une autre page après la soumission du formulaire.
Configurer l'automatisation des formulaires
Vous pouvez gérer l'automatisation de vos formulaires, comme la création de contacts et les options d'e-mail marketing, ainsi que tous les workflows associés à vos formulaires. Les déclencheurs d'inscription sont soumis au comportement suivant :
- 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.
Pour configurer les paramètres d'automatisation de votre formulaire, cliquez sur Form automation dans le panneau de gauche pour développer la section, puis passez en revue 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éfinir les contacts créés en tant que contacts marketing : Définir tous les contacts créés à l'aide de ce formulaire en tant que 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 Select an email et sélectionnez un email automatisé existant ou cliquez sur Create new email 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 ajouter un e-mail de suivi :
-
- 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 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.
- Pour utiliser le formulaire comme déclencheur d'un Workflow, cliquez sur Add form to a workflow ou Add form to another workflow.
A noter :
- Une fois qu'un Workflow a été attaché au module de formulaire, il mettra immédiatement à jour les déclencheurs d'inscription au Workflow, même si la page n'a pas encore été publiée ou mise à jour.
- Si vous clonez une page HubSpot avec un formulaire qui est défini pour inscrire des contacts dans un workflow, les soumissions de formulaire sur la nouvelle page clonée ne seront pas ajoutées comme nouveau déclencheur d'inscription dans le 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.