Regarder une vidéo
Regardez cette vidéo pour apprendre à créer et à personnaliser votre formulaire.
Options de personnalisation du formulaire d'accès
Les options de personnalisation d'un formulaire se trouvent sous l'onglet "Style" dans le générateur de formulaire.
Pour accéder à cet onglet pour tout formulaire :
- Cliquez sur "Site web" > "Formulaires" dans le menu de gauche.
- Modifiez ou créez un nouveau formulaire.
- Le constructeur de formulaires se chargera. Toutes les options d'édition et de style apparaîtront dans le volet de droite. Cliquez sur l'onglet "Style" situé dans le volet de droite.
Personnaliser un formulaire en ligne
Avec le formulaire en ligne, vous pouvez choisir une mise en page et personnaliser le style du formulaire et du bouton d'envoi.
Mise en page
Cliquez sur l'une des options pour choisir une disposition horizontale ou verticale de votre formulaire.
Style du formulaire
La case "Style du formulaire" vous permet de personnaliser la façon dont le formulaire apparaîtra aux visiteurs de votre site web. Le tableau ci-dessous présente toutes les options de style de formulaire.
Options de personnalisation du style de formulaire | Description |
---|---|
Contexte | Changez la couleur de fond de votre formulaire ou rendez-le transparent. Les images de fond ne sont pas prises en charge par ce type de formulaire. |
Couleur de la police | Changez la couleur du texte qui apparaît sur votre formulaire. |
Police | Modifiez le type de police du formulaire pour qu'il corresponde à votre marque. |
Frontière | Utilisez cette option pour ajouter une bordure à votre formulaire. Les frontières sont définies comme une valeur de pixel. Vous pouvez augmenter ou diminuer la bordure, modifier la couleur de la bordure et choisir parmi quatre types de bordure différents : Solide, pointillé, pointillé et double. |
Rayon du coin | Utilisez cette option pour rendre les coins de votre formulaire arrondis ou carrés. Le rayon du coin est défini comme une valeur en pixels. |
Largeur | Utilisez cette option pour ajuster la largeur de votre formulaire. La largeur est définie comme une valeur en pixels. |
Bouton
La case "Bouton" vous permet de personnaliser l'apparence du bouton d'envoi de votre formulaire. Vous trouverez ci-dessous un tableau affichant toutes les options de personnalisation des boutons.
Options de personnalisation des boutons | Description |
---|---|
Contexte | Changez la couleur de fond du bouton d'envoi. |
Texte | Changez la couleur du texte du bouton. |
Frontière | Utilisez cette option pour ajouter une bordure à votre bouton. Les frontières sont définies comme une valeur de pixel. Vous pouvez augmenter ou diminuer la bordure, modifier la couleur de la bordure et choisir parmi quatre types de bordure différents : Solide, pointillé, pointillé et double. |
Rayon du coin | Utilisez cette option pour rendre les coins de votre bouton arrondis ou carrés. Le rayon du coin est défini comme une valeur en pixels. |
Marge intérieure | La marge intérieure est l'espace autour de votre bouton. Vous pouvez utiliser cette option pour augmenter ou diminuer la marge intérieure. Il s'agit d'une valeur en pixels. |
Notez que vous ne pourrez pas régler la hauteur ou la largeur du bouton ici. Vous devrez utiliser un CSS personnalisé pour effectuer ces ajustements.
Personnaliser un formulaire pop-up modal
Avec le formulaire modal pop-up, vous pouvez choisir une mise en page et personnaliser le style du formulaire, des champs de saisie et du bouton d'envoi.
Mise en page
Vous pouvez choisir parmi quatre options pour votre formulaire : pas d'image, image à gauche, image en haut ou image au milieu.
Style modal
La case "Style modal" vous permet de personnaliser la façon dont le formulaire apparaîtra aux visiteurs de votre site web. Vous trouverez ci-dessous un tableau affichant toutes les options de personnalisation de le modal
Options de personnalisation du style modal | Description |
---|---|
Contexte | Cliquez sur le sélecteur de couleurs pour changer la couleur de votre formulaire ou ajouter une image de fond. |
Contexte | Cliquez sur le sélecteur de couleurs pour changer la couleur de votre formulaire ou ajouter une image de fond. |
Police | Modifiez le type de police du formulaire pour qu'il corresponde à votre marque. |
Largeur | Utilisez cette option pour ajuster la largeur de votre formulaire. La largeur est définie comme une valeur en pixels. |
Marge intérieure | La marge intérieure est l'espace qui entoure votre formulaire. Vous pouvez utiliser cette option pour augmenter ou diminuer la marge intérieure. Il s'agit d'une valeur en pixels. |
Rayon du coin | Utilisez cette option pour rendre les coins de votre formulaire arrondis ou carrés. Le rayon du coin est défini comme une valeur en pixels. |
Ombre | Utilisez ceci pour ajouter une ombre à votre formulaire. Cela l'aidera à se démarquer. Vous pouvez choisir parmi les options suivantes : Aucun, Léger, Moyen, et Lourd. |
Entrées
Les entrées se rapportent aux champs que les visiteurs du site web utiliseront pour vous soumettre leurs informations personnelles. Les options de personnalisation des entrées comprennent :
Options de personnalisation des entrées | Description |
---|---|
Contexte | Cliquez sur le sélecteur de couleur pour changer la couleur des champs de saisie. |
Couleur de la police | Cliquez sur le sélecteur de couleur pour changer la couleur du texte du champ de saisie. |
Rayon du coin | Utilisez cette option pour rendre les coins des champs de saisie arrondis ou carrés. Le rayon du coin est défini comme une valeur en pixels. |
Bouton
La case "Bouton" vous permet de personnaliser l'apparence du bouton d'envoi de votre formulaire. Les options de personnalisation des boutons comprennent :
Options de personnalisation des boutons | Description |
---|---|
Contexte | Changez la couleur de fond du bouton d'envoi. |
Texte | Changez la couleur du texte du bouton. |
Frontière | Utilisez cette option pour ajouter une bordure à votre bouton. Les frontières sont définies comme une valeur de pixel. Vous pouvez augmenter ou diminuer la bordure, modifier la couleur de la bordure et choisir parmi quatre types de bordure différents : Solide, pointillé, pointillé et double. |
Rayon du coin | Utilisez cette option pour rendre les coins de votre bouton arrondis ou carrés. Le rayon du coin est défini comme une valeur en pixels. |
Marge intérieure | Utilisez cette option pour ajuster la marge intérieure de votre bouton. La marge intérieure est définie comme une valeur de pixel. |
Notez que vous ne pourrez pas régler la hauteur ou la largeur du bouton ici. Vous devrez utiliser un CSS personnalisé pour effectuer ces ajustements.
Personnaliser un formulaire à boîte flottante
Avec le formulaire à boîte flottante, vous pouvez choisir une mise en page et personnaliser le style du formulaire, des champs de saisie et du bouton d'envoi.
Mise en page
Vous pouvez choisir parmi quatre options pour votre formulaire : pas d'image, image à gauche, image en haut ou image au milieu.
Style de la boîte
La case "Style du formulaire" vous permet de personnaliser la façon dont le formulaire apparaîtra aux visiteurs de votre site web. Les options de personnalisation du style de formulaire comprennent :
Options de personnalisation du style de la boîte | Description |
---|---|
Contexte | Cliquez sur le sélecteur de couleurs pour changer la couleur de votre formulaire ou ajouter une image de fond. |
Couleur de la police | Changez la couleur du texte qui apparaît sur votre formulaire. |
Police | Modifiez le type de police du formulaire pour qu'il corresponde à votre marque. |
Largeur | Utilisez cette option pour ajuster la largeur de votre formulaire. La largeur est définie comme une valeur en pixels. |
Marge intérieure | La marge intérieure est l'espace qui entoure votre formulaire. Vous pouvez utiliser cette option pour augmenter ou diminuer la marge intérieure. Il s'agit d'une valeur en pixels. |
Rayon du coin | Utilisez cette option pour rendre les coins de votre formulaire arrondis ou carrés. Le rayon du coin est défini comme une valeur en pixels. |
Ombre | Utilisez ceci pour ajouter une ombre à votre formulaire. Cela l'aidera à se démarquer. Vous pouvez choisir parmi les options suivantes : Aucun, Léger, Moyen, et Lourd. |
Entrées
Les entrées se rapportent aux champs que les visiteurs du site web utiliseront pour vous soumettre leurs informations personnelles. Les options de personnalisation des entrées comprennent :
Options de personnalisation des entrées | Description |
---|---|
Contexte | Cliquez sur le sélecteur de couleur pour changer la couleur des champs de saisie. |
Couleur de la police | Cliquez sur le sélecteur de couleur pour changer la couleur du texte du champ de saisie. |
Rayon du coin | Utilisez cette option pour rendre les coins des champs de saisie arrondis ou carrés. Le rayon du coin est défini comme une valeur en pixels. |
Bouton
La case "Bouton" vous permet de personnaliser l'apparence du bouton d'envoi de votre formulaire. Les options de personnalisation des boutons comprennent :
Options de personnalisation des boutons | Description |
---|---|
Contexte | Changez la couleur de fond du bouton d'envoi. |
Texte | Changez la couleur du texte du bouton. |
Frontière | Utilisez cette option pour ajouter une bordure à votre bouton. Les frontières sont définies comme une valeur de pixel. Vous pouvez augmenter ou diminuer la bordure, modifier la couleur de la bordure et choisir parmi quatre types de bordure différents : Solide, pointillé, pointillé et double. |
Rayon du coin | Utilisez cette option pour rendre les coins de votre bouton arrondis ou carrés. Le rayon du coin est défini comme une valeur en pixels. |
Marge intérieure | Utilisez cette option pour ajuster la marge intérieure de votre bouton. La marge intérieure est définie comme une valeur de pixel. |
Notez que vous ne pourrez pas régler la hauteur ou la largeur du bouton ici. Vous devrez utiliser un CSS personnalisé pour effectuer ces ajustements.
Personnaliser un formulaire de barre flottante
Avec le formulaire à barre flottante, vous pouvez personnaliser le style du formulaire et le bouton d'envoi. Les options de mise en page ne sont pas disponibles avec ce type de formulaire.
Style du bar
La case "Style du bar" vous permet de personnaliser la façon dont le formulaire apparaîtra aux visiteurs de votre site web. Les options de personnalisation du style de bar comprennent :
Options de personnalisation du style des barres | Description |
---|---|
Contexte | Changez la couleur de fond de votre formulaire. Les images de fond ne sont pas prises en charge par ce type de formulaire. |
Couleur de la police | Changez la couleur du texte qui apparaît sur votre formulaire. |
Police | Modifiez le type de police du formulaire pour qu'il corresponde à votre marque. |
Bouton
La case "Bouton" vous permet de personnaliser l'apparence du bouton d'envoi de votre formulaire. Les options de personnalisation des boutons comprennent :
Options de personnalisation des boutons | Description |
---|---|
Contexte | Changez la couleur de fond du bouton d'envoi. |
Texte | Changez la couleur du texte du bouton. |
Frontière | Utilisez cette option pour ajouter une bordure à votre bouton. Les frontières sont définies comme une valeur de pixel. Vous pouvez augmenter ou diminuer la bordure, modifier la couleur de la bordure et choisir parmi quatre types de bordure différents : Solide, pointillé, pointillé et double. |
Rayon du coin | Utilisez cette option pour rendre les coins de votre bouton arrondis ou carrés. Le rayon du coin est défini comme une valeur en pixels. |
Marge intérieure | Utilisez cette option pour ajuster la marge intérieure de votre bouton. La marge intérieure est définie comme une valeur de pixel. |
Notez que vous ne pourrez pas régler la hauteur ou la largeur du bouton ici. Vous devrez utiliser un CSS personnalisé pour effectuer ces ajustements.
Modifier le texte du bouton "Soumettre
Vous pouvez modifier le texte du bouton "Soumettre" pour n'importe quel formulaire.
- À partir de la page des formulaires, , cliquez sur le bouton "Modifier" pour le formulaire que vous souhaitez mettre à jour.
- Cliquez sur le bouton "Soumettre" dans le générateur de formulaire.
- Le menu de droite affiche l'label du bouton et un champ. Tapez le texte que vous souhaitez utiliser pour le bouton.
Le texte du nouveau bouton sera enregistré automatiquement.
Personnalisation avancée
Chaque type de formulaire dans Activecampagne dispose d'une option CSS personnalisée. Il s'adresse aux utilisateurs avancés qui connaissent le CSS et sont à l'aise avec son utilisation. L'option CSS personnalisée se trouve sous l'onglet "Style" de chaque formulaire et peut être utilisée pour ajouter des modifications supplémentaires à tout élément du formulaire. Par exemple, vous pouvez utiliser cette option pour :
- Ajuster la largeur et la hauteur des champs de saisie
- Ajustez la largeur et la hauteur du bouton d'envoi
- Ajuster la taille de la police
- Ajustez le type de police pour les éléments singuliers. Par exemple, vous pouvez l'utiliser pour que la police du texte du bouton soit différente du reste du formulaire
Si vous souhaitez en savoir plus sur l'utilisation de CSS, consultez le tutoriel CSS de w3schools.com.
Pour utiliser l'option CSS personnalisé :
- Dans le Form Builder, , cliquez sur l'onglet "Style".
- Faites défiler la page jusqu'à ce que vous voyiez la case "Custom CSS".
- Cliquez sur le bouton "Inspecteur" puis cliquez sur l'élément de formulaire que vous souhaitez modifier.
- Une fois que vous avez cliqué sur l'élément que vous souhaitez personnaliser, il apparaîtra dans la zone CSS personnalisé. Tapez le CSS dans cette case.
Le CSS que vous ajoutez à l'élément de formulaire sera enregistré automatiquement.
Désactiver la marque Activecampagne
Si vous êtes sur un plan Plus, Professionnel ou Enterprise, vous pouvez supprimer la marque Activecampagne de votre formulaire. Les utilisateurs de la formule Lite Plan ne sont pas en mesure de désactiver la marque.
Désactiver la marque Activecampagne
- Dans le Form Builder, , cliquez sur l'onglet "Style".
- Faites défiler le site jusqu'à ce que vous voyiez la case "Divers".
- Cliquez sur le commutateur à bascule de la marque AC pour le mettre sur la position "Off".
Ce paramètre sera sauvegardé automatiquement.
Cet article a-t-il été utile ?
C'est super !
Merci pour votre commentaire
Désolé ! Nous n'avons pas pu vous être utile
Merci pour votre commentaire
Commentaires envoyés
Nous apprécions vos efforts et nous allons corriger l'article