Añadir flecha en la esquina del blog de blogger para subir arriba


Si queremos que en la esquina de nuestro blog de blogger aparezca una flecha que al clicar en ella subamos arriba deberemos hacer lo siguiente:


1) Vamos a Diseño
2) Edición de HTML
3) Buscamos </body> (tecleamos Ctrl + F para buscar más rápido)
4) Justo antes de </body> pegamos el siguiente código:


<a href='#'><img alt='ir arriba' border='0' src='LINK DE LA IMAGEN' style='position:fixed; bottom:0; right:0;'/></a>



5) Ahora visitamos esta página: iconfinder.net
6) Una vez en la página, en Search, buscamos "up". Nos aparecerán multitud de flechas. Elegimos la que más nos guste.
7) Una vez elegida la imagen que más nos guste pulsamos sobre ella y nos encontraremos en otra página con ella. Sobre la flecha clicaremos en el ratón, botón derecho, y copiaremos la ruta:


8) Pegaremos la ruta de la imagen en el código del paso 4)

Nos qudará algo así:


<a href='#'><img alt='ir arriba' border='0' src='http://www.iconfinder.net/data/icons/gnomeicontheme/32x32/actions/gtk-go-up.png' style='position:fixed; bottom:0; right:0;'/></a>



9) Clicamos en vista previa y si todo está bien, guardamos la plantilla.



El resultado lo puedes ver en esta misma página en la esquina inferior derecha.

26 comentarios:

  1. muy bueno tu blog amigo, he encontrado muchas cosas utiles

    saludos!!

    ResponderEliminar
  2. Muchas gracias degafe. Me alegro que te sirva este blog.

    Un saludo!

    ResponderEliminar
  3. Enhorabuena,lo mejor que he visto hasta ahora ,muy, muy bueno tu blog sobretodo por lo claro de las explicaciones, otra vez enhorabuena y gracias

    ResponderEliminar
  4. Mil gracias a ti CAUCA. Comentarios como el tuyo me llenan de satisfacción y me hacen seguir adelante.

    Un saludo y bienvenido a quierocrearunblog.com

    ResponderEliminar
  5. Y si en vez de una imagen quiero poner un texto, por ejemplo: "Volver al principio" o "Arriba", ¿como tendría que hacer?

    ResponderEliminar
  6. O ambas cosas, es decir, una flecha con un texto.

    ResponderEliminar
  7. Hola T360R pues deberias crear una imagen de esas caracteristicas. Luego subirla a algun servidor, como imageshack.us y luego deberias poner la direccion de la imagen en el paso 8).

    Un saludo, espero haberte ayudado compañero.

    ResponderEliminar
  8. buenas quiero como has vuelto a poner la flecha voy a la pagina y no se me ven las imagenes al no verlas no me las puedo descargar

    ResponderEliminar
  9. Hola goyu. Me lo preguntaste en otro comentario y te respondí. De todas formas te lo vuelvo a decir por aquí. Sustituye el link por este: http://img255.imageshack.us/img255/8312/gtkgoup.png

    ¡Un saludo!

    ResponderEliminar
  10. Y para hacer que vaya al final? Supongo que tengo que cambiar # por algo, ¿no? pero ¿que pongo?

    ResponderEliminar
  11. Hola T360R. Para que vaya al final no podemos hacerlo con este método. Hay otro método mediante "scriptaculous" que te permite subir o bajar como si de una persiana se tratase.

    En cuanto pueda creo una entrada sobre ello. Saludos amigo.

    ResponderEliminar
  12. Hola: tengo un problemilla con la flecha. Hago todos los pasos y me sale bien. Guardo la plantilla, entro en el blog y está. Pero vuelvo más tarde a entrar y la flecha ha sido sustituida por la imagen de iconfinder. He probado con dos y me sale lo mismo. ¿sabes a qué es debido? Gracias. Un saludo.

    ResponderEliminar
  13. Hola LiPooh. Eso es porque la imagen da problemas en el servido que está alojada. Emplea la que puse en el comentario número 9. Saludos, me alegro volverte a ver por aquí.

    ResponderEliminar
  14. Perfecto LiPooh. Si quieres cambiar de imagen tan sólo debes subirla a algún hosting, como por ejemplo he hecho yo con imageshack.us

    ¡Saludos compañera!

    ResponderEliminar
  15. gracias por tu aporte funciono sin problemas

    lo puedes ver en:

    ENLACE

    ResponderEliminar
  16. Hola, bienvenido al blog. Me alegro que te haya servido. Un saludo, gracias por comentar.

    ResponderEliminar
  17. Hola,me gustaría saber como puedo poner la flecha al final de cada entrada,anteriormente lo tenia así,pero se ve que algo lié y no consigo restaurarlo ni mirando en la plantilla original.Muchas gracias de antemano

    ResponderEliminar
  18. Please try FindIcons.com, a much better icon search engine

    ResponderEliminar
  19. bueno, como se hace para poner una imagen que se mueva y diga subir en lugar de las flechas espero tu respuesta

    ResponderEliminar
  20. Hola!!!

    He seguido los pasos que indicas y ya tengo mi flecha en mi blog. Muchas gracias!!!

    Me he hecho seguidora de tu blog, así podré mejorar el mío.

    Saludos,

    akaneroller

    ResponderEliminar
  21. bacan el blog me sirve de mucho....felicitaciones amigo

    ResponderEliminar
  22. HOLA PUES DIJISTE ANTES DE b0dy PERO TENGO UN PROBLEMA ALLI TENGO UN CODIGO ANTES DE b0dy COMO AGO PUEDO PONERLO IGUAL NOSE SI AFECTARIA EL CODIGO QUE TENGO ALLI SALUDOS AKA DEJO MI BLOG :D

    ----► http://toltolo.blogspot.com/

    ResponderEliminar
  23. Muchas gracias,el mejor de los que he buscado y muy sencillo de colocar.
    saludos

    ResponderEliminar