Post Pic

How to: Create a “Scroll to top” link on your WordPress blog

When you finished to read a blog post it can be very boring to scroll back to top manually. In order to enhance your blog navigation and usability, here’s a recipe to create a simple – but useful – way for your reader to scroll back to top in a second.

First, open header.php and verify that you have a <div id="header"> somewhere. This should be the case on more than 95% of blogs anyways.

Open footer.php (or any other file) and insert the following code where you want your link to appear:

<a href="#header">Scroll to top</a>

That's all. Now, your readers can easily scroll to top after reading a post.

Related Posts

Related Posts

No related posts.

13 Responses

Jan 13 2009 15:51

Thanks for a nice tips. Just goes to show, he simple things can be very handy.

Jan 13 2009 18:55

I think most of the themes out there have this by default :)

Jan 13 2009 22:45

Is there a way to include a test about how long the page is? That way this would only appear if the post was over a certain number of characters.

Jan 14 2009 00:06

@Adam: Yes that could be done. I hould write a recipe about it if people are interested :)

Jan 14 2009 18:01

I’m interested…

Jan 15 2009 16:50

Thanks for this, jbj. Could be useful for those with long, posts… just like mine(http://www.jusuchin85.com/blog/2009/01/13/overcoming-writers-block/)!

Keep it up, man!

Jan 17 2009 01:22

`Scroll to top`

should work as well…

Jun 01 2009 00:51

<a href=”#post-”>Scroll to top

works fine if you want to scroll back to headline of post.

Jul 15 2009 22:56

You can also use #top

Sep 02 2009 15:50

Nice Idee and we will include this. Thanks

Sep 30 2009 14:56

Really simple anchor in HTML but I guess a lot of people are unaware of this.

Trackbacks:

Leave a Comment

* Name, Email, Comment are Required