Comment modifier la couleur de fond du champ e-mail

La conception de vos formulaires joue un rôle important dans l'image professionnelle et digne de confiance que votre magasin projette.

Un simple changement comme la mise à jour de la couleur d'arrière-plan d'un champ d'adresse e-mail peut aider :

• Harmonisez votre identité de marque
• Améliorer la lisibilité
• Créer une meilleure hiérarchie visuelle
• Donnez un aspect plus moderne et soigné à vos formulaires de contact.

Avant de commencer

Assurez-vous d'avoir déjà :

• Une page créée dans GemPages
• An Élément de champ de courrier électronique ajouté à votre formulaire
• Accès à l'éditeur GemPages

Aucune connaissance avancée en programmation n'est requise.

Étape 1 : Sélectionnez l’élément de champ Email

Ouvrez votre page dans l'éditeur GemPages. Cliquez sur l'élément « Champ e-mail » que vous souhaitez personnaliser. Ainsi, le style personnalisé ne s'appliquera qu'au champ sélectionné.

Étape 2 : Ouvrez le panneau de code personnalisé

Cliquez avec le bouton droit sur l'élément Champ d'adresse e-mail sélectionné. Choisissez ensuite : Code personnalisé. Le panneau « Code personnalisé » s'affichera.

Étape 3 : Ajouter le code CSS

Collez le code suivant dans l'éditeur de code personnalisé :

ElementClass input {

  couleur de fond : xxxxx !important ;

}

Remarques importantes

1. Vous devez remplacer ElementClass avec le nom de classe réel de votre élément Champ Email.

Vous trouverez le nom de cette classe dans le coin supérieur gauche du panneau Code personnalisé.

Exemple :

.gf-input-123 entrée {

  couleur de fond : #f5f5f5 !important ;

}

2. Remplacez xxxxx par la couleur que vous souhaitez utiliser.

Exemple :

couleur d'arrière-plan : #000000 !important ;

or

couleur de fond : #f5f5f5 !important ;

Comment trouver un code couleur :

Si vous n'avez pas déjà de code couleur, vous pouvez utiliser des outils gratuits comme :

• Sélecteur de couleurs Google
• Sélecteur de couleurs HTML
• Refroidisseurs
• Adobe Color

Ces outils vous permettent de choisir visuellement les couleurs et de copier instantanément les codes HEX.

Exemples de codes HEX :

• # Ffffff → Blanc
• #000000 → Noir
• #f3f3f3 → Gris clair
• #1a73e8 → Bleu

Résultat: