• Modifier l'apparence du module Derniers visisteurs

    Modifier l'apparence du module Derniers visisteurs

    Le module derniers visiteurs permet de voir la tête, enfin l'avatar, des membres d'Eklablog qui sont passés sur notre site.

    Pour l'activer : menu Apparence > Nouveau module > Derniers visiteurs

    Pour modifier son emplacement : menu Apparence > Gérer les menus

    Pour modifier son apparence : clic sur le crayon dans la barre de titre du module.

    Modifier l'apparence du module Derniers visisteurs

     Bon alors, la seule chose qu'on peut faire c'est changer le nombre d'avatars qui s'affichent ?  

    C'est une peu limité me direz-vous, mais avec la fenêtre d'édition, c'est effectivement tout ce qu'on peut faire. Mais comme on est jamais à court de ressources, on peut encore faire des modifications, en passant par la feuille de style et tripatouiller le code CSS. On peut alors agir sur la taille des avatars, arrondir les angles, l'apparence des images etc.

    Personnellement, j'ai réduit la taille des images et j'ai arrondi les angles. Voici le code utilisé :

    /* modification du module derniers visiteurs */
    .module_menu_type_lastvisitors img {max-width 60pxborder-radius30px}

    Vous pouvez choisir une autre taille que 60px et modifier chacun des angles à votre convenance (voir : Arrondir les angles dans Eklablog). Vous pouvez aussi modifier l'opacité quand la souris passe sur l'image. Pour cela j'ai ajouté une ligne de code, je ne suis pas sure que cela soit une façon très propre de le faire, mais ça marche : 

    /* modification du module dernier visiteur */
    .module_menu_type_lastvisitors img{max-width:60pxborder-radius:30px;}
    .module_menu_type_lastvisitors img:hover {opacity:0.5;}

     

     

    « Arrondir les angles dans EklablogArrondir une image dans Eklablog »
    Pin It

    Tags Tags : , , , ,
  • Commentaires

    15
    Vendredi 13 Avril 2018 à 13:42

    Merci pour l'astuce je l'ai appliqué chez moi c'est plus joli que des carré

    14
    GinetteD
    Dimanche 28 Août 2016 à 18:42

    Merci. ce matin j'ai fait disparaître mes avatars et je ne me souvenais plus comment les remettre. Bien expliqué , bravo.

    13
    Lundi 18 Avril 2016 à 22:18

    Merci pour ces articles qui font que j'y vois un peu plus clair et mon blog aussi! A bientôt cool

    12
    Dimanche 23 Août 2015 à 15:44

    Bonjour !

    Merci beaucoup ^^ pour ces astuces qui me permettent, petit à petit, de transformer mon blog !

    Bonne fin de vacances.

    A bientôt.

    11
    Mardi 28 Juillet 2015 à 23:02

    Trop bien ! ça a marché ! Merci Pépin.

    10
    Mardi 23 Juin 2015 à 20:19

    Merci d'avoir partager cette astuce !

    9
    Jeudi 23 Octobre 2014 à 22:26
    titou

    Bonsoir .... Merci beaucoup pour tous ces beaux partage ...bonne soirée

    8
    Jeudi 24 Juillet 2014 à 10:58

    Merci !

    7
    Dimanche 27 Avril 2014 à 11:34

    Merci beaucoup pour ce tuto! je viens de le faire sur mon blog! MERCI MERCI happy

    6
    Dimanche 9 Mars 2014 à 15:23

    Ca y est c'est fait d'arrondir mes visiteurs. Pour moi le CCS c'est du chinois mais tu me le rends accessible !!!clown Merci

    5
    Dimanche 9 Mars 2014 à 12:02

    Une astuce tres sympa!! merci!! bon dès que j'ai un moment je m'y attèle!

    4
    Dimanche 9 Mars 2014 à 10:46

    Mais si c'est gentil, c'est gentil d'être passé 

    • Nom / Pseudo :

      E-mail (facultatif) :

      Site Web (facultatif) :

      Commentaire :


    3
    Dimanche 9 Mars 2014 à 10:39

    Oh bah ça ne fait pas très sérieux : Delfynus est venue il y a 1 jour !!! Bon bah me revoilà!

    2
    Samedi 8 Mars 2014 à 18:22

    Pour entrer dans la feuille de style, il faut lire les articles précédents : http://www.pepins-et-citrons.fr/modifier-la-feuille-de-style-css-a106746750

    1
    Samedi 8 Mars 2014 à 18:20

    et comment tu fais pour entrer dans la feuille de style? Je ne sais pas où taper ton code magique ... Cela fait très joli ainsi !

    Suivre le flux RSS des commentaires


    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :