Listones de Banderas para tu Blog ~ Cosas Para El Blog

En esta ocasión vamos a ver como poner una bandera en tu blog de manera similar a la que aparece en la imagen anterior, en resumen vamos a explicar lo siguiente:

Como poner una bandera en tu blog.
Poner la Bandera del lado izquierdo o derecho.
Poner ambas banderas al mismo tiempo.
Hacer que la bandera este flotando.
Poner un enlace en la bandera.

Como poner una bandera en tu blog

El proceso para colocar la bandera es el siguiente, debemos ir a la opción Planilla, Editar HTML, ahí debemos buscar esto </body> y justo antes pegar el siguiente código:

Guardamos los cambios y la bandera quedara de la siguiente manera (fija y a la derecha):

Poner la Bandera del lado izquierdo o derecho

Para poner la imagen del lado derecho es utilizando el código anterior, para alinear la bandera a la izquierda necesitamos que la imagen este adaptada para usarla de ese lado y lo que necesitamos cambiar es right:0 por left:0 y pegar el código justo antes de </body>, por ejemplo:

Guardamos cambios y nos aparecerá de la siguiente manera (fija y a la izquierda):

Poner ambas banderas al mismo tiempo

Para poner ambas banderas al mismo tiempo es necesario seguir el mismo proceso y pegar justo antes de </body> los dos códigos.

Guardamos los cambios y nos quedara de la siguiente manera (imagenes fijas a ambos lados):

Hacer que la bandera este flotando

Para hacer que la bandera flote, es decir, que aunque baje la pagina permanecerá visible, debemos realizar el mismo procedimiento y solo debemos cambiar position:absolute por position:fixed donde querramos que se realice este cambio, por ejemplo:

Guardamos los cambios y la bandera quedara de la siguiente manera (flotante y a la derecha):

Poner un enlace a la bandera

Para poner un enlace a la bandera debemos hacer lo siguiente, antes de cada código debemos anotar esto:

Donde dice URL del enlace o link debemos anotar la dirección que queremos que se habra al darle click. Al ultimo del código debemos anotar esto:

<img src="URL de la imagen" /></a>

La URL de la imagen es la dirección donde se alojo la imagen, en este sentido el código quedaría de la siguiente manera:

<a href="http://cosas-para-blogs.blogspot.mx/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgY-DvZ-zLCZ0YHCTf5DduQSLz0Ve-bnjxj_F5hhtQ39FHCZG9Rwm0hERcgfeeYhSklPZILJAokA4PR7An_CQDdU0x4UJjI1sbYHUwaawtTFrDF-W2xGwhH241nJGxHLktgrQCJFQS-Q3Y/s1600/Listones+de+Banderas+Para+tu+Blog+-+11-+Mexico-Derecha.PNG" style='position:absolute; top:0; right:0;'/><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgY-DvZ-zLCZ0YHCTf5DduQSLz0Ve-bnjxj_F5hhtQ39FHCZG9Rwm0hERcgfeeYhSklPZILJAokA4PR7An_CQDdU0x4UJjI1sbYHUwaawtTFrDF-W2xGwhH241nJGxHLktgrQCJFQS-Q3Y/s1600/Listones+de+Banderas+Para+tu+Blog+-+11-+Mexico-Derecha.PNG" /></a>

La dirección en rojo es el enlace al que nos llevara al darle click en la bandera.
La dirección en azul es en enlace de la imagen.

Guardamos los cambios y la bandera quedara de la siguiente manera (fija, alineada a la izquierda y al darle click nos llevara a la pagina especificada).

Espero les haya servido, acá les dejo unos enlaces de algunas banderas:

A peticion de Tensa Zangetsu va la bandera de Nicaragua:

Nicaragua Izquierda
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxSQKXY4TEagyt7rSh-MeEU0NcHxDxV7SNH34kX1cfpBoycamaHXG2V7Y43BnMMgyzqJlOl9fVxve6ApBQJI1-NXAmvhXLdBKYQPf0HRLHyvndwdsa-2Zfj-x_bbtO64XommPqpsCo8kU/s1600/Listones+de+Banderas+Para+tu+Blog+-+16+-+Nicaragua-Izquierda.png" style='position:absolute; top:0; left:0;'/>