4. Post Numbering Like Invision

Adding a Post number to the top corner of posts like inivison has
(This code is for phpbb3. Punbb it isn't needed, invision it isn't needed. If you wish to have it for phpbb2 contact me on forumotions support forum)

I've often seen people asking for this. Just like invision has, they want a post number in the topics.
Understandable really, it makes referring to a previous post nice and easy. Sometimes a quote just isn't needed you just want to say 'back in post number 5' or something.

Its actually a really simple thing to add.

Now before i continue, there a few rules for this code to work:
- First of all, there most be no posts from the previous page showing, no coninuing posts. Don't expect to see this added soon. I recommend turning it off.
- The original post reminder must also be turned off. If you want this code to work with this feature turned on, contact me on the forumotion support board, it is a pay-for feature.
- The code works for the defualt number of posts per page. That being 15. It can easily be changed within the code to allow for how many posts you have on each page. If you wish to change it then find near the start of the code this: 'ppp=15;' and change the 15 to the number of posts you have displaying on 1 page.

So here is the code. (put it in modules>javascript management>new javascript> in topic pages only )

Code:


var CopyrightNotice='phpbb3 post numbers for forumotion phpbb3 forums. Copyright ©  by LGforum. All Rights Reserved. Use and  modification of this script is not allowed without this entire copyright notice in the original, copied, or modified script. No distribution without consent.';
$(function(){
 var ppp=15;
 var p=parseInt( $('div.pagination')[0].getElementsByTagName('strong')[0].innerHTML );
 p=(p-1)*ppp;
    for(i=0;i<ppp;i++) {
    if($('.postprofile')[i]){
      var link=$('.topic-title')[i].getElementsByTagName('a')[0].href;
      x= $($('.postprofile')[i]).prepend('<span class="postnumber"><a href="'+link+'">#' + (i+1+p) +'</a></span>')
    }
  }
});


The post number has a className of 'postnumber' so you can style it in the CSS. Here is someto get you started:

Code:


.postnumber {
  float:right;
  background:white;
  border:1px solid #105289;
  border-radius:10px;
  padding:3px;
}


Things you can do with this
-Look for this symbol '#'. This, you can change to anything you like. Maybe something like 'Post:' or 'No.'.
- Edit the CSS to your liking. If you have the post profiles on the left, you may want to change the float:right to float:left.

Now once again, lets go through the code.
This code again demonstrates looping through all the post profiles on a page. As this loop goes through, the loop initial value increases, in this case, by 1. So if the loop number (represented by 'i') is going up by 1, then it can simply be added to the posts. As the loop goes through for the first time, its initial value of 'i' is 0, and so this means we must do 'i + 1' just to increase it to the correct number. Now as it goes through for the first time, i=0, which we add 1 onto, and it will be on the first post profile and adds the value '1' to the top corner. as it goes through for the second time, i=1, which we add 1 on to, and it will be on the second post profile and so add the value '2' to the top corner.
On the next page this code works by finding the pagination, and finding what page the user is on. Depending on the page number, it does a little maths to correct the number for the next page.

thanks,. how to make the linked post number?

Just a few additions are needed to the code.
The unique post link can be obtained from the post title.

Where it says this in the code:

Code:

    var a=$('.postprofile').get();

I suppose you could change where it says postprofile here. You could try '.post' or '.postbody' or something like that.

If your postprofile is on the left though, there is the option to change that, so it neatens things up.

can u make it for invision ?

yes i know but thats not a link in invision

Hi
This used to work on my forum.
For some reason has just stopped.
(Last day or two).
Can't see why.
Any suggestions?
TIA

Likely down to forumotion upgrading jQuery version 1.7

I see that mine are still working fine. So i'll provide the code I use, which will also make your numbers links too

Code:


var CopyrightNotice='phpbb3 post numbers for forumotion phpbb3 forums. Copyright ©  by LGforum. All Rights Reserved. Use and  modification of this script is not allowed without this entire copyright notice in the original, copied, or modified script. No distribution without consent.';
function pagesort(no) {var a=no-1;var b=a*15;var c= b+1;return c;}
function findlink(i) {var a=$('.topic-title').get(); var b=$(a[i]).find('a')[0]; var c=b.attributes;
postlink=c[1].nodeValue; return postlink; }
$(function(){
j=$('div .pagination').find('strong');
k=j[0].innerHTML; var pagenumber=Number(k);
var p=pagesort(pagenumber); var a=$('.postprofile').get();
    for(var i=0;i<a.length;i++) {
  postlink=findlink(i); postno=i+p;
  $(a[i]).prepend('<span style="float: right;"><a href="' +postlink+ '">#' +postno+'</a></span>')
  }
});

Let me know if that still works for ya.

Hi
I do use "profile toggle".
However still used to work.



Now doesn't.
???



Cheers Martin

Hi
No idea why, but works now!
I have tried to get it float left.
But that doesn't happen.

Sorry!
It is all working fine now.
(Except post link.)
[Sorry again.... browser related{Comodo Dragon} Fine with IE9 ]
Go figure..........
I blame user error........


http://img687.imageshack.us/img687/7609/15012012160754.png

http://img594.imageshack.us/img594/2868/15012012160905.png

Hi, I just added this to my forum and I love it!!!!!!! (www.honda-haven.com)

Just one question, is there any way to place the avatars below the #1 number, it appears next to it in some cases, it would be perfect if the avatar was on the next line down from the number if you get me....

You could try this.

find this:

Code:


<span style="float: right;"><a href="' +postlink+ '">#' +postno+'</a></span>


and change to this:

Code:


<span style="float:right;margin-bottom:5px;"><a href="' +postlink+ '">#' +postno+'</a></span><br>