Como poner una imagen flotante de Halloween en Blogger

Terminamos la semana temática de gráficos de Halloween para decorar tu blog y tus diseños. Te dejo un pequeño recopilatorio de todo lo que he compartido con vosotros esta semana por si se te ha pasado algo:

Iconos Redes Sociales de Halloween Separadores de Halloween para el Blog Clip arts de Halloween para tus diseños Tipografías originales de Halloween

Hoy voy a contaros como poner una imagen flotante de Happy Halloween en la cabecera del blog, justo a la izquierda, para no tapar el título.

Código para añadir imagen flotante en el cabecero del blog

Es éste:

<a style="display:scroll;position:fixed;top:5px;left:5px;"  href="#" alt="Halloween" title="Happy Halloween"><img style="border:0;" src="URL DE TU IMAGEN"/></a>

♥ top:5px -> indicamos que queremos la imagen arriba (top) dejando un margen de 5px respecto al límite superior del blog.
♥ left;5px -> programamos que nuestra imagen aparezca a la izquierda (left) dejando un margen de 5px respecto al límite izquierdo del blog.
♥ # -> La imagen no enlaza a ninguna página, si quieres enlazarla a alguna página especial de tu blog, solo tienes que sustituir el símbolo # por la URL de tu página. Si no quieres añadir enlaces, deja la almohadilla (#).
♥ Halloween -> etiqueta alt, le indicamos a Google la descripción de nuestra imagen.
♥ Happy Halloween -> etiqueta title, este texto aparecerá cuando pasemos el cursor sobre nuestra imagen.

Cambiando estos parámetros puedes modificar la posición y margenes de tu imagen flotante para adaptarla perfectamente al diseño de tu blog. También puedes cambiar la descripción y el título.

♥ URL DE TU IMAGEN -> En esta etiqueta va el enlace de la imagen que queremos que aparezca en el cabecero de nuestro blog.

Se

Puedes ver el resultado en este blog de pruebas de diseño gráfico para blogger.

Elegir la imagen flotante para el blog

Instalar imagen flotante en la cabecera del blog

Muy sencillo.

Añadimos la URL de la imagen que hayamos escogido al código, por ejemplo:

<a style="display:scroll;position:fixed;top:5px;left:5px;"  href="#" alt="Halloween" title="Happy Halloween"><img style="border:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2vLfAOKmPmmZ18-u7bZ4OqOEtma53rhzN9KEVHPNsEB33Lu84iXIZcljPfZFhlWG1PWD2ViqdOL0rBQ19HAXVCi2oAEkDNMNFWFlQk8D7JJ-ypvLUi4GOoGfZeQHIUo5fiyA0O6XJK1E/w288-h306-no/001.png"/></a>

• Copiamos el código y vamos a Blogger --> Diseño
• Añadir un gadget --> HTML/Javascript
• Pegamos el código y aceptamos.

¡¡Listo!! Ya tenemos una imagen flotante de Happy Halloween en el margen izquierdo superior de nuestro blog. 

Para quitarla, solo tienes que eliminar el gadget y desaparecerá.

* IMPORTANTE * Si Blogger no te permite guardar tu gadget sin añadir un título pero quieres que aparezca en blanco para que no estropee la imagen, añade como título el siguiente código:

<h2></h2>

¡¡Ya me contarás si te animas a usarlo!! Y, si quieres, déjame el enlace para verlo, ¡que me hace ilusión!

---

Suscríbete a mis entradas por email ¡para no perderte nada!





♥ Las recibirás en tu bandeja de entrada el mismo día que sean publicadas ♥