How to Add Go to Top and Go to Bottom Buttons in Blogger - Hubuhs. Living and Sharing

Hubuhs. Living and Sharing

Hubuhs is spot for living, blogger, tech, sport, travel, auto and food

Go to top and go to bottom buttons on your blog : 1. Go to Dashboard, click Design, click Edit HTML 2. Find code of HTML below : ]]&g... nopict

How to Add Go to Top and Go to Bottom Buttons in Blogger

Go to top and go to bottom buttons on your blog :

1. Go to Dashboard, click Design, click Edit HTML

2. Find code of HTML below :

]]></b:skin>

you can use (Ctrl+F)

3. Right Before ]]></b:skin> place code of HTML below :

.gototop{
background:url(http://sites.google.com/site/blogfuelblogfuel/widgets-js/orange_arrow_up.png)no-repeat;
display:block;_display:none;
position:fixed;
z-index:9999;
text-indent:-9999px;
overflow:hidden;
outline:none;
width:128px;
height:256px;
right:88px;
bottom:8px;}
.gotobottom {
background: url(http://sites.google.com/site/blogfuelblogfuel/widgets-js/orange_arrow_down.png)no-repeat;
width:128px;
height:256px;
display:block;
_display:none;
position:fixed; z-index:9999;
text-indent:-9999px;
overflow:hidden;
outline:none;
right:8px;
bottom:8px;
}

NOTES :

You can change:
  • http://sites.google.com/site/blogfuelblogfuel/widgets-js/orange_arrow_up.png
  • http://sites.google.com/site/blogfuelblogfuel/widgets-js/orange_arrow_down.png
  • width:128px;
  • height:256px;
  • bottom:8px;
  • right:8px;
  • right:88px;

4. Find code of HTML below :

</body>

you can use (Ctrl+F) to find easily

5. Right Before </body> place code of HTML below :

<a class='gototop' href='javascript:scroll(0,0)' title='Top Page'>Top</a><a class='gotobottom' href='#footer' title='Bottom Page'>Bottom</a>

6. Click Save Template.

Done. Now, you've already added go to top and go to bottom buttons on your blog.
↩ Next Back to Top Prev ↪