Hola a todos♥ Hoy les traigo un tutorial muy sencillo de como colocar un botón de subir en el blog, aquí una vista previa. Además les comparto unos modelitos por si quieren colocarlos en su blog.
Botoncitos para descargar
Como ponerlos en el blog
Solo tenemos que ir a Plantilla → Editar HTML y en el pegar arriba de </body> el siguiente código:
<span style="display:scroll; position:fixed; bottom:10px; right:10px; "> <a id='fly' style='cursor: pointer'>
<img src="url de tu imagen" />
</a>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'/>
<script src='//sites.google.com/site/pruebitawings/home/jquery-ui-personalized-1.5.2.packed.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function($) {
"use strict";
$('#tabvanilla > ul').tabs({ fx: { height: 'toggle', opacity: 'toggle' } });
$("#fly").click(function() {
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
});
});
//]]>
</script>
Ahora tenemos que cambiar lo que estaba indicado con colores, abajo especifico que color cambia que.
▄ Entre mas grande sea el numero el botoncito estará mas separado del fondo del blog.
▄ Entre mas grande sea el numero el botoncito estará mas separado del borde derecho.
▄ Aquí deben colocar la url del botoncito que escogieron.
Si quieres que el botón esté en la esquina izquierda en lugar de la esquina derecha de tu blog cambia lo marcado en verde por left:10px;
Si quieres que el botón esté en la esquina izquierda en lugar de la esquina derecha de tu blog cambia lo marcado en verde por left:10px;
Espero que les sea de utilidad el tutorial y que les gusten los botoncitos ♥
Hola!
ResponderBorrarLos botones están preciosos ♥
Gracias por compartirlos y por el tutorial.
Besos
Me alegra que te gustaran c:
Borrarmuy buen tuto, gracias por compartirlo y los botones están muy lindos
ResponderBorrarGracias... saluditos
gracias que bueno que te gusten :D
BorrarBuen tuto<3.
ResponderBorrarCreo que lo usaré en mi blog, saludos.
Hermosos botones, saludos!
ResponderBorrarmundo-sparky.blogspot.com
gracias por tu comentario :D
BorrarHola.
ResponderBorrarMe gusto mucho tu tutorial, cuando tenga algun tiempo voy a usar uno de los diseños que subiste :)
PD: Soy parte de la Iniciativa Blogs Asociados. ¡Te sigo!
gracias por pasarte y comentar.. ya me paso por tu blog :)
Borrar