Como poner un boton que vaya hacia arriba

Hoy les mostrare como poner un boton que vaya hacia arriba o hacia abajo
lo primero es crear un elemento "div" y despues darle el nombre que quieran por ejemplo
<div id="arriba">
</div>
el atributo ID sirve para darle un nombre a nuestro elemento.

Despues podemos llamarlo con una etiqueta "a" de esta manera:
<a href='#arriba' onclick='new Effect.ScrollTo(&quot;outer-wrapper&quot;,{offset:-140}); return false'>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW8x52g0nIJMpch0Tiivlwh9oegf5dheFHcLQ47aeFlHIl4BkclJkrQsasvHIxc4wsYNi3S59OZVfeTo3UO9ZomjkEil_fSWpRQqsqVrwqBRLNejXuSRm2UcWe4X21NX1uXYgiSDVVLA/s200/arrow1a.png' style='position:fixed; top:0; right:0;' title='Ir arriba'/></a>

Ahora si queremos que el boton vaya hacia abajo tenemos que poner el elemento abajo del footer
de nuestra web o blog pero si queremos que vaya hacia arriba entonces lo ponemos en el head de nuestra web o blog

Sin embargo para los blogs de blogger es mas facil ya que podemos usar el elemento outer-wrapper
y asi vamos hacia arriba y para ir hacia abajo usamos footer

Ejemplos para blogger:

Hacia arriba:

<a href='#outer-wrapper' onclick='new Effect.ScrollTo(&quot;outer-wrapper&quot;,{offset:-140}); return false'>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW8x52g0nIJMpch0Tiivlwh9oegf5dheFHcLQ47aeFlHIl4BkclJkrQsasvHIxc4wsYNi3S59OZVfeTo3UO9ZomjkEil_fSWpRQqsqVrwqBRLNejXuSRm2UcWe4X21NX1uXYgiSDVVLA/s200/arrow1a.png' style='position:fixed; top:0; right:0;' title='Ir arriba'/></a>

Hacia abajo:

<a href='#footer' onclick='new Effect.ScrollTo(&quot;outer-wrapper&quot;,{offset:-140}); return false'>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW8x52g0nIJMpch0Tiivlwh9oegf5dheFHcLQ47aeFlHIl4BkclJkrQsasvHIxc4wsYNi3S59OZVfeTo3UO9ZomjkEil_fSWpRQqsqVrwqBRLNejXuSRm2UcWe4X21NX1uXYgiSDVVLA/s200/arrow1a.png' style='position:fixed; top:0; right:0;' title='Ir arriba'/></a>

Quiero aclarar que los elementos outer-wrapper y footer no estan en todas las platillas pero en las platillas Minima o Minima-Dark si estan estos elementos asi que si tienes una plantilla modificada es mejor que crees tu propio elemento.
Pueden ver como funciona aqui.

Eso es todo espero les sirva, cualquier duda o comentario ya saben como hacerlo.

Post dedicado a:·•º•·Yuri·•º•·