Avater bij de tag

Goedemiddag!

Ik ben op zoek naar de code om bij 't reageren niet alleen de tagnaam, maar tevens de avater te zien.
Hieronder een voorbeeld wat ik bedoel



De codes van de avater bij de toolbar en index heb ik wel gevonden.
Maar deze dus niet.

Mvg Lenie

Goedenavond @Lenie daar is een plugin voor nodig van Ange Tuteur https://fmdesign.forumotion.com/t399-display-the-user-avatar-before-mentions

Om deze plug-in te installeren, ga je naar:

Beheerderspaneel  Modules  Beheer van JavaScript-codes - NIEUW JAVASCRIPT

Maak een nieuw javascript aan met de volgende instellingen:

Titel: Avatar bij vermelding
Plaatsing: In alle pagina's (of "In de onderwerpen" als je wilt dat het alleen in onderwerpen werkt)
Code: Kopieer en plak het onderstaande script en klik op opslaan:

Code:

(function() {
  window.faMentionAvatar = {
    // position modifies the position of the avatar
    // 0 = before mention
    // 1 = after mention
    position : 0,
    cacheTime : 1*60*60*1000, // amount of time the avatar is cached ( 1 hour )
 
    mentions : null, // mention node list
    index : -1, // current index in the mentions array
 
    // checks if the mention is valid and then gets the avatar
    getter : function() {
      var mention = faMentionAvatar.mentions[++faMentionAvatar.index],
          storage = window.localStorage,
          id;
       
      if (mention) {
        id = mention.href.replace(/.*?\/u/, '');
     
        if (storage && storage['mentionAvatar_' + id] && storage['mentionAvatar_' + id + '_exp'] > +new Date - faMentionAvatar.cacheTime) {
          var avatar = document.createElement('IMG');
          avatar.className += ' mention-ava';
          avatar.src = storage['mentionAvatar_' + id];
          faMentionAvatar.position ? mention.appendChild(avatar) : mention.insertBefore(avatar, mention.firstChild);
          faMentionAvatar.getter();
        } else {
          $.get('/ajax/index.php?f=m&user_id=' + id, function(d) {
            var avatar = $('.tooltip-content > img', d)[0];
             
            if (avatar) {
              faMentionAvatar.position ? mention.appendChild(avatar) : mention.insertBefore(avatar, mention.firstChild);
           
              if (storage) {
                storage['mentionAvatar_' + id] = avatar.src;
                storage['mentionAvatar_' + id + '_exp'] = +new Date;
              }
            }
            faMentionAvatar.getter();
          });
        }
      }
    }
  };
 
  // write the stylesheet into the HEAD section
  document.write('<style type="text/css">.mentiontag img { height:20px; width:20px; vertical-align:middle; border-radius:100px; background:#FFF; box-shadow:0px 1px 1px rgba(0, 0, 0, 0.3), 0px -0px 1px rgba(0, 0, 0, 0.3); margin:1px 3px; padding:1px; }</style>');
 
  // statements that need execution when the document is ready
  $(function() {
    faMentionAvatar.mentions = $('.mentiontag');
    faMentionAvatar.getter();
  });
}());

Zodra het script is opgeslagen, ga je naar een onderwerp waarin iemand is vermeld en je zou dan hun avatar moeten zien vóór de vermelding! Als je de positie van de avatar wilt wijzigen, raadpleeg je de sectie Wijzigingen.

Wijzigingen:

Er zijn slechts een paar aanpassingen voor deze plug-in die gemakkelijk te begrijpen en te bewerken zouden moeten zijn.

position : Bovenaan het script zie je een variabele met de titel "position", deze variabele wijzigt de positie van de avatar. Als je de avatar na de vermelding wilt, verander dan de 0 in een 1 en je bent klaar. Verander het terug naar 0 als je de avatar vóór de vermelding wilt. Ik heb een opmerking in het script achtergelaten als herinnering.

cacheTime : Deze optie beïnvloedt de hoeveelheid tijd dat de avatars in de cache worden bewaard. Standaard worden de avatars 1 uur in de cache bewaard ( 1*60*60*1000 ), wijzig de waarde van deze optie als u de cachetijd wilt wijzigen. Dit is voornamelijk bedoeld voor prestatiedoeleinden, zodat er niet meerdere verzoeken voor dezelfde gebruiker hoeven te worden ingediend. In het kort ; het zorgt ervoor dat het script sneller werkt.

stijl: De stijl van de avatar wordt beïnvloed door deze regel in het script:

Code:

document.write('<style type="text/css">.mentiontag img { height:20px; width:20px; vertical-align:middle; border-radius:100px; background:#FFF; box-shadow:0px 1px 1px rgba(0, 0, 0, 0.3), 0px -0px 1px rgba(0, 0, 0, 0.3); margin:1px 3px; padding:1px; }</style>');

Wat deze regel doet, is een kleine stylesheet in het HEAD-gedeelte van het document schrijven. U kunt deze CSS wijzigen om de grootte, kleur, marge, enz. van de avatar te wijzigen. Dit is de niet-verkleinde CSS om het bewerken gemakkelijker te maken:

Code:

.mentiontag img {
  height:20px;
  width:20px;
  vertical-align:middle;
  border-radius:100px;
  background:#FFF;
  box-shadow:0px 1px 1px rgba(0, 0, 0, 0.3), 0px -0px 1px rgba(0, 0, 0, 0.3);
  margin:1px 3px;
  padding:1px;
}

Hopelijk beantwoordt dit je vraag?
Zo ja Markeer dan bovenaan je bericht met de groene Opgelost knop.

Yes het is gelukt hoor!
Dankjewel Tonny