Create
cancel
Showing results for 
Search instead for 
Did you mean: 
Sign up Log in
Celebration

Earn badges and make progress

You're on your way to the next level! Join the Kudos program to earn points and save your progress.

Deleted user Avatar
Deleted user

Level 1: Seed

25 / 150 points

Next: Root

Avatar

1 badge earned

Collect

Participate in fun challenges

Challenges come and go, but your rewards stay with you. Do more to earn more!

Challenges
Coins

Gift kudos to your peers

What goes around comes around! Share the love by gifting kudos to your peers.

Recognition
Ribbon

Rise up in the ranks

Keep earning points to reach the top of the leaderboard. It resets every quarter so you always have a chance!

Leaderboard

Come for the products,
stay for the community

The Atlassian Community can help you and your team get more value out of Atlassian products and practices.

Atlassian Community about banner
4,458,377
Community Members
 
Community Events
176
Community Groups

How To Create a Scroll Back To Top Button

How can I create a "Back To Top" Button on my page??

Thx for ur help

3 answers

1 accepted

11 votes
Answer accepted
Sattesh M Atlassian Team Sep 14, 2018

Hello Prince, 

We should be able to do this by using the Anchor macro.

Add the macro at the top of the page, and give it a name, like top for example.

Then, at the bottom, or anywhere in the same page, type out the text for the "button", for example, Back to top.

Now highlight the Back to top text, and click on the Insert Link icon, or you can use the Ctrl+K shortcut as well.

In the link pop-up, go to the Advanced tab, and link it to the anchor created above by linking to it using #top.

That should do the trick!
Do let me know if you have any questions.

Cheers,
Sattesh 

Thank you Sattesh!  Your directions worked perfectly.

Like Jeff Tillett likes this

Please note - although this is a valid solution you should consider export scenarios as well... the button/link is considered as content too and will be part of your e.g. PDF.

Like # people like this

Looks like solid steps, but it would seem my current editor is not giving me the option to directly add an Anchor, maybe it's named something different now?

Like Mark Summerville likes this

It appears that they did away with the anchors.  Very frustrated.  Thought using the Header links would work as described in the article below.  They work great in Confluence.  However, we use our confluence pages with Jira. Not only do the header links used as jump links.. not work.. But neither does the Table of contents. Ugggh! Constantly finding a work around with this program.  Also the solution that was written below to add a script.. is only for admins.  I believe we have about 75 employees in our company.. The person who purchased the program is not going to give us all admin access.  This should be a standard user feature.

https://community.atlassian.com/t5/Confluence-questions/Did-the-new-Confluence-update-remove-Anchors/qaq-p/1161043

Like Atlassian user likes this

You rock, Sattesh! Your instructions helped PERFECTLY! Thank you.

Still working in 2023! A floating TOC would be so much nice to have! But until then this will do nicely.

Hello Prince,

Navigate to the Administration ConsoleCustom HTML and edit the At end of the body section. Here you can add custom JS to implement your requirement.

For example you could use

<script>AJS.$('#main-content').after('<div><a onClick="window.scrollTo(0, 0);">Back to top</a></div>');</script>

This will add a Back to top link at the bottom of every page. Modify the inserted html to adapt it to the desired look and feel.

Best, Tobias

Easiest Solution:

You could just create a link with a '#' as url

Confluence (like browsers do) will interpret an empty hash (anchorname) as a pointer to the page itself, thus it will link to the top of the page.

empty-anchor-link-to-top-of-page.png

It is not quite the same, as with your solution you refresh the page like opening a new link while with the anchor you just navigate to the top again without refreshing the page.

Like Chris Reedy likes this

it's not the same, but it will do the trick without any scripts

Like Aidi Vu likes this

Suggest an answer

Log in or Sign up to answer
TAGS

Atlassian Community Events