[Résolu] Thème thwenty sixteen – icônes du menu des réseaux sociaux

  • WordPress :5.2
  • Statut : résolu
15 sujets de 1 à 15 (sur un total de 17)
  • Auteur
    Messages
  • #2268434
    philrosevert
    Participant
    Initié WordPress
    30 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL : 7.2
    • Thème utilisé : twenty sixteen
    • Extensions en place :
    • Nom de l’hébergeur : ovh
    • Adresse du site : therapies-alternatives-bordeaux.fr

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

    Bonjour,

    Je voudrais que l’icône de Viadéo (le troisième icône de réseaux sociaux : voir copie d’écran jointe) s’affiche dans le menu comme celui de facebook et de twitter.

    Est-ce possible et comment le rajouter ?

    Je vous remercie beaucoup pour votre aide,

    Philippe

    • Ce sujet a été modifié le il y a 1 mois et 2 weeks par  PhiLyon.
    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2268458
    PhiLyon
    Modérateur
    Maître WordPress
    23337 contributions

    Bonjour.

    C’est dans quel menu, je ne vois pas les autres icônes ?

    🙂

    #2268465
    philrosevert
    Participant
    Initié WordPress
    30 contributions

    Bonjour PhiLyon,

    Voici le lien : https://therapies-alternatives-bordeaux.fr/

    Vous avez les icônes en bas à droite…. 🙂

    Sur mobile on les voit en haut…

    Merci. Vous pensez pouvoir m’aider ?

    Philippe

    #2268466
    PhiLyon
    Modérateur
    Maître WordPress
    23337 contributions

    Tu as mis l’url de ton compte dans ton menu ?

    🙂

    #2268468
    philrosevert
    Participant
    Initié WordPress
    30 contributions

    oui j’ai mis l’url de mon compte Viadéo sur le troisième ”rond” ; ce que je voudrais si possible c’est avoir l’icône ‘Viadéo’ comme pour Facebook et Twitter…(le dessin si vous préférez). 🙂

    #2268662
    philrosevert
    Participant
    Initié WordPress
    30 contributions

    Bonjour,

    Excuse-moi, je me suis mal exprimé la dernière fois, la fatigue et la chaleur… En fait voici le bon terme, c’est le ‘logo’ de Viadéo qui n’apparaît pas sur le bouton rond du menu des réseaux sociaux (le troisième après facebook et twitter). La question était donc de savoir si on pouvait le faire apparaître sans que ça demande trop de code compliqué ! ?

    Merci et belle journée !

     

    #2268674
    PhiLyon
    Modérateur
    Maître WordPress
    23337 contributions

    Bonjour.

    Après quelques recherches il s’avère que le logo Viadeo n’est pas prévu dans les “genericons” de Twenty Sixteen.

    Pour palier à ça :

    • Télécharges le logo Viadeo dans ta bibliothèque (sur Google il y en a à profusion)
    • Dans ton lien personnalisé Viadeo ajoutes une classe CSS (si tu n’as pas possibilité regardes dans Options de l’écran)
    • Dans Apparence/Personnaliser/CSS additionnel colles le code ci-dessous en changeant l’url
    .logoviadeo {
    background-image: url('http://tests-forum-wpfr.local/wp-content/uploads/2019/03/wp-icon.png');
    background-repeat: no-repeat;
    background-position: center;
    text-align:center;
    }
    
    .social-navigation a::before {
        content: "";
    }

    Tu auras peut-être un réglage de taille d’image du logo à ajouter dans le CSS

    🙂

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2268676
    philrosevert
    Participant
    Initié WordPress
    30 contributions

    Merci,

    Je fais ça dès que possible et je te tiens au courant!

    #2268782
    philrosevert
    Participant
    Initié WordPress
    30 contributions

    Bonjour,

    J’ai fait le point 1 et le point 3.

    Pour le point 2, en effet je n’ai pas la possibilité de rajouter une classe CSS dans mon lien personnalisé. Donc tu me dis d’aller voir dans Option de l’écran mais je ne sais pas ce que c’est ni où cela se trouve.

    Aussi est-ce normal qu’il n’y ait rien entre les guillemets dans content ici :

    <code class=" code-embed-code language-css"><span class="token selector"><span class="token class">.social-navigation</span> a<span class="token pseudo-element">::before</span> </span><span class="token punctuation">{</span>
        <span class="token property">content</span><span class="token punctuation">:</span> <span class="token string">""</span><span class="token punctuation">;</span>
    ??
    Merci.
    #2268787
    PhiLyon
    Modérateur
    Maître WordPress
    23337 contributions

    Bonjour.

    Pour les classes regarde l’image, pour le content c’est pour supprimer l’icône qui apparait d’office s’il en a une indisponible.

    🙂

    • Cette réponse a été modifiée le il y a 1 mois et 2 weeks par  PhiLyon.
    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2268993
    philrosevert
    Participant
    Initié WordPress
    30 contributions

    Bonjour PhiLyon,

    Merci, j’ai avancé ! J’ai coché les classes CSS dans l’option de l’écran. Ca marche, l’image du logo est chargée. Par contre il y a un problème de résolution.

    Le logo est au format PNG, mais carré 500*500 avec le logo viadéo rond au milieu (voir PJ). Du coup on voit un carré noir dans le menu des réseaux sociaux..

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2269034
    PhiLyon
    Modérateur
    Maître WordPress
    23337 contributions

    Bonjour.

    Essaies avec celui-là (fichier joint)

    🙂

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2269047
    philrosevert
    Participant
    Initié WordPress
    30 contributions

    Non plus !

    Tu peux vérifier par toi-même en allant voir : https://therapies-alternatives-bordeaux.fr/

    C’est mieux car plus petit et blanc mais on voit toujours pas le logo 🙂

    #2269055
    PhiLyon
    Modérateur
    Maître WordPress
    23337 contributions

    Essaies avec ce code (et la bonne url)

    .logoviadeo {
    background-image: url('http://tests-forum-wpfr.local/wp-content/uploads/2019/07/viadeo-png-320x320.png');
    background-repeat: no-repeat;
    background-position: center;
    text-align:center;
    	background-size:100%
    }
    
    .social-navigation a::before {
        content: "";
    }

    🙂

    • Cette réponse a été modifiée le il y a 1 mois et 1 week par  PhiLyon.
    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2269061
    philrosevert
    Participant
    Initié WordPress
    30 contributions

    Ca marche !

    Perfectionniste que je suis, il ne change pas de couleur au passage de la souris ! 🙂 …comme les deux autres. Ca c’est un truc par défaut du thème je pense ! Le thème utilise les couleurs par défaut paramétrées dans ‘Personnaliser’->’Couleurs’

    Donc voilà si tu peux coder encore un peu afin qu’il devienne rouge (couleur #dd3333) au passage de la souris, sinon tant pis, ça ira comme ça.

    J’en profite pour te demander pourquoi WP crée plusieurs fichiers petits thumbnails à chaque rajout d’image dans la bibliothèque ? A quoi servent ces thumbnails d’une part et y a-t-il un plugin qui permet de les supprimer, au moins ceux qui ne sont pas utilisés ?

    Enfin, je ne sais pas comment te remercier…est-ce que je peux te mettre un avis quelque part ou quelque chose comme ça ? Je suis nouveau sur ce forum d’entraide…

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