Adding avatar in the group ssection. Hitskin_logo Hitskin.com

This is a Hitskin.com skin preview
Install the skinReturn to the skin page

The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.
3 posters

    Adding avatar in the group ssection.

    Babybok
    Babybok
    Forumember


    Male Posts : 199
    Reputation : 2
    Language : Filipino, English
    Location : Philippines

    In progress Adding avatar in the group ssection.

    Post by Babybok April 27th 2015, 6:36 am

    Hello, Forumotion, Is it possible to add an avatar in the group section? 
    What I mean is add a catergory or something blah2 like
    PM / Username / Avatar / Post / Location / Email / Website



    like this one in this image:

    Adding avatar in the group ssection. Q11

    TIA Forumotion

    Regards,
    BabyBok
    Sir. Mayo
    Sir. Mayo
    Forumember


    Male Posts : 978
    Reputation : 90
    Language : English, Some french.
    Location : you can also reach me on snoonet's irc server. I idle in #Techsupport Username is Vault108

    In progress Re: Adding avatar in the group ssection.

    Post by Sir. Mayo April 27th 2015, 10:19 pm

    What is your forum type?
    Now You may be able to do this by editing your templates and what not.
    I can play around with it but the earliest i could have something is by the April 30th/ May 1st
    If you can wait that long?
    Babybok
    Babybok
    Forumember


    Male Posts : 199
    Reputation : 2
    Language : Filipino, English
    Location : Philippines

    In progress Re: Adding avatar in the group ssection.

    Post by Babybok April 29th 2015, 4:52 am

    @Sir. Mayo : Hello, My forum version is "Invision" , yeap I can wait sir, if you can provide it.. and advance thanks for helping.. Smile
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: Adding avatar in the group ssection.

    Post by Ange Tuteur April 29th 2015, 6:54 am

    Hi @Babybok,

    Go to Administration Panel > Modules > JavaScript codes management > Create a new script

    Title : Group avatar
    Placement : In all the pages
    Code:
    /\/g\d+/.test(window.location.pathname) && $(function() {
      for (var a = $('.ipbtable a'), i = 0, j = a.length, ava, img, id, storage = window.localStorage; i<j; i++) {
        if (/\/u\d+/.test(a[i].href)) {
          id = a[i].href.replace(/.*?\/u(\d+).*/, '$1');
          ava = document.createElement('SPAN');
          ava.className = 'fa_group_avatar';
          a[i].parentNode.insertBefore(ava, a[i]);
         
          if (storage && storage['faAvatar_' + id] && storage['faAvatarExp_' + id] > +new Date - 1*60*60*1000) ava.innerHTML = storage['faAvatar_' + id];
          else {
            $.get(a[i].href, function(d) {
              img = $('#profile-advanced-right .module:first img', d)[0];
              ava.innerHTML = '<img src="' + (img ? img.src : 'http://2img.net/i/fa/invision/pp-blank-thumb.png') + '" />';
             
              if (storage) {
                storage['faAvatar_' + id] = ava.innerHTML;
                storage['faAvatarExp_' + id] = +new Date;
              }
            });
          }
        }
      }
    });
    // créé par ange tuteur

    Save the script, and then go to Display > Colors > CSS stylesheet. Paste the following style rules in your stylesheet to scale the avatars down and style the container a bit.
    Code:
    .fa_group_avatar {
      background:#EEE;
      border:1px solid #CCC;
      border-radius:3px;
      display:inline-block;
      margin-right:3px;
      padding:3px;
    }

    .fa_group_avatar img {
      height:25px;
      width:25px;
    }

    You can change the colors as you wish. Wink