Puis-je mettre un avatar avec la première lettre du nom du membre dedans ?

[admin tt]

bonsoir tous le monde

Puis-je mettre un avatar avec la première lettre du nom du membre dedans ?

Lorsqu'un membre change de nom, l'avatar change automatiquement

[Toryudo]

Bonjour !
Pour pouvoir répondre à cette demande, il faudrait des informations supplémentaires (le plus d'informations possible d'ailleurs, c'est toujours mieux d'en savoir un maximum pour ne pas partir dans une mauvaise direction) :
- quel est le lien vers votre forum ?
- quelle est la version de votre forum (ça change pas mal de choses) ?
- faut-il remplacer tous les avatars par ce système, ou juste la mettre en place quand il n'y a pas d'avatar ?
- faut-il le faire sur tous les liens où apparaissent les avatars (plus long) ?
- quid de la couleur de la lettre et de la couleur du fond ?

Voilà, si vous avez d'autres remarques pour préciser ça, n'hésitez pas !

[admin tt]

Bonjour Toryudo

- quel est le lien vers votre forum ?
- quelle est la version de votre forum (ça change pas mal de choses) ?

version: AwesomeBB

Oui, c'est ce que je veux

- faut-il le faire sur tous les liens où apparaissent les avatars (plus long) ?

Oui, si ce n'est pas fatigant

- quid de la couleur de la lettre et de la couleur du fond ?

Vous pouvez mettre ñ'importe quelle couleur que vous aimez.

Merci beaucoup Toryudo

[Toryudo]

Bon.... !
C'est compliqué, surtout pour AwesomeBB.
Quelques concessions : ça ne marche pas pour la Chatbox (parce qu'il faudrait remplacer l'avatar à chaque fois que quelqu'un poste un message, c'est pénible à coder), ni pour le survol d'un pseudo dans la page de la liste des membres (qui affiche un petit encadré, pénible à changer aussi à cause du choix technique qui a été fait pour cet affichage). Pour tous les autres cas, normalement, le script suivant devrait convenir :

Code:

$(function(){

  let defaultAvatarUI = [
    "url('https:/" + "/2img.net/i/fa/modernbb/pp-blank-thumb.png')",
    "https:/" + "/2img.net/i/fa/modernbb/pp-blank-thumb.png",
    "https:/" + "/2img.net/i/fa/modernbb/pp-blank-thumb-38px.png",
  ];
  let paramsUI = "rounded=true&bold=true";
  let userNameLetter = _userdata["username"].charAt(0);

  /* Avatars page d'accueil */
  $(".forum-lastpost").each(function(){
    let avatar = $(this).find(".avatar-default img");
    if (defaultAvatarUI.includes($(avatar).attr('src'))){
      let author = $(this).find(".forum-lastpost-author strong").text().charAt(0);
     $(avatar).attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&&name=" + author);
     console.log('changé');
    }
  });

  /* Avatars page messages */
  $(".post-aside").each(function(){
    let avatar = $(this).find(".post-author-avatar img");
    if (defaultAvatarUI.includes($(avatar).attr('src'))){
      let author = $(this).find(".post-author-name").text().charAt(0);
     $(avatar).attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + author);
    }
  });
  $(".poster").each(function(){
    if (defaultAvatarUI.includes($(this).css('--poster-avatar'))){
      let author = $(this).attr('title').charAt(0);
     console.log(author);
     $(this).get(0).style.setProperty("--poster-avatar", "url('https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + author + "')");
    }
  });

  /* Avatars page membres */
  $(".avatar-mini").each(function(){
    let avatar = $(this).find("a img");
    if (defaultAvatarUI.includes($(avatar).attr('src'))){
      let author = $(this).find("a").text().charAt(0);
     $(avatar).attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + author);
    }
  });

  /* Avatar page profil */
  $(".box").each(function(){
    let avatar = $(this).find(".mod-login-avatar img");
    if (defaultAvatarUI.includes($(avatar).attr('src'))){
      let author = $(this).find(".box-head span").text().charAt(0);
     $(avatar).attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + author);
    }
  });

  $(function(){
    /* Avatar chargés plus tard */
    defaultAvatarUI.forEach(function(el){
      $("#header-user img[src='" + el + "']").attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + userNameLetter);
      $(".avatar-big img[src='" + el + "']").attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + userNameLetter);
      $("#quick-reply-avatar img[src='" + el + "']").attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + userNameLetter);
    });
  });
});

J'utilise pour ça le site https://ui-avatars.com/ qui permet de créer des images à la volée.
Voilà ! S'il reste d'autres images que j'ai oubliées, je peux tenter de corriger. Si c'est pour parfaire, il faudra sûrement passer par une suggestion, parce que le reste est compliqué à modifier !

[admin tt]

Toryudo
Tu es vraiment incroyable mon ami 
Cela fonctionne parfaitement
--------


L'image n'apparaît pas à trois endroits

Messages privés



amis


participants





Si coder est fatiguant

Vous pouvez le faire plus tard



Merci beaucoup  Toryudo 

[Toryudo]

Horrible... quelques lignes de code ne fonctionnaient que sur Firefox, et d'autres ne fonctionnaient pas pour les invités...
J'ai rajouté pour la liste des amis, j'ai corrigé pour les participants et par-ci par-là, ça devrait être plus propre.

Par contre, bizarrement, il n'y a aucun avatar de mon côté dans les MP quand la personne n'a pas d'avatar. Je vais essayer de réfléchir et naviguer dans les menus pour voir s'il y a une option pour l'activer sur ces pages-là, mais en attendant, je ne vois rien, je ne peux rien coder sur ce dernier sujet.

Voilà le code corrigé pour le reste :

Code:

$(function(){

  let defaultAvatarUI = [
    'url("https:/' + '/2img.net/i/fa/modernbb/pp-blank-thumb.png")',
    "url('https:/" + "/2img.net/i/fa/modernbb/pp-blank-thumb.png')",
    "https:/" + "/2img.net/i/fa/modernbb/pp-blank-thumb.png",
    "https:/" + "/2img.net/i/fa/modernbb/pp-blank-thumb-38px.png",
    "https:/" + "/2img.net/i/fa/modernbb/pp-blank-thumb-50px.png",
  ];
  let paramsUI = "rounded=true&bold=true";
  let userNameLetter = _userdata["username"].charAt(0);

  /* Avatars page d'accueil */
  $(".forum-lastpost").each(function(){
    let avatar = $(this).find(".avatar-default img");
    if (defaultAvatarUI.includes($(avatar).attr('src'))){
      let author;
      if (_userdata["session_logged_in"] == 0){
        author = $(this).find(".forum-lastpost-author").clone().children().remove().end().text().charAt(0);
     } else {
        author = $(this).find(".forum-lastpost-author strong").text().charAt(0);
     }
     $(avatar).attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&&name=" + author);
    }
  });

  /* Avatars page messages */
  $(".post-aside").each(function(){
    let avatar = $(this).find(".post-author-avatar img");
    if (defaultAvatarUI.includes($(avatar).attr('src'))){
      let author = $(this).find(".post-author-name").text().charAt(0);
     $(avatar).attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + author);
    }
  });
  $(".poster").each(function(){
    if (defaultAvatarUI.includes($(this).css('--poster-avatar'))){
      let author = $(this).attr('title').charAt(0);
     $(this).get(0).style.setProperty("--poster-avatar", "url('https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + author + "')");
    }
  });

  /* Avatars page membres */
  $(".avatar-mini").each(function(){
    let avatar = $(this).find("a img");
    if (defaultAvatarUI.includes($(avatar).attr('src'))){
      let author = $(this).find("a").text().charAt(0);
     $(avatar).attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + author);
    }
  });

  /* Avatars page liste amis */
  $(".friend-block").each(function(){
    let avatar = $(this).find(".avatar-default img");
    if (defaultAvatarUI.includes($(avatar).attr('src'))){
      let author = $(this).find(".friend-details a").text().charAt(0);
     $(avatar).attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + author);
    }
  });
  $(".friend-block-big").each(function(){
    let avatar = $(this).find(".avatar-big img");
    if (defaultAvatarUI.includes($(avatar).attr('src'))){
      let author = $(this).find(".friend-header a").text().charAt(0);
     $(avatar).attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + author);
    }
  });

  /* Avatar page profil */
  $(".box").each(function(){
    let avatar = $(this).find(".mod-login-avatar img");
    if (defaultAvatarUI.includes($(avatar).attr('src'))){
      let author = $(this).find(".box-head span").text().charAt(0);
     $(avatar).attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + author);
    }
  });

  $(function(){
    /* Avatar chargés plus tard */
    defaultAvatarUI.forEach(function(el){
      $("#header-user img[src='" + el + "']").attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + userNameLetter);
      $(".avatar-big img[src='" + el + "']").attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + userNameLetter);
      $("#quick-reply-avatar img[src='" + el + "']").attr("src", "https://ui-avatars.com/api/?" + paramsUI + "&size=128&name=" + userNameLetter);
    });
  });
});

[admin tt]

Ç'est du bon boulot mon ami Toryudo  

Le code fonctionne bien dans mon forum

Merci beaucoup pour l'aide Toryudo  
----------------

Je vous conseille de mettre le code dans la section trucs et astuces

Donc tout le monde en profite
En même temps, le code est enregistré à votre nom afin que vos droits intellectuels ne soient pas perdus