widget Catégories : Entreprises
Utilisez le formulaire de contact widget pour ajouter un formulaire web à votre site. Le formulaire de contact widget vous permet d'offrir aux visiteurs une variété de zones de saisie : texte spécifique, liste déroulante, boutons radio, cases à cocher, date, heure, courriel et numéros de téléphone. Vous pouvez utiliser le formulaire pour les inscriptions à la lettre d'information, les questions des clients ou simplement pour recueillir les commentaires des visiteurs de votre site.
Attention
Nous ne conseillons pas la duplication des formulaires de contact, car cela entraîne généralement des problèmes dans le formulaire de contact dupliqué.
Modifiez les champs existants en cliquant sur le nom du champ dans la liste.
Pour ajouter de nouveaux champs, cliquez sur Ajouter un champ.
Après avoir cliqué sur un champ existant ou ajouté un nouveau champ, des paramètres supplémentaires apparaissent. De nombreux paramètres dépendent du type de champ sélectionné.
Remarque
-
Pour les boutons radio et les cases à cocher, vous pouvez ajouter des images à afficher pour les options. Les images n'apparaîtront pas dans le courrier électronique reçu à la suite de l'envoi du formulaire, mais l'étiquette sélectionnée apparaîtra (même si elle est cachée sur le site).
-
Notez que l'apparence des champs de saisie sur votre site réel peut différer légèrement de ce que vous voyez dans l'éditeur, en fonction du navigateur utilisé pour afficher le formulaire.
-
La plupart des types de champs disposent de ces options :
-
Champ obligatoire. Si un champ obligatoire est laissé vide, un cadre rouge apparaît autour du champ lorsque vous essayez d'envoyer le formulaire. Bien qu'il n'y ait pas actuellement d'indicateur ajouté (par exemple, un astérisque), il est possible d'en ajouter un manuellement à l'étiquette du champ ou à l'espace réservé.
-
Commencez une nouvelle ligne dans ce champ.
-
Taille du champ. Personnalisez la largeur du champ.
-
-
Pour les boutons radio et les cases à cocher, vous pouvez ajouter des images à afficher pour les options. Les images n'apparaîtront pas dans le courrier électronique reçu à la suite de l'envoi du formulaire, mais l'étiquette sélectionnée apparaîtra (même si elle est cachée sur le site).
-
Champ de l'heure: la case à cocher Utiliser l'horloge 24 heures n'affecte que l'heure affichée dans les soumissions ; le format du sélecteur d'heure affiché par les visiteurs du site dépend des paramètres de leur navigateur.
-
Champ pour les pièces jointes:
-
Le nom du fichier ne doit pas comporter d'espace lorsqu'il est téléchargé.
-
La taille des fichiers joints est limitée à 10 Mo.
-
Un seul fichier peut être téléchargé par champ de pièce jointe (si plusieurs fichiers doivent être téléchargés, un champ devra être inclus pour chacun d'entre eux).
-
Les formats suivants sont pris en charge : .pdf, .xls, .xlsx, .doc, .docx, .zip, .ppt, .pptx, .psd, .txt, .xml, .mp3, .ttf, .otf, .woff, .eot, .svg .odt, .ott, .js, .css, .png, .jpg, .gif, .jpeg, .rar en plus de tous les formats de fichiers vidéo.
-
Les pièces jointes soumises expirent après 90 jours.
-
Les fichiers ne sont pas ajoutés au Media Manager.
-
-
Champ du numéro de téléphone: Le champ Numéro de téléphone est soumis à un contrôle de validation pour s'assurer que les conditions de formatage sont remplies. Si ce n'est pas le cas, un message d'erreur s'affiche. Les conditions sont au moins un nombre et aucun caractère non valide. Outre les chiffres, les caractères valables sont les espaces, les signes plus (+), les tirets (-) et les points (.).
Personnalisez le texte que vous souhaitez voir apparaître sur le bouton Soumettre.
Par défaut, la validation reCAPTCHA est ajoutée aux nouveaux formulaires. Cet élément protège votre formulaire des spammeurs et accélère le processus d'envoi du formulaire pour les visiteurs.
Positionnez le module reCAPTCHA.
Choisissez la forme du reCAPTCHA dans le formulaire (une icône ou un bloc de texte).
Remarque
reCAPTCHA ne peut pas être désactivé.
Pour définir l'adresse électronique et l'objet de la réception des réponses au formulaire, cliquez sur Nouvelle notification de soumission.
Veillez à indiquer l'adresse électronique dans le champ " Le formulaire sera envoyé à" afin d'obtenir une copie des informations soumises.
Si le champ Formulaire auquel les soumissions seront envoyées est vide, c'est l'adresse électronique principale de la bibliothèque de contenu qui sera utilisée. Si ce courriel n'existe pas, le propriétaire du compte sera utilisé comme destinataire par défaut. Toutes les réponses sont renvoyées à la page des réponses au formulaire.
Cliquez sur Actions après la soumission pour mettre en place ce qui suit :
-
Remerciements et messages d'erreur. Utilisez l'éditeur de texte enrichi pour ajouter de la couleur, de l'emphase (gras, italique et souligné) et des puces pour ajouter du texte dans les boîtes.
-
Paramètres de redirection. tu peut rediriger vers une page de ton site web ou vers un site web externe.
-
Paramètres d'e-mail: par défaut, une réponse automatique sera envoyée à l'expéditeur du formulaire avec une copie de sa soumission (pour autant que l'adresse e-mail qu'il a fournie soit valide). Lorsque cette option est activée, des paramètres supplémentaires sont énumérés ci-dessous.
-
Réponse automatique à l'expéditeur du formulaire. Par défaut, une réponse automatique sera envoyée à l'expéditeur du formulaire (pour autant que l'adresse électronique qu'il a fournie soit valide). Pour désactiver cette fonction, désactivez l'option Réponse automatique à l'expéditeur du formulaire.
-
Nom du formulaire. Vous pouvez également définir le nom du formulaire (le nom que vous saisissez ici apparaîtra dans le champ "De" de l'e-mail envoyé). Si le paramètre de réponse automatique a été désactivé, ce paramètre n'est pas disponible.
-
Objet de l'e-mail. Si le paramètre de réponse automatique a été désactivé, ce paramètre n'est pas disponible.
-
Message électronique. Si le paramètre de réponse automatique a été désactivé, ce paramètre n'est pas disponible.
-
Joignez à l'e-mail une copie du formulaire de réponse de l'auteur de la demande. Cette fonction est activée par défaut. Décochez la case pour la désactiver. Si le paramètre de réponse automatique a été désactivé, ce paramètre n'est pas disponible.
-
Saisissez un titre de formulaire. Pour masquer le titre du formulaire, cliquez sur l'icône de l 'œil ().
Remarque
Si vous renommez le formulaire, le titre sera uniquement modifié après l'envoi d'une nouvelle réponse. Pour modifier rapidement le nom du formulaire, nous vous recommandons d'envoyer une réponse test puis de patienter quelques instants pour que le formulaire soit mis à jour.
Dans l'onglet Intégration, envoyez les données de la soumission réussie à un service tiers. Pour plus d'informations, voir la section ci-dessous, Intégrations de formulaires de contact (options de configuration supplémentaires).
Pour étendre la portée de votre formulaire de contact, intégrez-le à diverses solutions tierces.
Pour ajouter une intégration, dans la zone de contenu, cliquez sur l'onglet Intégrations.
Remarque
Nous ne proposons plus Mailchimp ou Constant Contact comme intégrations de formulaires de contact. Si vous les avez déjà installés, ils seront toujours disponibles pour votre site.
Utilisez l'intégration à Google Sheets pour ajouter instantanément les données du formulaire de contact à une feuille de calcul. Tous les champs de contact du formulaire sont renseignés dans la feuille de calcul, ainsi qu'un horodatage incluant la date et l'heure d'envoi du formulaire.
-
Cliquez sur Google Sheets, puis sur Connexion avec Google.
-
Cliquez sur Autoriser pour autoriser la connexion à votre compte Google. Si votre ordinateur est connecté à plusieurs comptes Google, sélectionnez le compte que vous souhaitez connecter à ce formulaire.
-
Indiquez si vous souhaitez ajouter des données à une feuille de calcul existante ou à une nouvelle feuille.
-
Sélectionnez la feuille de calcul vers laquelle vous souhaitez envoyer les données du formulaire. Vous pouvez sélectionner la feuille de calcul dans une liste ou utiliser la barre de recherche pour trouver une feuille spécifique.
Remarque
-
Si vous disposez de plusieurs formulaires sur le site, vous pouvez connecter chacun d'eux à une feuille de calcul différente, y compris des feuilles de calcul de comptes Google différents.
-
Vous pouvez également connecter plusieurs formulaires à la même feuille de calcul. Dans ce cas, assurez-vous que les champs et leur ordre dans les formulaires sont identiques pour correspondre aux informations envoyées.
-
L'envoi de données de formulaire vers une feuille de calcul Google ne vous empêche pas de télécharger les données dans un fichier CSV ou de recevoir des e-mails d'envoi de formulaire.
De nombreux services de cloud et en ligne proposent des intégrations par l'intermédiaire de chemins appelés webhooks. Les webhooks envoient des notifications à une adresse Web spécifique appelée l'URL de point de terminaison. Vous pouvez connecter le formulaire de contact pour générer un événement lors de l'envoi d'un formulaire complété.
Pour connecter le formulaire de contact à un autre service à l'aide de webhooks, il vous suffit de créer une URL de point de terminaison personnalisée avec le service de votre choix et de la coller dans le champ d'intégration des webhooks du formulaire de contact. Une fois que vous avez ajouté l'URL d'un webhook, une requête POST sera envoyée au point de terminaison avec les données du corps au format JSON dès que le formulaire de contact est complété sur le site Web. Voici un exemple de données au format JSON qui seront envoyées :
{"Date de soumission":"06/02/2016 10:23:54","Titre du formulaire":"Contactez-nous","Nom":"John Smith","Email":" test@example.com ","Téléphone":"(555).555.1212","Message":"Webhook Soumission du formulaire !"}
Remarque
La date de soumission et le titre du formulaire seront toujours fournis. Les autres champs ( nom_du_champ : valeur) sont basés sur les champs configurés dans le formulaire.
Toutes les informations relatives aux champs sont présentées sous forme de chaîne de caractères et entre guillemets. Par exemple, 7 est envoyé sous la forme "7 ".
Les points de terminaison sont configurés sur des services tiers (par exemple, Zapier ou Slack) ou un autre serveur que vous contrôlez. Ces points de terminaison sont spécifiquement configurés pour recevoir des notifications du webhook.
-
Zapier. Connectez les données du formulaire de contact à Zapier pour des possibilités illimitées. Connectez-vous avec pratiquement n'importe quel service cloud moderne, y compris les CRM comme Salesforce, Sugar CRM, Zoho et bien d'autres encore.
-
Slack. Une application de messagerie robuste à laquelle vous pouvez vous connecter pour recevoir des notifications dès que les données du formulaire sont soumises.
-
Intégration personnalisée. Créez vos propres Webhooks personnalisés pour les intégrer au formulaire de contact. Par exemple, enregistrez les soumissions dans une base de données ou connectez-vous à des applications personnalisées ou à des services tiers.
-
Dans l'application Slack, ouvrez le menu déroulant du compte principal, puis cliquez sur Apps & Integrations.
-
Le site web de Slack s'ouvre. Dans le coin supérieur droit, cliquez sur Construire.
-
Cliquez sur Créer une intégration personnalisée.
-
Sélectionnez les Webhooks entrants.
-
Sélectionnez un canal existant ou créez un nouveau canal où vos messages seront publiés.
-
Copiez l'URL de vos Webhooks.
-
Ajustez les paramètres et les options à votre convenance, puis cliquez sur Enregistrer les paramètres.
-
Ouvrez ensuite l'éditeur de formulaire de contact et collez l'URL de vos webhooks dans le champ Webhooks.
-
Cliquez sur Terminé.
Prévisualisez votre site, remplissez puis envoyez le formulaire de contact pour tester l'intégration.
Vous recevrez un message sur Slack chaque fois que des informations seront envoyées via votre formulaire de contact.
Zapier vous permet de vous connecter aux différents services de Zapier pour créer des événements automatisés après une nouvelle réponse de formulaire.
La mise en place se fait par le biais de votre compte Zapier. Veuillez vous référer à la documentation Zapier pour plus de détails (zapier.com/apps/duda/integrations).
Remarque
Zapier n'est disponible qu'au niveau du compte. Les sites individuels ne peuvent pas se connecter à différents comptes Zapier.
Le connecteur Hubspot est conçu pour intégrer de manière transparente vos projets de conception de sites Web avec les puissantes capacités CRM de Hubspot. Notre connecteur est le pont entre les activités de votre site Web et la gestion de la relation client.
Notez que Hubspot est une application qui devra être gérée via l'App Store après l'installation.
Ce connecteur a été conçu pour intégrer vos projets de conception de sites web avec les puissantes fonctionnalités d'automatisation de marketing de Mailchimp, créant ainsi un lien crucial entre les activités de votre site web et vos stratégies de marketing par e-mail.
Notez que MailChimp est une application et qu'elle doit être gérée via l'application store après l'installation.
Remarque
Nous ne proposons plus Mailchimp ou Constant Contact comme intégrations de formulaires de contact. Si vous les avez déjà installés, ils seront toujours disponibles pour votre site.
Le connecteur a été conçu pour intégrer vos projets de conception de sites Web avec les fonctionnalités robustes de marketing par e-mail et d'automatisation d'ActiveCampaign, établissant ainsi un lien crucial entre les activités de votre site Web et vos stratégies de marketing sophistiquées.
Notez qu'ActiveCampaign est une application qui devra être gérée via l'App Store après l'installation.
L'Automation Builder est votre passerelle vers une intégration transparente entre votre générateur de site Web et une myriade de plateformes de marketing et de CRM. Cet outil puissant permet un flux de données bidirectionnel, autorisant non seulement le transfert de données depuis votre créateur de site Web vers des plateformes telles que Mailchimp et ActiveCampaign, mais également dans le sens inverse. Il a été développé pour améliorer la flexibilité et l'efficacité, en simplifiant les flux de travail complexes entre les différents services.
Notez que Automation Builder est une application qui devra être gérée via l'App Store après l'installation.
Pour en savoir plus sur les concepts importants et sur la façon d'effectuer différents types de connexions et d'automatisations, consultez le cours Albato Basics dans l'Albato's Academy.
Disposition
Dans l'onglet Mise en page :
-
Cliquez sur l'icône de mise en page pour sélectionner une mise en page pour le formulaire de contact.
-
Pour modifier l'alignement du formulaire, cliquez sur Gauche ou Droite.
Élément
Dans l'onglet Élément :
-
Pour modifier le style et le texte du champ, cliquez sur Champs.
-
Pour modifier le style et le texte du bouton, cliquez sur Bouton. Pour revenir au style du thème, cliquez sur le bouton Revenir au thème.
Cadre
Dans l'onglet Cadre :
-
Pour modifier le style de cadre, cliquez sur Style de cadre. Vous pouvez modifier l'arrière-plan en ajoutant une couleur ou une image.
-
Pour modifier le style de texte du titre, cliquez sur Titre du formulaire.
-
Pour modifier le style de texte de la notification de soumission, cliquez sur Message de soumission
Vous pouvez relier l'adresse électronique à la bibliothèque de contenu ou à un champ d'adresse électronique dans les collections. En outre, vous pouvez ajouter des champs de collecte tels que l'identifiant de l'appartement ou le nom du membre de l'équipe à l'objet de l'e-mail ou en tant que champs externes envoyés dans le formulaire. Ces champs supplémentaires seront disponibles non seulement dans l'e-mail du formulaire, mais aussi lorsque vous accéderez aux données des réponses du formulaire à partir de l'onglet "Vue d'ensemble du site" dans le tableau de bord du site.
Remarque
Uniquement possible sur les pages dynamiques.
Pour ajouter des données connectées à un formulaire de contact :
-
Cliquez avec le bouton droit de la souris sur le widget, puis cliquez sur Connecter aux données.
-
Sélectionnez l'adresse électronique dans le menu déroulant Connecter à l'adresse électronique .
-
(Facultatif) Sélectionnez les champs supplémentaires que vous souhaitez inclure dans l'e-mail du formulaire de contact.
-
(Facultatif) Cliquez sur Modifier le contenu et apportez toutes les modifications nécessaires au contenu. Toutes les modifications seront synchronisées avec votre bibliothèque de contenu.
-
Cliquez sur Terminé.
Les réponses sont accessibles à plusieurs endroits : dans le tableau de bord du site, dans l'éditeur et dans le formulaire lui-même.
Remarque
Les formulaires envoyés à partir du lien de prévisualisation ou de la prévisualisation sur le site seront remis au destinataire désigné (ou au propriétaire du compte si aucun destinataire n'a été désigné). Cependant, ils n'apparaîtront pas dans les réponses du site et ne seront pas inclus dans l'exportation CSV.
Pour accéder aux réponses du formulaire dans le tableau de bord du site :
-
Dans la liste des sites, cliquez sur les trois points (
) à côté du site où le formulaire apparaît, cliquez sur Tableau de bord du site, puis sélectionnez Réponse au formulaire (dans la barre latérale d'options, sous Vue d'ensemble du site).
-
Pour exporter les réponses, cliquez sur Exporter au format CSV dans le coin supérieur droit de la section Réponses au formulaire.
-
Pour gérer les réponses, cliquez sur Gérer les réponses.
-
La page Réponses aux formulaires s'ouvre et vous permet de supprimer toute réponse à n'importe quel formulaire du site. Vous pouvez rechercher des réponses pertinentes dans la boîte de recherche des réponses. Veillez à rechercher le nom, la phrase ou les caractères exacts.
-
Cliquez sur l'onglet du formulaire concerné pour ouvrir un tableau avec les données suivantes :
-
La date d 'envoi de la réponse au formulaire.
-
Les données saisies dans chacun des champs du formulaire.
-
Option permettant de supprimer la réponse au formulaire.
-
-
Pour exporter les réponses au formulaire au format CSV, cliquez sur Exporter au format CSV dans le coin supérieur droit de la section Réponses au formulaire. Notez que ce bouton n'est visible que si le formulaire a des réponses sur le site réel.
Pour naviguer vers les réponses du formulaire dans l'éditeur :
-
Cliquez sur Gérer les réponses aux formulaires.
-
L'écran Réponses aux formulaires s'ouvre et vous permet de supprimer toute réponse à n'importe quel formulaire du site. Vous pouvez rechercher des réponses pertinentes dans la boîte de recherche des réponses. Veillez à rechercher le nom, la phrase ou les caractères exacts.
-
Cliquez sur l'onglet du formulaire concerné pour ouvrir un tableau avec les données suivantes :
-
La date d 'envoi de la réponse au formulaire.
-
Les données saisies dans chacun des champs du formulaire.
-
Option permettant de supprimer la réponse au formulaire.
-
Pour exporter les réponses du formulaire :
-
Dans l'éditeur du site, naviguez jusqu'au formulaire souhaité.
-
Cliquez avec le bouton droit de la souris sur le formulaire.
-
Dans le menu contextuel, sélectionnez Télécharger les réponses.
Remarque
Si l'option n'est pas disponible, cela peut signifier qu'il n'y a pas eu de réponses sur le site en ligne.
Pour répondre à un formulaire de contact soumis par un client directement à partir de votre courrier électronique, il vous suffit de cliquer sur Répondre au client dans le courrier électronique que vous recevez de Website Builder. L'adresse électronique de l'auteur de la demande sera automatiquement indiquée dans le champ "To", ce qui vous permettra d'y répondre directement. Veuillez noter que si le client a fourni plusieurs adresses électroniques, seule la première sera utilisée.
Remarque
Si vous répondez de cette manière, l'e-mail peut être marqué comme spam, en fonction de l'e-mail et des paramètres de l'expéditeur. Pour vous assurer que l'expéditeur reçoit bien votre réponse, pensez à copier son adresse électronique et à lui envoyer un nouvel e-mail à la place.
Pour obtenir le consentement des visiteurs de votre site lors de la soumission d'un formulaire de contact, ajoutez un nouveau champ à votre formulaire de contact et sélectionnez Opt-In ou Free Text comme type de champ.
Opt-in ou texte libre
Le champ Opt-in affiche une case à cocher avec le texte de consentement suggéré, que tu peux modifier. Contrairement à d’autres types de champs, le champ Opt-in ne peut pas être défini comme champ obligatoire.
En option, un champ d’adhésion peut être associé à un consentement marketing. Sous le champ Obligatoire et Commencer une nouvelle ligne dans ces options de champ , sélectionnez un canal (Consentement marketing par email ou consentement marketing SMS) dans la section Adhésion marketing . Lorsqu’un visiteur coche la case, son statut de consentement est mis à jour pour ce canal. Sélectionnez « Pas un op-in marketing » si le champ est destiné à un autre usage. Le texte du message d’adhésion suggéré se met à jour en fonction de l’option sélectionnée, et peut être modifié selon les besoins.
En revanche, le champ Texte libre n'affiche que la notification souhaitée. En tant que champ polyvalent, il ne comporte pas de texte par défaut ou suggéré.
Pour ajouter un champ Opt-in ou un champ de texte libre :
Remarque
Si le destinataire de la soumission est vide, c'est l'adresse électronique principale de la bibliothèque de contenu qui sera utilisée. Si ce courriel n'existe pas, le propriétaire du compte sera utilisé comme destinataire par défaut. Toutes les réponses sont renvoyées à la page des réponses au formulaire.
Si vous n'êtes pas en mesure de recevoir les formulaires envoyés à l'aide du formulaire de contact widget, c'est probablement parce que votre courrier est filtré comme spam sur votre serveur de messagerie.
Si vous ne recevez pas d'e-mails de Duda, vérifiez votre dossier spam. Si vous ne voyez toujours pas l'email, assurez-vous d'autoriser les adresses IP 167.89.22.215, 149.72.216.48, 149.72.184.31, 149.72.166.161 et 149.72.162.205 dans les paramètres de votre fournisseur d'accès.
Autres conseils de dépannage :
-
Vérifiez les réponses au formulaire pour vous assurer que le formulaire de contact fonctionne. Vous pouvez cliquer sur le formulaire de contact et sur les réponses au formulaire pour le télécharger.
-
Vérifiez que l'adresse e-mail est bien correcte. Si vous saisissez plusieurs adresses e-mail, n'oubliez pas de les séparer par une virgule (sans espace).
-
Vérifiez votre dossier spam.
-
Vérifiez les paramètres de votre filtre de messagerie et de votre liste de diffusion pour vous assurer qu'ils ne sont pas bloqués. Si vous avez précédemment bloqué l'email de soumission du formulaire, il se peut que l'adresse email soit également ajoutée à la liste de blocage de Duda. Contactez l'assistance et nous supprimerons l'adresse e-mail de la liste de blocage.
-
Ajoutez no-reply@multiscreensite.com à votre liste d'adresses électroniques autorisées.
-
Créez une nouvelle page et placez-y votre formulaire de contact pour vérifier s'il fonctionne.
-
Dans les paramètres de votre site, désactivez tous les scripts personnalisés.
Remarque
Si votre formulaire de contact ne fonctionne toujours pas correctement après que vous avez passé en revue la liste des erreurs potentielles, contactez votre fournisseur de messagerie pour savoir pourquoi les e-mails que nous envoyons ne vous parviennent pas.
S'il fonctionne sur une autre page de votre site mobile mais pas sur la page où il est censé fonctionner, cela signifie généralement qu'un script personnalisé interfère avec le fonctionnement de votre formulaire de contact. Réinitialisez la page ou vérifiez que le code HTML de la page et du site ne contient pas de scripts personnalisés susceptibles de provoquer ce problème.
Il existe un paramètre activé par défaut qui envoie un courrier électronique automatisé avec une copie de la demande.
Pour gérer ce paramètre :
-
Sélectionnez l'onglet Soumission.
-
Cliquez sur Actions après la soumission.
-
Faites défiler vers le bas jusqu'à Paramètres de messagerie.
Pour plus d'informations sur les actions après les soumissions, voir Actions après la soumission.
Pour ajuster la largeur d’un champ de formulaire individuel, cliquez sur le formulaire Contact pour ouvrir le menu flottant. Cliquez sur Gérer le formulaire, puis dans la fenêtre contextuelle, cliquez pour sélectionner le champ souhaité. Sur le côté droit de la fenêtre contextuelle, descendez jusqu’à la section Taille du champ et utilisez le curseur pour sélectionner une taille.