Tutorial: Cómo poner 'botón subir' en tu blog + Botones de regalo
Hooola todos, el día de hoy les traigo el segundo tutorial del blog y es para que aprendan a colocar el botón "Subir".
Pero, ¿Para que sirve ese botón? se preguntarán ustedes, y pues yo les respondo que el uso de ese elemento es muy importante para quienes visitan tu blog, ya que les permite pasearse por el y volver arriba una vez hayan leído, y así poder ir al menu superior para seguir conociendo más tu página, además de que le da un toque super lindo y decorativo.
Si te decidiste a usar uno de estos botones, yo he diseñado algunos para que ustedes puedan usar libremente. Pero si te gusta diseñar o los mios simplementen te parecen super feos (que es muy posible) solo debes diseñar uno y subirlo a alguna plataforma para obtener su URL. Una vez lo tengas lo único que debes hacer es lo siguiente:
- Entrar en blogger
- Ingresar en la sección Diseño
- Dar click en Añadir gadget HTML
- Copias el código:
<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="URL de la imagen" /></a>
- Pegas el código y cambias lo rojo por la URL de la imagen en cuestión
- Clickeas en Guardar
- y finalizas haciendo click en Guardar cambios
NOTA: es recomendable que antes de guardar des click en vista previa a ver si el resultado final te gusta antes de guardar los cambios.
- y LISTO :) tienes un botoncito de lo más lindo y funcional en tu blog.
Aquí les dejo los botoncitos creados por mi para ustedes con sus respectivos códigos de instalación en la parte de abajo:
1.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5Nq7CfDyI0chuUOaLsdEyLfDS6ohowpDt3QgkpIwEEBElXKoRcU9dp71dEzXCH9BxNnnZv7xwrkD8RIQeoNKHtcPcnXebouw4iBQjcOoLFc51iaaPym4Zk5GOemLoz1Lv9tM4h5dzUsI/s1600/SUBIR+1.png" /></a>
2.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz0dSQH3on0kCT8A7tZFdaWGZFfcmda3oN7HdXwvAf_uon8WSaMJTSJs_s3BY4ZNDG2wHQy-k2Wq5stKUX7E2fgdwXU80gfGfmTKjFl-wF3uVT_SdxGnuIwwjSGo6-ui8HBLwYbOxvrgs/s1600/SUBIR+2.png" /></a>
3.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjeJ8KKSasiIpzWMTv6IVl60ckMJsBdxCTqWgoYRhvpfsOVedM7KOAFQQpc_4vLBGXKQXdtTjgFbHi3jQWOkrKMQzQlBEPealBUCfzkdehx2oOMwqsjl0j_hsHKyjCAxjNDB1JIQ9jltA/s1600/SUBIR+3.png" /></a>
4.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu-UWyZhi7Nxbd1o8fLGaijD5MGRQghAu8rCoParTTNJGpHKdT_ZqdbDdJbGDZUbTm3IaH1s2gUDWJ75MoHiFLamzRn8QSsrQTf82HEjb6OXd_BhOfJVkocjdE3FikK9071u88UnOjD6U/s1600/SUBIR+4.png" /></a>
5.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhy2E1R446INyb64rfcX2LWkHpYA4Q6sRBJUVFJBWAumanrNbcBg3Nw_JiJs5jQtwN9lMwdvi9XiyqR6xeKkyuMyW2DNjHPPJ5QmUN1Z3Q_UWFObBmaIgyyeZij4hg_Vkv-Uo4SrgTng8/s1600/SUBIR+5.png" /></a>
6.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzE9NHUZx7PS4khk6Hhc3aQlNCST48m7nxJn2LTZpYa0xwVDW4AdzWtb_DFzmvBdzT5u0QQ73DMMlgVs-VfHwRIHnNj3g9yUpLJhd2arsY8o9SoMvGTmNZSRKtHAbPtv3KWy0zV4t_O80/s1600/SUBIR+6.png" /></a>
7.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxyr_DV8R3IQQRbo_bnUXUGHnSXW7KQdRtTMLX-943ytrJu6EIhMwBf_w9WeaVnzHr6XZgqq_vG-J9rGLoJ9vkJ9qbA2MBUUGJv_RTvrZRgdnmEPqMnTNY4DdbPkagkzPyKeJvn0tEco0/s1600/SUBIR+7.png" /></a>
8.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvCR2WGIiBezJNoYtc1IYZckEgoNCdVJ930q8D1sIVfi6dZeWA4whkDAi45A0D4sUfRsX63Q5C0VAPihpqoGHO8oCqB-jVGxNQMK41k_UQKLPNbmRkNITdDsMaKeAv4vJXvhCjaBNpB6w/s1600/SUBIR+8.png" /></a>
9.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXc5frm0rtzHmjgTElyPZ_bYW2FXNjTRoiJpgJX-hDyDEyJZvVH2-zRI6nBE_36uTSuqP7Rwpg07yUDB17IsBfs2HMstfpEOcRnrSTfd6xO8D_laAnNCCrSX7ZJcyQG-YpX0FjLGluUGw/s1600/SUBIR+9.png" /></a>
10.

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Subir arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYpKXfTfxSt2q1UzT2SHFUFMd9hv6ltVNk9mEKJnGlvHj19yZJ9jfedaluEb1uyi5nfSiJOlb_4hD4ENOA2Ad1jD8Y0wH40UpkGVxsV8MbiIXvI0YyxTjJd7ooqjzLA_TX_-lSFC_D3Eg/s1600/SUBIR+10.png" /></a>
Espero los botones sean de su agrado y si usas alguno de estos no dudes en dejarme el link en los comentarios para darme un paseo por tu blog y ver que tal luce. De igual forma puedes dejar tus dudas, sugerencias o peticiones que yo gustosa te ayudaré.
Que tengan un buen inicio de semana
-Liseth-
18 Pensamientos
Hola! muy practico el tutorial ^^ gracias por los botones, yo he utilizado uno de ellos, ¡son una monada! te dejo link para que lo veas ;) http://losmundosdechibita.blogspot.com.es/
ResponderBorrarBesos guapa!
Hola!
ResponderBorrarMuchas gracias por el tutorial ^^ Y por los botones, son amor! <3
Un saludo :)
Hola^^
ResponderBorrarMuchas gracias por el tutorial y los botones!
besos
¡Hola! Ya conocía este tutorial, yo también puse uno en mi blog hace un tiempo. La verdad es que es súper práctico.
ResponderBorrar¡Muuuak!
Están hermosos!
ResponderBorrarPrecisamente estoy trabajando en un tutorial parecido!!! pero no lo he subido porque estoy diseñando unos botones para dejarlos jajaja
besos!!!!
Gracias por el tuto ^^ pondré alguno de tus botoncitos en mi blog :3
ResponderBorrarBesos
holabuenas noches antes que nada muchas gracias por el tutorial me tarde enencontrar uno que me funcionara y este lo hace de maravilla.
ResponderBorrarqueria saber si podrias decirme como hacer un boton igual --ir arriba --pero con efecto deslisante
¡Qué facilísimo! Tanto que estuve batallando para encontrar un tutorial y ahora me topo con este. ¡Muchas gracias!
ResponderBorrarHola, me he quedado con el de la gotita de agua puesto que mi blog está orientado al tema acuático, muchísimas gracias.
ResponderBorrarBesitos
Puse el botón pero cuando doy clic no sube, alguien me podría ayudar??
ResponderBorrarEste comentario ha sido eliminado por el autor.
ResponderBorrarHola!! muchas gracias por los botones XD Es la primera vez que pongo uno en mi blog pero se ve super lindo :3! Gracias por explicar lo de la imagen y todo. Me sirvió un montón :D
Borrarhttp://unahistoriaentremuchas.blogspot.mx/
Saludos!
Hola!! el tutorial me pareció super!! ya tengo uno de esos botoncitos que me han parecido geniales.saludos!!
ResponderBorrarhttp://manualidadesaruy.blogsport.com
¡Holaa! Acabo de ver esta entrada, tenía otro botón de subir arriba, pero he visto estos tuyos y me han parecido tan cucos que lo he cambiado ^^
ResponderBorrarhttp://delfinesleen.blogspot.com.es/
¡Saludos!
Hola! Yo no he podido hacerlo. Se copia el boton pero no hace la función de subir.
ResponderBorrarMira y verás:
http://cheloferrerblog.blogspot.com.es/
Holaaaa! son tan lindos no sabía cual escoger hahaha pero finalmente me decidi y quedo genial. Aca esta el link de mi blog para que vean http://aworldinbooksyeah.blogspot.com/ ... Espero su visita. Besos. :*
ResponderBorrarHoooola!
BorrarYa me paso por allá a ver que tal :D
Besoos ♥
Buenos dias
ResponderBorrarme parece muy chulo el botón y queda genial, pero no se que hice mal que no funciona. Te diré que estoy haciendo un curso que acabo de empezar y todo es muy nuevo. Gracias por tu ayuda.
http://gomezmartin1911.blogspot.com.es/#
Tu opinión es importante para mí, así que no dudes y comenta, que me hará muy feliz leerte.
Las unicas normas que debes seguir son:
-Sé respetuoso
-Si vas a colocar algún spoiler, avisa antes, así no incomodamos a nadie :)