Ultimas entradas de tus blogs favoritos

Es posible colocar en nuestra sidebar un widget con las últimas cinco entradas de nuestros blogs favoritos, usando para ello el elemento "Feed" de Blogger. Podemos además añadir una imagen que identifique a cada blog usando, por ejemplo su favicón si lo tiene, y darle así un aspecto más original.


[1] Accedemos al blog del que queremos mostrar las entradas y pincharemos en su icono de feed, una vez que se abra la página para agregar su feed, copiamos la url que nos permitirá agregarlo.

[2] En nuestra plantilla, en la parte de "añadir elementos" escogemos añadir un nuevo elemento "Feed" y pegamos la url que hemos obtenido del blog. Si todo está correcto, Blogger identificará la url del feed y mostrará las últimas cinco entradas del blog, añadiendo de forma automática el título del blog elegido al nuevo elemento.

[3] Una vez añadido el elemento en nuestra sidebar, vamos al código de nuestra plantilla y sin expandir artilugios localizamos la línea de código que identifica al elemento, que será algo como esto:

<b:widget id='Feed1' locked='false' title='ReCurS.O.S para tu Blog By Ferípula' type='Feed'/>

Lo que nos interesa de está línea una vez localizada, es su id, que en este caso es Feed1

[4] Subiremos ahora hacia arriba, en la parte de CSS de nuestra plantilla, por ejemplo, antes de ]]></b:skin> añadimos el código necesario para modificar el aspecto del nuevo widget:

#Feed1 h2{
background:#ddd url(http://img504.imageshack.us/img504/2766/faviconqk7.jpg) center left no-repeat;
padding-left: 25px;
color:#000;
}
#Feed1{
background:#fff;
border:1px solid #000;
padding:5px;
}

[5] Es en este código donde hacemos los cambios que consideremos oportunos. La url de la imagen la cambiamos por la de la imagen del blog elegido, lo más fácil es usar su favicón si lo tiene.
En el caso de Ferípula (el de este ejemplo) no tiene favicón aplicado en su blog, así que tomé la imagen de su perfil y la reduje usando Favicon From Pics.
Si vamos a usar una imagen de mayor tamaño, tendremos que cambiar el valor en padding-left: 25px;, como mínimo, por el ancho de la imagen colocada.
Con este método podemos ir añadiendo tantos blogs como queramos mostrar, teniendo en cuenta, que cada nuevo elemento tendrá una id diferente: Feed1, Feed2, Feed3...y para cada elemento tendremos que añadir un nuevo código en el CSS con su id correspondiente e incluso podemos darle a cada widget un aspecto diferente, por ejemplo, un color de fondo distinto para cada uno, añadiendo por ejemplo background:#ddd; en el código CSS.