Toute la documentation
Yaxii Smart Form — Formulaire de commande COD WooCommerce
Yaxii Smart Form — Formulaire de commande COD WooCommerce · Documentation

Modifier les couleurs et styles

Le problème que ce guide résout

Un formulaire dont les couleurs ne correspondent pas à l’identité visuelle de votre boutique nuit à la confiance de vos clients. Ce guide vous montre exactement quels paramètres contrôlent chaque aspect visuel — et comment les modifier en quelques clics pour obtenir un formulaire qui ressemble à votre marque.

Où trouver les paramètres d’apparence

Dans le menu WordPress, allez dans Yaxii Smart Form > Paramètres du formulaire, puis cliquez sur l’onglet Apparence.

[Screenshot: Page des paramètres du formulaire avec l’onglet « Apparence » sélectionné, montrant les sections Thème, Couleurs et Mode sombre]

Choisir un thème de formulaire

Yaxii Smart Form propose plusieurs thèmes prédéfinis qui modifient le style général du formulaire en une seule action.

  1. 1
    Ouvrir le sélecteur de thème
    Dans l’onglet Apparence, repérez la section Thème du formulaire. Cliquez sur le menu déroulant Modèle de formulaire pour afficher les thèmes disponibles.

    [Screenshot: Menu déroulant « Modèle de formulaire » ouvert avec plusieurs noms de thèmes listés]

  2. 2
    Sélectionner et prévisualiser
    Cliquez sur un thème. L’aperçu du formulaire se met à jour immédiatement à droite pour vous montrer l’effet visuel exact.
  3. 3
    Enregistrer
    Une fois satisfait, cliquez sur Enregistrer les modifications en bas de la page.

Personnaliser les couleurs individuellement

Si aucun thème ne correspond exactement à votre charte graphique, affinez trois couleurs séparément :

ParamètreCe qu’il contrôle visuellement
Couleur principaleBouton de commande, accents actifs et éléments de sélection
Couleur de fondFond général du bloc formulaire
Couleur du texteÉtiquettes des champs et valeurs saisies par le client

Pour modifier une couleur, cliquez sur le carré de couleur en regard du paramètre, puis choisissez une teinte dans le sélecteur ou saisissez directement un code hexadécimal (ex. : #E63946).

[Screenshot: Les trois sélecteurs de couleur alignés — Couleur principale, Couleur de fond, Couleur du texte — avec le sélecteur de teinte ouvert sur la couleur principale]

Activer le mode sombre

Si votre boutique utilise un thème sombre ou si votre clientèle préfère ce mode d’affichage, activez l’option correspondante dans l’onglet Apparence :

  • Activez l’interrupteur Activer le mode sombre.
  • Sélectionnez un thème sombre dans le menu déroulant qui apparaît.

[Screenshot: Interrupteur « Activer le mode sombre » en position ON avec le menu de sélection du thème sombre affiché en dessous]

Et ensuite ?

L’apparence est configurée. Passez maintenant à la gestion des champs, des textes et de la mise en page.

→ Lire : Gérer les champs, les textes et la mise en page du formulaire