Modifier les couleurs des icônes dans mon thème OnePageExpress

  • WordPress :4.9
  • Statut : non résolu
15 sujets de 1 à 15 (sur un total de 36)
  • Auteur
    Messages
  • #2090186
    Calolyne
    Participant
    Initié WordPress
    19 contributions

    Bonjour,

    Ma configuration WP actuelle 4.9.4

    • Version de PHP/MySQL :
    • Thème utilisé : One page express
    • Extensions en place :
    • Nom de l’hébergeur : OVH
    • Adresse du site : cbtconseils.fr

    Problème(s) rencontré(s) :

    Je suis novice en la matière.

    J’ai installé un thème enfant pour mon site. J’aimerai modifier la couleur de mes icônes.

    Seulement, impossible de le faire. En inspectant les éléments sur ma page, les codes css ne sont pas les mêmes quand je vais dans mon fichier style.css

    Quelqu’un peut il m’aider ?

    Je ne sais pas si je vous ai donné toutes les infos.

     

    Merci d’avance.

    #2090196
    PhiLyon
    Modérateur
    Maître WordPress
    19004 contributions

    Bonjour.

    Colles ce code dans ton style.css enfant, essaies et si c’est bon changes les couleurs (je n’ai pas vérifié si cela influait ailleurs)

    /* Service 1*/
    .features-coloured-icon-boxes-featurecol:nth-of-type(4n+1) a.features-coloured-button, .features-coloured-icon-boxes-featurecol:nth-of-type(4n+1) .features-coloured-icon-boxes-iconcontainer {
        background-color: #FF358B !important;
    }
    /* Service 2*/
    .features-coloured-icon-boxes-featurecol:nth-of-type(4n+2) a.features-coloured-button, .features-coloured-icon-boxes-featurecol:nth-of-type(4n+2) .features-coloured-icon-boxes-iconcontainer {
        background-color: #BD8D46 !important;
    }
    /* Service 3*/
    .features-coloured-icon-boxes-featurecol:nth-of-type(4n+3) a.features-coloured-button, .features-coloured-icon-boxes-featurecol:nth-of-type(4n+3) .features-coloured-icon-boxes-iconcontainer {
        background-color: #96CA2D !important;
    }
    /* Service 4*/
    .features-coloured-icon-boxes-featurecol:nth-of-type(4n+4) a.features-coloured-button, .features-coloured-icon-boxes-featurecol:nth-of-type(4n+4) .features-coloured-icon-boxes-iconcontainer {
        background-color: #ADCF4F !important;
    }

    🙂

    #2097487
    Calolyne
    Participant
    Initié WordPress
    19 contributions

    Bonjour PhiLyon,

     

    Ca marche, super ! Visiblement pas d’impact ailleurs.

    Pour modifier les icônes qui restent bleu, le liseret bleu autour de la photo et les mots en surbrillance bleu, vous auriez le même type de code à entrer dans mon thème enfant ?

    Merci d’avance.

    #2097543
    PhiLyon
    Modérateur
    Maître WordPress
    19004 contributions

    Bonjour.

    Pour modifier les icônes qui restent bleu

    Où, quelles icônes ?

    Pour le liseré bleu autour de Caroline

    img.team-small-memberimg-normal {
        border-color: #03A8F4;
    }

    les mots en surbrillance bleu

    Quels mots ?

    Et pour trouver seul/seule le code à modifier https://developer.mozilla.org/fr/docs/Outils/Inspecteur

    🙂

    #2098582
    Calolyne
    Participant
    Initié WordPress
    19 contributions

    Bonjour,

    Merci pour toutes ces infos précieuses.

    Pour les icônes, je parle de ceux en page principal (découvrir l’ensemble des services, et ceux sur lesquels il y a noté en bas de page « read more »). En fait, je veux retirer tous les endroits où il y a ce bleu turquoise.

    J’avais déjà fait avec l’inspecteur d’éléments. Mais je ne parvenais pas à trouver quels codes prendre quand je sélectionnais ma cible à modifier.

    Bref, avec vos infos, je comprends mieux.

     

    Par contre, dans mon thème enfant, j’ai juste à copier coller à la suite (à la ligne d’en dessous) les modifications que je veux ?

    Car je viens de le faire avec le liseré, dont j’ai modifié la couleur et ça ne change pas…

    Sur mon fichier style.css, j’ai modifié le code couleur de mes icones, en dessous j’ai copié/collé le code pour le liseré bleu. Est ce ça qui pose problème ?

    /* Service 1*/
    .features-coloured-icon-boxes-featurecol:nth-of-type(4n+1) a.features-coloured-button, .features-coloured-icon-boxes-featurecol:nth-of-type(4n+1) .features-coloured-icon-boxes-iconcontainer {
        background-color: #BCC9E4 !important;
    }
    /* Service 2*/
    .features-coloured-icon-boxes-featurecol:nth-of-type(4n+2) a.features-coloured-button, .features-coloured-icon-boxes-featurecol:nth-of-type(4n+2) .features-coloured-icon-boxes-iconcontainer {
        background-color: #C2DAC7 !important;
    }
    /* Service 3*/
    .features-coloured-icon-boxes-featurecol:nth-of-type(4n+3) a.features-coloured-button, .features-coloured-icon-boxes-featurecol:nth-of-type(4n+3) .features-coloured-icon-boxes-iconcontainer {
        background-color: #D4CCD5 !important;
    }
    /* Service 4*/
    .features-coloured-icon-boxes-featurecol:nth-of-type(4n+4) a.features-coloured-button, .features-coloured-icon-boxes-featurecol:nth-of-type(4n+4) .features-coloured-icon-boxes-iconcontainer {
        background-color: #D5D49C !important;
    }
    img.team-small-memberimg-normal {
        border-color: #F9F9F9;
    }
    button.blue {
        background-color: #03a9f4;
        color: #ffffff;
    }

    Merci d’avance 🙂

    #2098600
    PhiLyon
    Modérateur
    Maître WordPress
    19004 contributions

    Bonjour.

    Essaies comme ça

    img.team-small-memberimg-normal {
        border-color: #F9F9F9 !important;
    }
    button.blue {
        background-color: #03a9f4 !important;
        color: #ffffff;
    }

    🙂

    #2098602
    Calolyne
    Participant
    Initié WordPress
    19 contributions

    Ca fonctionne pour le liseré autour de la photo.

    Par contre, ça ne marche pas pour mes boutons à fond bleu turquoise…

    #2098608
    PhiLyon
    Modérateur
    Maître WordPress
    19004 contributions

    Tu n’as pris la bonne classe, c’est ici qu’il faut modifier

    .button.blue:hover, .button.blue:active {
        background-color: #0299de;
    }

    🙂

    #2098616
    Calolyne
    Participant
    Initié WordPress
    19 contributions

    Alors justement, lorsque je fais veux voir le codage :

    Je clique droit pour inspecter l’élément. Mais quand je vais dans « règles », je ne retrouve pas ce code…?

    Idem quand je veux modifier le texte « read more ». Je ne trouve pas le code me permettant de modifier la phrase.

    #2098619
    PhiLyon
    Modérateur
    Maître WordPress
    19004 contributions

    Le texte Read more est traduit, je ne sais pas ce que tu as fait ?

    🙂

    #2098620
    PhiLyon
    Modérateur
    Maître WordPress
    19004 contributions

    Comment as-tu créé ton thème enfant ?

    🙂

    #2098621
    Calolyne
    Participant
    Initié WordPress
    19 contributions

    Je n’ai rien fait justement… 🙂

    C’est comme ça depuis le début, je n’ai rien modifié.

    #2098622
    Calolyne
    Participant
    Initié WordPress
    19 contributions

    Je l’ai généré avec WP Marmite, il a créé un générateur de thème enfant.

    #2098630
    PhiLyon
    Modérateur
    Maître WordPress
    19004 contributions

    Bah je viens de tester, il ne fonctionne pas, essaies de créer ton thème enfant avec cette extension https://fr.wordpress.org/plugins/child-theme-configurator/

    🙂

    #2098644
    Calolyne
    Participant
    Initié WordPress
    19 contributions

    Je ne parviens pas à mettre le thème enfant.

    WP me dit :

    Les thèmes suivants sont installés mais incomplets. Il manque la feuille de style…

    J’ai téléchargé le fichier zip, extrait le fichier sur mon serveur et là, pas possible de l’activer.

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