28 janv. 2013

Widget Commentaires Récents Avec Avatars Pour Blogger

Commentaires Récents Icone
Ajouter le widget "Commentaires Récents Avec Avatar" pour afficher les derniers commentaires de votre blog Blogger.
Si vous voulez contrôler complètement ce qui apparaît sur votre blog, voici un article présentant une fonction affichant la liste des derniers commentaires.
Le gadget "Commentaires Récents" affiche le nom du commentateur, son avatar, un extrait du commentaire et un lien lire la suite.
En plus, le widget est facile à utiliser et à personnaliser.




Démonstration

Voici une capture d'écran du résultat final :
Recents Comments With Avatar

Ajouter Le Widget Commentaires Récents Avec Images à Blogger

Connectez-vous à Blogger, allez dans "Mise En Page" ➥ "Ajouter Un Gadget" ➥ dans la liste proposée sélectionnez "HTML/JavaScript" ➥ choisissez le titre du gadget (ex: Commentaires Récents) et copier/coller le code suivant dans la grande case puis cliquez sur "Enregistrer"
<style type="text/css">
    ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
    .w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !

important;display:block;clear:both;overflow:hidden;list-style:none;}
    .w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-

shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
    .avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
    .w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
    .w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
    numComments     = 5,
    showAvatar     = true,
    avatarSize     = 30,
    roundAvatar    = true,
    characters     = 40,
    showMorelink    = true,
    moreLinktext    = "Suite »",
    defaultAvatar     = "http://www.gravatar.com/avatar/?d=mm",
    hideCredits    = true;
//]]>
</script>
<script type="text/javascript" src="http://commentaire-recents.googlecode.com/files/Tblogueur.js"></script>
<script type="text/javascript" src="http://www.theblogueur.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>

Personnalisation Du Gadget

Vous pouvez,si vous voulez, personnaliser le widget "Commentaires Récents" en modifiant les valeurs suivantes :
    numComments     = 5➥ Le nombre de commentaires à afficher
    showAvatar     = true,
Si vous voulez désactiver l'affichage d’avatars remplacer true par false
    avatarSize     = 30,
La taille de l'avatar en pixel, remplacer 30 avec la valeur que vous voulez
    roundAvatar    = true, Pour afficher les avatars en carrés, remplacer true par false
    characters     = 40,
le nombre de caractère à afficher
    showMorelink    = true,
Afficher ou non un lien lire la suite
    moreLinktext    = "Suite »",
le titre du lien lire la suite
    defaultAvatar     = "http://www.gravatar.com/avatar/?d=mm",
  url des avatars par défaut
 
Vous devez absolument modifier http://www.theblogueur.blogspot.com avec l'adresse de votre blog.

29 commentaires:

  1. Merci... c'était gênant de ne pas pouvoir afficher les deniers commentaires

    RépondreSupprimer
  2. Cool, fonction très utile. Serait-il possible d'avoir une option supplémentaire qui permettrait d'afficher l'article dans lequel le commentaire est posté (par exemple à côté de l'identifiant du "commenteur")

    RépondreSupprimer
  3. Moi aussi je serai bien intéresser pour qu'on puisse intégré le titre de l'article dans la liste des derniers commentaire.
    Parce que j'ai essayer d’intégrer d'autre code Html, et ben j'y arrive pas vraiment.

    Merci d'avance pour le coups de main :)

    RépondreSupprimer
  4. bonjour,

    Je l'ai installé depuis quelque temps déjà et il fonctionnait bien sous Firefox et Chrome.
    Mais depuis qq jours il ne fonctionne plus sous Chrome, il n'y a plus d'affichage.
    Que faut-il faire ?
    Merci

    Mon blog : http://www.perdre-la-raison.com/

    RépondreSupprimer
  5. Comment ne pas faire apparaître ma réponse aux commentaires sur le widget ? Je préfère mettre en valeur mes commentateurs. Merci beaucoup pour votre réponse

    RépondreSupprimer
  6. Super! Très facile, pratique et utile. Merci

    RépondreSupprimer
  7. Super ça fontionne parfaitement sur mon blog : http://fewy-marchenordique.blogspot.fr/

    RépondreSupprimer
    Réponses
    1. Comment avez vous fait? Avez vous vous une astuces ? Moi personnellement rien ne fonctionne je me demande même si les commentaires ne sont pas là pour favoriser le site !

      Supprimer
  8. coool
    https://ichaar-info.blogspot.com

    RépondreSupprimer
  9. Alors moi je n'y arrive pas !! ça ne fonctionne pas pourtant j'ai bien exécuter tout ce qu'il y a écrit ! y a t il qq chose que je n'ai pas fait ? quand je vois les post de réussite je me dit que je suis vraiment larguer !!

    RépondreSupprimer
  10. Cela ne fonctionne pas dans l'affichage dynamique de BLOGGER (format Magazine)
    La fonction n'appariait pas dans le menu.
    http://diacritiques.blogspot.fr/

    RépondreSupprimer
  11. il a fallu quelques retouches mais le gadget est bien en ligne
    merci

    http://cafeaphrodite.blogspot.fr/

    RépondreSupprimer
  12. merci beaucoup ! efficace !

    http://blogadamantine.blogspot.fr/

    RépondreSupprimer
  13. Ça fonctionne, merci.
    http://htcaddict.blogspot.com/

    RépondreSupprimer
  14. Bonsoir,
    Merci beaucoup, tout fonctionne chez moi !
    J'avais un petit souci d'affichage des commentaires sur le blog, impossible d'y remédier, alors ce tuto tombe à pic ;-)

    RépondreSupprimer
  15. Bonjour à toutes et à tous je suis une femme qui offre des prêts d'argent aux personnes dans le besoin urgent et au société qui sont dans le besoin de financement. Contactez-moi pour toutes vos demande de prêt de 5000€ à 6.000.000€. Pour plus d'informations, contactez-moi par mon adresse mail: (priskaagness@gmail.com)

    RépondreSupprimer
  16. Bonjour à toutes et à tous je suis une femme qui offre des prêts d'argent aux personnes dans le besoin urgent et au société qui sont dans le besoin de financement. Contactez-moi pour toutes vos demande de prêt de 5000€ à 6.000.000€. Pour plus d'informations, contactez-moi par mon adresse mail: (priskaagness@gmail.com)

    RépondreSupprimer
  17. Bonjour,

    Tout a fonctionné pendant 2 jours et actuellement, je ne vois plus rien sur mon blog.
    J'ai recopié le code html après vérification, mais sans succès.
    Auriez-vous une idée du problème ? merci par avance.

    RépondreSupprimer
  18. Merci beaucoup pour ce partage! J'apprécie bcp que l'avatar soit présent, ça apporte de la gaieté sur le blog et c'est plus personnel :)

    RépondreSupprimer
  19. Bonjour,
    Génial !
    C'est juste TOP !!!
    MERCI !
    Et bonne année :)

    RépondreSupprimer
  20. Bonjour !

    Merci beaucoup pour votre explication, je n'aurais jamais pu faire ça toute seule ! Je ne comprends pas que ce ne soit pas plus "clair" sur blogger, on n'est pas tous informaticiens !!!

    Encore merci et bonne journée !

    RépondreSupprimer
  21. Ce commentaire a été supprimé par l'auteur.

    RépondreSupprimer