Tutorial: Boton UP

 -yo cuando se acaba la nutella xD-

Ohayou! Hoy traigo un tutorial para poner un botoncito UP, que se desvanece y aparece, empezemos.

1. paso:
Vamos a Plantilla>Edicion HTLM>Buscas </head> con Ctrl+f

2. paso:
Pegamos el siguiente codigo antes de </head>


 <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script>

y guardamos, antes viendo si no le ocurrió nada a nuestra plantilla.

3. paso:
Ahora buscamos  </body>

4. paso:
pegas el siguiente codigo

<div id='IrArriba'>
<a href='#Arriba'><span/></a>
</div>
<script type='text/javascript'>
//<![CDATA[
// Botón para Ir Arriba
jQuery.noConflict();
jQuery(document).ready(function() {
jQuery("#IrArriba").hide();
jQuery(function () {
jQuery(window).scroll(function () {
if (jQuery(this).scrollTop() > 200) {
jQuery('#IrArriba').fadeIn();
} else {
jQuery('#IrArriba').fadeOut();
}
});
jQuery('#IrArriba a').click(function () {
jQuery('body,html').animate({
scrollTop: 0
}, 800);
return false;
});
});
});
//]]>
</script>

5. paso:
Buscamos ]]></b:skin>
y pegamos el siguiente codigo:

/* Botón Ir Arriba
----------------------------------------------- */
#IrArriba {
position: fixed;
bottom: 250px; /* Distancia desde abajo */
right: 5px; /* Distancia desde la derecha */
}
#IrArriba span {
width: 60px; /* Ancho del botón */
height: 60px; /* Alto del botón */
display: block;
background: url(Url de tu botón) no-repeat center center;
} 

Lo que esta en Rosa es el ancho y el alto de la caja donde va el boton
en Url de tu boton ira la url de la imagen que quieras poner

Y eso es todo! Hasta la proxima entrada! 

        Creditos: Kumy