⋆ Como hacer una imagen estática para tu blog ⋆

Hola lectores! les vengo a enseñar detalladamente como hacer una imagen estatica en la esquina de tu blog y que al hacer click en ella suba rapidamente a las parte superior del blog.


Lo que necesitaremos es:

⋆ Imagen que vamos a montar (recomiendo una imagen sin fondo/Render)
⋆ link de la imagen (podemos usar Tinypic o cualquier otro generador)
⋆ Photoshop (si van a crear la imagen ustedes mismos)

1) abrimos nuestro photoshop y creamos una nueva imagen

2) Colocamos la imagen (les recomiendo que mejor sea un render) y porque no tenia mucho tiempo, coloque el render ya listo para usar (si no sabes como hacer un render te lo explico aqui) 

 Dato extra: Uds pueden usar la imagen y el tamaño que quieran, para mi eso no es muy importante.

3) Agregamos la fuente (texto) que mas les guste y algunos detalles, pueden escribir lo que uds quieran.

  Dato Extra 2: Mas adelante les enseñare algunas tecnica para usar las fuentes.

 4) Ahora, como yo no quiero el fondo blanco de la imagen; solo lo uso para poder apreciar bien los detalles de la imagen, del resto no me sirve de nada. le damos click al botoncito de la capa (este se puede visualizar con un icono en forma de ojo) y el boton desaparece y a su mismo tiempo, la capa que teniamos de fondo.

 5) Despues de quitar el fondo, deberia quedarles algo asi en la parte del fondo.
Recuerden que como ya habian quitado el fondo, esta quedo sin ello, por lo tanto se visualizara de esta manera.

6) Luego no vamos a Archivo (File) >> Guardar como... (Save ass...) 

7) Luego nos saldra un cuadro que nos dira como queremos guardar nuestra imagen y cambiamos el formato predeterminado de nuestro photoshop por el nuevo "PNG"

Dato Extra: Para las imagenes sin fondo utilizamos este formato, y para las imagenes con fondo utilizamos "JPEG"

8) Nuestra imagen terminada se visualizara asi:

Ya ahora que terminamos nuestra imagen, vamos a pasarla a internet con Tinypic o cualquier otra plataforma que te permita generar URL de cualquier imagen. Click aqui para ir a Tinypic 

Y subimos nuestra imagen y le damos a "unpload now!"

Luego esta nos pedira escribir un catcha, y los redireccionara a nuestra imagen ya subida, y tomamos el siguiente codigo 

Nos vamos a nuestro blog, en el menu buscamos >> Diseño >> Añadir un gadget >> HTML/javascript

y pegamos el siguiente codigo 

 <a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="subir"><img src="URL DE LA IMAGEN" /></a>

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="subir"><img src="URL DE LA IMAGEN" /></a>

href="#" = Si quieren que su imagen vaya a alguna URL en especifico (si ponen esta opcion, lo mas probable es ya no funcion para subir)

title="subir" = Titulo de la imagen cuando se coloque el raton sobre ella.

img src="URL DE LA IMAGEN" = Cambian donde dice URL DE LA IMAGEN por el url de la suya, sin quitar las comillas (") 

Luego guardan sus cambios, y se van a su blog y debe quedar algo asi 

Recuerden que pueden modificar el tamaño de su imagen. y tambien subire algunas imagenes para que puedan subirlas en su blog. espero les haya servido y comenten si tienen alguna duda o sugerencia.

P.d: click aqui para ver el codigo