[Résolu] Personnaliser bouton d’envoi (submit) avec Contact form 7

  • WordPress :5.0
  • Statut : résolu
8 sujets de 1 à 8 (sur un total de 8)
  • Auteur
    Messages
  • #2242983
    Clémentine
    Participant
    Initié WordPress
    39 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL : 7.0 et 5.6
    • Thème utilisé : Jupiter
    • Extensions en place : Akismet, artbees theme captcha, antispam bee, broken link checker, classic editor, column shortcode, contact form7, <label class=”screen-reader-text” for=”checkbox_a0dd9ead97a73e120c35cca002b4afbb”>Cookie Notice,<label class=”screen-reader-text” for=”checkbox_73f05e0243175387fe7b0ab68c3995b1″>Cornerstone, <label class=”screen-reader-text” for=”checkbox_d6750a682bf3b474e14650131d721e4c”>Duplicator, Portofolio, Statify, Events calendar, <label class=”screen-reader-text” for=”checkbox_35de47b98b4e46127f59a98f46de8b74″>TinyMCE Advanced</label>, <label class=”screen-reader-text” for=”checkbox_eb9a0a331e3a62a1ec4fe3c0774d96d2″> WPBakery Page Builder </label></label></label></label>
    • Nom de l’hébergeur : OVH
    • Adresse du site : http://www.ladistilleriem.com

    <span style=”display: inline !important; float: none; background-color: #ffffff; color: #333333; cursor: text; font-family: Georgia,’Times New Roman’,’Bitstream Charter’,Times,serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; -webkit-text-stroke-width: 0px; white-space: normal; word-spacing: 0px;”>Problème(s) rencontré(s) : </span>

    Bonjour,

    J’essaie de personnaliser mon bouton d’envoi :

    dans mon formulaire contact form j’ai écrit :

    <div class=”content-column one_half”;>
    <label style=”padding:20px;color:#ffffff;”> Nom* [text* your-name class:marge 30/20] </label></div>

    <div class=”content-column one_half”;>
    <label style=”padding:20px;color:#ffffff;”> Société
    [text societe 30/20]</label></div>

    <div class=”content-column one_half first_column”;>
    <label style=”padding:20px;color:#ffffff;”> Mail*
    [email* your-email class:marge 30/20] </label></div>

    <div class=”content-column one_half”>
    <label style=”padding:20px;color:#ffffff;”> Numéro de téléphone*
    [tel* numerotel 30/20]</label></div>

    <div class=”content-column;”>
    <label style=”padding:20px;color:#ffffff;”> Message
    [textarea your-message class:marge maxlength:125] </label></div>

    </br>
    [submit class:envoi class:marge “Rencontrons-nous”]

    Et dans mon css customize de mon theme , j’ai écris :

    .marge {margin-left:20px;};
    .wpcf7-form-control.wpcf7-submit.envoi.marge {background-color:#3D312D !important;};

    La marge fonctionne bien mais par la couleur du bouton..

    Aïe, auriez-vous des idées ?

    Merci beaucoup d’avance !

    Clémentine

    #2242990
    ouiouiphoto
    Participant
    Maître WordPress
    1536 contributions

    Bonjour

     

    Moi je viens de passer ton bouton en rouge avec

    .wpcf7-submit {
        background-color: #f4524d;
       }

    #2243000
    Clémentine
    Participant
    Initié WordPress
    39 contributions

    Merci beaucoup !!

    Aïe … je viens de mettre votre code  dans mon Css customize et il n’y a aucun changement … j’ai bien vidé le cache …

    Voyez-vous le problème ?

    Merci !

    #2243001
    ouiouiphoto
    Participant
    Maître WordPress
    1536 contributions

    Tu as vidé quel cache ? Car il faut aussi vider celui du navigateur. Ensuite la couleur que tu as choisi 3D312D est la couleur du fond donc ca ne fera rien visuellement

    #2243012
    Clémentine
    Participant
    Initié WordPress
    39 contributions

    Oui j’ai vidé le cahce du navigateur.

    J’ai mis le code avec la couleur rouge, mais ça ne change rien (c’est vrai que rouge c’est quand même mieux … o) ).

    Bizarre

    #2243027
    ouiouiphoto
    Participant
    Maître WordPress
    1536 contributions

    Je en sais pas trop te dire. Tu l’as mis ou ce code ? Moi si je le met dans ta feuille de style ca marche (voir pièce jointe)

    • Cette réponse a été modifiée le il y a 5 mois et 3 weeks par  ouiouiphoto.
    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2243098
    Clémentine
    Participant
    Initié WordPress
    39 contributions

    ok c’est bon, je l’avais dans une option du thème Custom Css, mais je l’ai mis à unautre endroit qui marche bien.

    Merci beaucoup !

     

    #2243109
    ouiouiphoto
    Participant
    Maître WordPress
    1536 contributions

    Parfait 😉

8 sujets de 1 à 8 (sur un total de 8)
  • Vous devez être connecté pour répondre à ce sujet.