How do I make Back to the Top Links in the Poster Detail Area

Author Comment
User avatar

Admin

Posts: 11073

People have seen the jump arrows that I placed in the poster detail area on this board and asked how it was done. In a nutshell, they are just linked images placed in the auto-title and a named anchor placed in the Custom Footer.

To begin, insert the following line in your Custom (or Global) Footer:
<a name="bottom"></a>
Then we move on to set-up the auto-title to link to this and the top.
  1. Admin > Members > Auto Titles
  2. Beside "Membership", click "add new"
  3. Give it a title. I called mine Up & Down.
  4. Press the HTML button so it glows yellow. (just to the left of spellcheck)
  5. Paste in the following code:
<div style="width: 100px;">
<a href="#" title="Go to top" style="text-decoration: none;"><img src="http://images.yuku.com/image/gif/f6926175a57ed8ae9dfea34c2b76020a1f83ba92.gif" alt="top"></a>
<a href="#bottom" title="Go to bottom" style="text-decoration: none; width: 29px; float: right;"> <img src="http://images.yuku.com/image/gif/f5e16c587d8494eb47264ed9c4b8695831820674.gif" alt="bottom"></a>
</div>
  1. Press Save.
  2. Just check that it says zero in the box beside it and don't worry if it looks a bit odd.
Then we have to go and enable them.
  1. Admin > Community Settings > Display Preferences
  2. Beside "Poster Info", place a check-mark in the box to the left of "auto title".
  3. Scroll to the bottom of the page and press "submit".
That's it!

So, you go and look at your board and don't see them. Don't worry, this is normal. Once a Member makes a post, the auto-title will show in all their posts. Just make a test post and see.

Obviously you are free to change the images and if you need a bit of help with styling them to suit your board, please ask. Remember when asking that we will probably need to see them in action to be able to give good advice. A link always helps.

User avatar

Posts: 8

hi Andrew I just tried to do this and not seeing the arrows. My main question is does this work on skins that are imported? That is what I am using. Thanks for your help in advance

Amy Jill
http://amyjillsfibrochicks.yuku.com/

User avatar

Posts: 8

Hi Andrew sorry I  missed you, I saw what you wrote and posted and they showed up. So thanks for the fast response. I really need help on 3 things if you can. I need if we can do it a join button , and we tried to do the recent posts and duh me and 2 of my admins could not get it to work can you tell me that #5 step is what is confusing me. This is the big one is there any possible way to not have a RSS Feed. We are a support group and don't want the world reading what we write is there anyway to disable it please. I appreciate whatever you can do , I hear your great!!! Thanks bunches 

Posts: 32

My arrows just won't work. Maybe it's because I have more than the 3 Auto Titles already in place? Is there anyway to over ride this?

Found this in help: 'Auto and status titles are titles that will appear in the poster detail area of any members who fulfill the criteria. Members will show all titles that apply. There are up to 3 titles for members, up to 4 titles for moderators and up to 5 titles for admins (if they are also moderators, for example).'

Posts: 32

Never mind ....  I finally got it sorted by putting into each skin lol

However, is there any way I can have the arrows show before the Post Count Auto Titles and Custom Titles as it looks real wacky now with no gap between the 2?

Posts: 32

Sorry, more lol

The links are all going to white pages http://uleadunleashed.yuku.com/editor/bypass/blank.htm#

User avatar

Admin

Posts: 11073

Fibrochickie wrote:Hi Andrew sorry I missed you, I saw what you wrote and posted and they showed up. So thanks for the fast response.
You're welcome.  Image 

Glad you got them working.
InstantkiwiNZ wrote:I finally got it sorted by putting into each skin lol
No reason why they would not have worked if you had placed that in your Global Footer.  If they didn't work with it placed there, you likely have another issue.
InstantkiwiNZ wrote:However, is there any way I can have the arrows show before the Post Count Auto Titles and Custom Titles as it looks real wacky now with no gap between the 2?
InstantkiwiNZ wrote:The links are all going to white pages http://uleadunleashed.yuk...editor/bypass/blank.htm#
I think this may be an issue with the IE WYSIWYG editor.  If you look at the HTML view of your auto-title, you will see that http://uleadunleashed.yuku.com/editor/bypass/ has been added to the beginning of the links.  The solution: try another browser.

With respect to the placement, I would suggest you do not create a new auto-title for this but instead edit your existing ones to add the arrows to the top of your existing post-count auto-titles.  However, do check your HTML view after editing to ensure that the links did not get chewed.

Remember, any changes will require a post to be made by that person in order for the changes to be reflected on the board.

Posts: 32

but I tried firefox and still getting the white outs, BUT no worries ...I'll prob just bin it 'cause I really don't know exactly what it will do anyways.
Should it go to the top of the page or the top of the message thread?

User avatar

Admin

Posts: 11073

Try the buttons here and see what they do. They go to the top and bottom of the page but as they only show on topic pages, they will go to the top and bottom on the thread. OK, I just looked at your auto-title again. This has been done using Internet Explorer. Here is the exact HTML you should be using for your titles.
<div style="width: 100px;"> <a style="text-decoration: none;" title="Go to top" href="#"> <img alt="Up" src="http://images.yuku.com/image/gif/d591644a47d53cc2d0509d986b921219a059273f.gif"> </a> <a style="width: 33px; float: right; text-decoration: none;" title="Go to bottom" href="#bottom"> <img alt="Down" src="http://images.yuku.com/image/gif/66c368bb46a94df5d48232d0cd55d2857585d603.gif"> </a> </div>
The up arrow should work straight away with nothing extra.  The down arrow needs the named anchor in the footer.  Not all your skins have this.  So, if you get the up arrow to work, the auto-title must be OK.  If only the down arrow doesn't work, make sure you have the named anchor in your footer.

User avatar

Posts: 679

Location: Orange County, Calif. (near Disneyland and Los Angeles)

I am using Firefox.  The "top arrow" in your post opens a new tab and takes me to the top of the page.  The "bottom arrow" correctly takes me to the bottom of the page.

The "top" and "bottom" arrows under the avatars work correctly.

User avatar

Posts: 2263

[url=#]Image[/url] [url=#bottom]Image[/url]


I removed a target="_blank" that ended up in that link somehow, but it's not making a difference.

User avatar

Posts: 2263

I should add that Andrew's code ought to be fine. The issue would be with the post editor.

User avatar

Admin

Posts: 11073

1992casey wrote:The issue would be with the post editor.
Nope, the code was fine, the editor was fine.  The link target must have been added with a JavaScript.

Anyway, I removed them to remove any confusion.

User avatar

Posts: 679

Location: Orange County, Calif. (near Disneyland and Los Angeles)

I would like to recommend that the "Down" arrow drops you down to the last post on the page, rather than to the Quick Reply box.

I never use the Quick Reply box, but I do often want to see the last post on the page.

For those who want to use the Quick Reply box, it is easy to scroll down a little to get to the box, but if you are dropped to the box, it is cumbersome to scroll upwards to try to find the beginning of the last post.

User avatar

Posts: 2263

It's a good thought, but it isn't going to work. There isn't a consistent ID in that location to be able to do that, and there's no way for admins to insert HTML in that spot. Each post has an ID, but they're all different. The ID of your post above is post-id-7758, for instance.

User avatar

Posts: 679

Location: Orange County, Calif. (near Disneyland and Los Angeles)

 
Rather than sending the browser to a specific ID, could it be sent to a relative ID?

For example, what if the browser were to be sent to ID > 5000000000. Since there is no ID that high, it would drop you off at the highest ID possible, which would be the last post.
 

User avatar

Posts: 2263

Links to "phantom" IDs go nowhere. Click on the link directly below. The URL in the address bar will change, but nothing else will.

[url=#post-id-5000000000]Link with ID to nowhere[/url]

Code: Link with ID to nowhere

User avatar

Posts: 679

Location: Orange County, Calif. (near Disneyland and Los Angeles)

Links to "phantom" IDs go nowhere.

Not necessarily so. Here is a phantom ID link that takes you to the top of the page:

http://support.ourboard.org/viewtopic.php?t=597/make-----Links---Poster--Area?post-id-5000000000

User avatar

Posts: 2263

You're using a full URL. The part that's appended to the end is being ignored, which causes you to end up at the top of the page.

In this case, we need make the top/bottom buttons work on every page in which they appear. In other words, the full URL needs to be dropped, and the href attribute can't include anything but the ID.

As examples…

This URL will link to the top of this page, but it won't work on any other page:

http://support.ourboard.org/viewtopic.php?t=597#

This URL will link to the top of every page:
#

The "bottom" ID (actually name rather than ID, but we're getting technical) appears on every one of Andrew's thread pages.

This URL will link to the element with the bottom name/ID on this page, but no other page:

http://support.ourboard.org/viewtopic.php?t=597#bottom

This URL will link to the element with the bottom name/ID on every page that has that name/ID:

#bottom

User avatar

Admin

Posts: 11073

There is only one way of achieving something like that and that is to add position: relative to the named anchor.  It's a cheat but it does work.

<a name="bottom" style="position: relative; bottom: 500px;">a>

Display posts from previous:  Sort by  



Who is online

Users browsing this forum: No registered users and 1 guest


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
Jump to:  
cron
Powered by phpBB® Forum Software © phpBB Group