Cómo poner un botón de subir arriba en blogger

Cómo poner un botón para subir arriba en nuestro blog de blogger

como poner un botón de subir arriba en blogger
Hola a todos, este es un tutorial muy sencillo y sobre todo útil. Os voy a explicar cómo poner un botón de subir arriba en vuestro blog de blogger. 
Este botón es una imagen enlazada que vamos a situar en la parte derecha del blog, en la esquina inferior (yo ya he puesto el mío por si lo queréis ver), sirve para subir arriba y volver al inicio del blog, al ponerlo facilitas a la gente que visita tu blog que puedan volver al inicio con un solo click y no tengan que hacerlo con la barra de desplazamiento del navegador.

¿Que necesitas para poner un botón de subir arriba en tu blog?

  • Una imagen representativa con una flechita o con un texto que indique su utilidad, podéis usar algunas de las imágenes o botones que os pongo al final
  • Este código:
<a style=”display:scroll; position:fixed; bottom:10px; right:80px;” href=”#” title=”Volver arriba”><img src=”https://lh6.

googleusercontent.com/–o4LqmhRiJA/U-CDrX0wmZI/AAAAAAAAFZc/OKM6ANlJe5M/h240/up.png” /></a>

Los números que he marcado en verde se corresponden con la posición del botón y los podéis cambiar, bottom:10px  es la distancia que hay entre el final de tu pantalla y la imagen del botón, puedes aumentarla o disminuirla, right:80px es la distancia que hay desde la parte derecha de tu pantalla hasta 
la imagen o botón, también la puedes aumentar o disminuir para ajustarlo al diseño de tu blog.
El texto resaltado en amarillo es la url de la imagen que estoy usando. Podéis usar esta misma o podéis usar cualquier otra que os guste.

¿Cómo pongo el botón de subir arriba en mi blog?

  1. Abre el editor de blogger y ves a Diseño
  2. Añadir un gadget, se abre una ventana con diferentes opciones, haz clikc en HTML/Javascript
  3. Copia y Pega el código que te he puesto arriba en la caja donde dice Contenido y dale a guardar.
  4. Ves a ver blog para ver si se ha insertado correctamente y se adapta bien a tu diseño,  si quieres modificar la distancia del botón puedes editar el código y hacer los cambios para ajustarlo a tu gusto.

Efecto para el botón de subir arriba

Esta parte es opcional pero si quieres que el botón suba con un movimiento suave hacia arriba (si no pones esto sube como de un golpe, pero esto le da un toque “slow”) tienes que poner en el html del blog: Plantilla/Editar Html buscar la etiqueta </head> y antes de esta etiqueta pegar el siguiente código:

<script src=”//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js”></script>


Nota: si vas a usar alguna de las imágenes de abajo puedes copiar su url (te pones sobre la imagen y le das al botón derecho de tu ratón, te salen una serie de opciones, entre ellas copiar url de la imagen), también la puedes descargar a tu ordenador y subirla a tu blog. Si eliges esta última opción, descarga primero la imagen, y después sube la imagen al blog pero no la publiques, cuando la tengas en el cargador de imágenes de blogger te pones sobre ella y con el botón derecho copias su url para sustituirla en el código


Botones  de subir arriba para descargar o usar 

¡Happy day!

49 Respuestas

  1. leviomat 3 años ago
  2. Cecilia 3 años ago
  3. Maryam A.S. 2 años ago
    • trinimora 2 años ago
  4. [[Sandra]] 2 años ago
  5. Mikel Books 2 años ago
  6. Ana Alvarez 2 años ago
  7. rosalia 2 años ago
  8. Jonathan Novel 2 años ago
  9. Rocío Ruiz 2 años ago
  10. Sil San 2 años ago
  11. Claudia 2 años ago
  12. AmoLeer 2 años ago
  13. SM 2 años ago
    • trinimora 2 años ago
  14. Violeta 2 años ago
  15. Alicia 2 años ago
  16. Oni♥ 2 años ago
    • trinimora 2 años ago
  17. Juan Alvarez 2 años ago
    • trinimora 2 años ago
  18. BetaTauri 2 años ago
    • trinimora 2 años ago
    • Anna Hernandez 2 años ago
    • Anna Hernandez 2 años ago
    • trinimora 2 años ago
  19. kuki Serena 2 años ago
  20. MonTse 2 años ago
  21. AgendadeCosturayMás 2 años ago
  22. Anna Mª Garcia 2 años ago
  23. Gema Martinez 2 años ago
  24. Julian Marin Munuera 2 años ago
  25. Julian Marin Munuera 2 años ago
    • trinimora 2 años ago
  26. Carlos L. Reyes 2 años ago
  27. Lilith Evelyn Evans 2 años ago
  28. yomar Gonzalez 1 año ago
  29. N%M 1 año ago
  30. Nicole Ledger 1 año ago
  31. karol ♡ 1 año ago
  32. nunu 1 año ago
  33. Edna María 1 año ago
  34. Edgar Rojas 1 año ago
  35. Génesis Briceño 1 año ago
  36. facfacade 12 meses ago

Añadir Comentario