SERVICIOS - DISEÑO - FREEBIES - MEJORA TU BLOG -

26 dic. 2013

Pon una Flechita para subir arriba en tu Blog!!

En muchas páginas, y ya desde hace mucho tiempo, ha sido muy útil el botoncito a pie de página para subir arriba.

Normalmente os tendríais que hacer una imagen o buscarla hecha por Google o en algún sitio donde supiérais que hay botoncitos o flechitas ya hechas.
Pero bueno, supongo que (como en los inicios de todo blogger) esto está siendo más durillo de lo que pensaba, creo que una buena motivación para seguir al blog y ver que realmente merece la pena (porque sacáis muchas más cosas de la que se os puedan pedir, cursos, tutoriales, imágenes, etc.), es haceros unas cuantas flechitas y así tenéis donde elegir a parte de las instrucciones de cómo instalarlas en vuestro blog.
http://3.bp.blogspot.com/-9letcFTrhpw/UsttR86vbeI/AAAAAAAABNI/vTn1TelWZAs/s1600/flechita1.png

http://2.bp.blogspot.com/-5ir4C-TU554/UsttRyQjazI/AAAAAAAABNU/YjMZFWENWJY/s1600/flechita2.png

http://3.bp.blogspot.com/-6k5_Fz7DItE/UsttSO3TJWI/AAAAAAAABNM/5B7tqnEeI-4/s1600/flechita3.png

http://3.bp.blogspot.com/-mRI1An_ikn8/UsttSgCEgeI/AAAAAAAABNk/Hn949mI7X6E/s1600/flechita4.png

http://4.bp.blogspot.com/-dyzS_x7UEgE/UsttS_WNG4I/AAAAAAAABNg/FjkuosMpMS4/s1600/flechita5.png


Estas son las flechitas y la dirección que tiene cada una. Debajo es donde está alojada la imagen para que podáis copiar y pegar la dirección en el código que más abajo os dejo para instalar la flechita en el blog.
Vamos a ver como se instala después de que hayáis decidido que flechita os quedáis.

Este es el modo "Cutre salchichero" sólo os dirán este procedimiento aquellas personas que o bien no tienen ni idea de programar código o bien no tienen ganas de que vosotros aprendáis a pescar en lugar de daros un pez. (¿Entendéis?)
Copiar este código:

<a style="display:scroll; position:fixed; bottom:0px; right:1px;" href="#" title="Subir arriba"><img src="URL_deTU_Imagen" /></a>

Vamos al blog, Diseño->Añadir gadget: elegimos uno de HTML/Javascript y pegamos el código.
Guardamos, Guardamos disposición.
Vemos como queda en el blog.

Modo NORMAL: Este es el modo bueno porque a ver, en el pie de pagina de todos los blogs (si así lo dice la plantilla y en las predefinidas suele decirlo) hay como un marco flotante que se superpone a TODO lo que haya en la pagina para mostrar el pie (footer)

Por lo tanto lo que haremos es ir a:
Plantilla
Editar HTML
Buscar el siguiente codigo:
</footer>
Y justo encima escribimos el codigo de la flechita
<a href='#' style='display:scroll; position:fixed; bottom:0px; right:1px;' title='subir arriba'>
    <img src='URL_de_tu_Flechita'/>
  </a>

Ya está guardad y ya irá perfecta incluso a pié de pagina con cualquier plantilla.
Donde dice bottom: bla bla bla; eso es para que podáis moverla si la queréis mas arriba, mas a bajo, mas a la derecha etc...
Si os ha gustado tan sólo hace falta que dejéis ¡¡¡un comentario!!! Es GRATIS:)
Y si queréis hacerme aún más feliz podéis darle a Me gusta y agregaros al Friends Connect de Google que tenéis en la derecha.
¡Gracias y muchos besos!

22 comentarios:

  1. Respuestas
    1. De nada!! Felices fiestas y espero que tu flechita te haya quedado genial!
      Muah :k

      Eliminar
  2. Lireth, hoy estoy pesadita pero he visto que en el html tengo muchos footer, donde lo coloco?:S
    El primer foot que me aparece es así:



    Gracias!!!:)

    ResponderEliminar
  3. A ver yo en mi plantilla y lo normal es tener solamente 1 < / footer >. Si tienes muchos pues ves probando ajajaj yo optaría por el de más a bajo (no quiero arriesgarme pero pienso que en cualquiera valdrá porque lleva puesto el sitio exacto donde tiene que ir)

    Hazlo sin miedo pero acuérdate siempre antes de tocar la plantilla Haz una copia !!!
    :k

    ResponderEliminar
    Respuestas
    1. sí! Gracias! Pues mañana lo pruebo:D A saber qué de cosas tengo yo en mi html! el baúl de la piqué! jajja gracias y gracias!!!

      Eliminar
  4. Ya lo tengo hehco!Muchas gracias! Una cosita, el último enlace creo que tiene error. Míralo:)

    ResponderEliminar
    Respuestas
    1. Arreglao! estaba la url a la remanguillé ajajajjaja
      Muah! :k

      Eliminar
  5. Gracias! Me quedo perfecto :)

    ResponderEliminar
  6. Muchisimas gracias, llevaba mucho tiempo queriendo poner una flechita en mi blog, pero con el gadjet no me funcionaba, tus explicaciones han sido clarisimas y ya tengo la flecha.
    Gracias otra vez

    ResponderEliminar
  7. Gracias por explicarlo tan claro! Me ha quedado perfecto
    Besos!

    ResponderEliminar
  8. Mil gracias! LLevaba un montón de tiempo intentando ponerlo y que me quedara bien, y gracias a tus explicaciones lo he conseguido! Te acabo de conocer a través de "El Perro de Papel" y ya me has conquistado!
    Un abrazo

    ResponderEliminar
  9. ¡Mil gracias por el tutorial y por las flechitas! De momento, te cojo una prestada hasta que me haga yo una (que puede ser para dentro de mucho :)) Me encanta la que tienes tú puesta, ¿cómo/con qué las haces?

    ResponderEliminar
    Respuestas
    1. La que tengo yo la hice con photoshop, encontré el botón por ahí en negro y blanco pero era horrible!!! así que lo tunee con el photoshop y le puse las florecitas como las de la cabecera para que fuera a juego.

      Las que hay en Recursos para el blog, las he hecho con pickmonkey, tienes una guía súper completa y gratuita para aprender a usarlo súper rápido :). Besotes :k

      Eliminar
    2. Le echaré un vistazo a ese editor, no había oído hablar de él nunca. ¡Muchas gracias!

      Eliminar
  10. Gracias! La verdad es que hacia mucho que queria poner el botón de subir pero cuando encontraba una flechita que me gustaba no tenia la url y no sabia como ponerla y el la mayoria de los sitios explican fatal como ponerla, vamos que no me aclaraba y me sonaba todoa chino. Gracias a ti ya la tengo en mi blog y la he puesto de la forma normal y no a la choricera como tu dices jejeje, además en tiempo record.
    Ya me tienes como seguidora! Quiero hacer algunos cambios en mi blog por lo que me tendrás por aquí muy amenudo.
    Besoss

    ResponderEliminar
  11. Perfecto me quedó, muchas gracias.
    http://escueladeconocimientos.blogspot.com

    ResponderEliminar
  12. Hola Lireth, yo como siempre con mis dudas.
    La he instalado y me queda bien, pero me gustaría que solo apareciera en la versión web y no en la versión móvil que me queda muy grande y aparatosa ¿puede ser?

    Sin prisa, cuando vuelvas de tus vacaciones. Disfruta. Un beso

    ResponderEliminar
  13. Genial!
    acabo de ponerlo en mi blog! a partir de ahora gracias a tus consejos seguro que el blog va tomando forma :D
    Un abrazo! y gracias por estos tutoriales

    ResponderEliminar
  14. Hola Lireth...yo tengo una flechita ya puesta en mi blog pero quisiera personalizarla....si sigo tus instrucciones la vieja desaperecerá??
    Yo la puse hace tiempo y creo que fue de la manera agregar widget o css...no estoy segura....
    Gracias de antemano por tus estupendos tutos...besos

    ResponderEliminar
    Respuestas
    1. Tendrías que quitar la vieja para poner la nueva, sino se te solaparán.
      Quita la vieja pero guarda la imagen si te gusta y sigue el tutorial. Enseguida te contesto al mail :)

      Eliminar
  15. Lo acabo de poner en práctica en mi blog y quedó estupendo. Muchísimas gracias por compartirlo!

    Manuela.

    ResponderEliminar
  16. Hola, tengo una duda, lo puse en mi blog y todo muy bien, solo que al dar click a la imagen, no sube

    Me ayudas?
    Gracias

    http://misviciosyyo.blogspot.mx/

    ResponderEliminar