Avertissement : cet article est le résultat de la traduction automatique, l'exactitude et la fidélité de la traduction ne sont donc pas garanties. Pour consulter la version originale de cet article, en anglais, cliquez ici.
Forms

Formulaire placé au mauvais endroit sur la page externe

Dernière mise à jour: juillet 15, 2020

Disponible avec :

Tous les produits et les abonnements

Lorsque vous intégrez un formulaire HubSpot dans une page externe, celui-ci est susceptible de s'afficher à différents endroits. Cela peut être dû à l'affichage dynamique du formulaire sur la page, ou au fait que plusieurs codes intégrés soient ajoutés à la même balise <div> dans le code HTML de la page.

Affichage dynamique d'un formulaire sur une page

Un formulaire peut être affiché de manière dynamique sur une page et chargé à différents endroits. Pour garantir le chargement du formulaire à un endroit spécifique de la page, ajoutez un attribut cible au code intégré dans le formulaire pour préciser le conteneur spécifique que vous souhaitez utiliser.

Dans le code intégré au formulaire, ajoutez une virgule (,) après la valeur d'attribut formId, puis ajoutez une nouvelle ligne et saisissez target: '[nom du conteneur]'. Par exemple, il est possible d'obliger le formulaire à s'afficher dans un conteneur sur la page avec la classe CSS Barre latérale.

Image ajoutée par l'utilisateur

Pour en savoir plus sur la personnalisation du code intégré aux formulaires, consultez la documentation des développeurs de HubSpot.

Plusieurs codes intégrés ajoutés à la même balise <div>

Lorsque vous intégrez le même formulaire de HubSpot à plusieurs reprises sur une page externe, les formulaires peuvent s'afficher côte à côte ou au mauvais endroit si les codes d'intégration sont ajoutés à la même balise <div> dans le code HTML de la page.

Pour garantir le chargement et l'affichage adéquats des formulaires, ajoutez l'attribut formInstanceId et spécifiez une valeur unique pour chaque code intégré au formulaire. Dans le code intégré du formulaire, ajoutez une virgule (,) après la valeur de l'attribut formId, puis ajoutez une ligne et saisissez formInstanceId: '[nombre]'. Il est recommandé de numéroter les formulaires selon leur ordre d'affichage sur la page (p.e. « 1 » pour le premier formulaire, « 2 » pour le deuxième formulaire, etc.).

Image ajoutée par l'utilisateur
Image ajoutée par l'utilisateur

Le formulaire ne se charge pas sur des versions anciennes des navigateurs

Sur des versions anciennes des navigateurs, certains Javascript peuvent entrer en conflit avec le code intégré de HubSpot et empêcher le chargement du formulaire. 

Pour garantir le chargement et l'affichage des formulaires, un attribut cible peut être ajouté à chaque code intégré dans le formulaire pour préciser le conteneur spécifique que vous souhaitez utiliser.

form-embed-target

Pour en savoir plus sur la personnalisation du code intégré aux formulaires, consultez la documentation des développeurs de HubSpot.

/fr/forms/form-in-the-wrong-place-on-external-page