Moving User Avatars with JavaScript

For people using phpBB3 like myself you are unable to move the Users name and rank title above the avatar unless you use a javascript code. Many people have had this problem and I would highly appreciate if somebody who is good with JavaScript can write in the code for all user names and rank titles to appear above the avatar, it would help me out and other phpBB3 users a lot.



All replies are highly appreciated.

Hi,

You can simply change the Version of your forum mate.

Sir Chivas wrote:Hi,

You can simply change the Version of your forum mate.

Somebody said if I did that I would have to start everything over.

No, you got that mistaken. That's for the Theme (skin)

Sir Chivas wrote:No, you got that mistaken. That's for the Theme (skin)

So how would I do it then without losing my themes and stuff?

Well, alright.

ACP >> Display >> Choose a theme >> Version.

Please note: If you only have codes in the CSS, that only work for Phpbb3, will not work for phpbb2

Changing your forum version is a big step to take just for this small thing... it will DRASTICALLY change your forum. Not to mention your moving away from the most powerful board type.

I'll give you some Javascript for this in a minute. Just wanted to press send before you make this silly mistake.

LGforum wrote:Changing your forum version is a big step to take just for this small thing... it will DRASTICALLY change your forum. Not to mention your moving away from the most powerful board type.

I'll give you some Javascript for this in a minute. Just wanted to press send before you make this silly mistake.

Thanks so much. I have not done it yet, waiting for the JavaScript

Code:


$(function(){
  var post = $('.postprofile');
  for(var i = 0, l = post.length; i<l; i++) {
      var av = post[i].getElementsByTagName('a')[0];
      var dd = document.createElement('dd').appendChild(av);
      post[i].getElementsByTagName('dl')[0].insertBefore(dd,post[i].getElementsByTagName('dd')[1]);
  }
});


Put that in a JS file, and have it running 'only in topics'. You can add it to an existing one if you have one.

LGforum wrote:

Code:


$(function(){
  var post = $('.postprofile');
  for(var i = 0, l = post.length; i<l; i++) {
      var av = post[i].getElementsByTagName('a')[0];
      var dd = document.createElement('dd').appendChild(av);
      post[i].getElementsByTagName('dl')[0].insertBefore(dd,post[i].getElementsByTagName('dd')[1]);
  }
});


Put that in a JS file, and have it running 'only in topics'. You can add it to an existing one if you have one.

Works like a CHARM! I now forever love you. This should be made into an official forumotion tutorial.