19

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.

Feed
[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.

Entradas Relacionadas:

19 comentarios:


Anónimo

Estimada Rosa:

Espero que estés tranquila y contenta despues de tus vacaciones.
Como siempre dudas y más dudas.
Lo que pasa es que tengo una lista de links en la columna principal del blog (foto/lado Izq), por defecto me genera un punto de color antes de cada link y una distancia entre el primer link y el título del elemento (A), bastante aceptable. Pero en el sidebar central del blog, tengo un elemento de "categorías" que son las etiquetas de mis posts (foto/lado derecho), en el que quiero lograr la misma distancia entre el primer link y el titulo del elemento (A) y también que aparezca el punto de color al lado de cada categoría, pero este solo aparece en la columna principal. Como hago para que todos mis listlinks se vean como la imagen de la izquierda.

Aquí va el link y espero que me hayas entendido algo.

http://img246.imageshack.us/img246/9731/problemasql9.jpg

Un abrazo

Anónimo

Uuuy Rosa:

una cosa más, antes de tus vacaciones, te mandé una consulta sobre el layout de los elementos de pagina, para ver las columnas ordenadas y no una encima de la otra, apliqué tus concejos, pero solo logré modificar el ancho de las columnas y no cambiar las posiciones. Es como si el problema fuese la distancia entre las columnas, pero no se si exista una variable para controlar eso.

Aquí te mando la foto para que te acuerdes:
http://img149.imageshack.us/img149/9156/elementosdepaginaod9.jpg

Saludos de nuevo.

Fini Calviño

Cuando puedas pásate por mi blog que te he nominado con un premio :-D

Lupus

Que tal Rosa? Como idea para aumentar el SEO de Generación Blogger decidí hacer invisible para los googlebots el widget de Categorías (Etiquetas) que tengo en el sidebar, por el tema de que se repiten demasiado los mismos links. Para eso le agregue la etiqueta rel= no-follow en la siguiente parte del código del artilugio:

<*b:if cond='data:blog.url == data:label.url' rel='nofollow'*>
<*span expr:dir='data:blog.languageDirection'*>
<*data:label.name/*>

Crees que está bien situado en el código del artilugio??

Anónimo

Lupus, supongo que si, ya que está colocado justo en la url de los links...

Carlos Pizcos

Hola Rosa!!! te debia la visita!!!

Quieres saber que hoy he andado tasteando con los feeds, se me ha ocurrido una seccion para la sidebar que podria ser interesante... Proximos post.

Ando trasteando con el draft y los post programados pero Blogger no me da el feed, seguire intentandolo...jajajaja...aunque si se te ocurre algo..ya sabes -)))

Anónimo

Una idea interesante :-X ¡que pena andar siempre escasa de tiempo...!
Si consigues algo, me cuentas:D

Anónimo

Takaya, no recuerdo la consulta que dices sobre los Layouts...
Verás, la parte de atrás de la plantilla no implica para nada a la vista real del blog, así que no te preocupes demasiado...aún así, esos cambios se consiguen en el css,donde pone: /** Page structure tweaks for layout editor wireframe */

Lo malo es que no hay un código exacto, ya que depende de las medidas de cada plantilla...voy a darte lo que yo tengo para el escaparate, prueba con eso a ver si te va bien, guarda sin miedo ya que como te digo no afecta al blog.
Si no te sirve, has de modificar los widtch hasta dar con tu vista de elementos más adecuada:
body#layout #outer-wrapper{padding:0; width:700px; padding:0px; overflow:auto }
body#layout #sidebar-wrapper{padding:0; width:200px}
body#layout #main-wrapper{padding:0; width:450px}
body#layout #header-wrapper{padding:0; width:700px}
body#layout #footer-wrapper{padding:0; width:700px}

Jabba

Oye oye oye, pero ¿qué pasa aquí? Que mi número de comentarios del Top comentaristas va bajando cada día... esto huele a Tongo eh? jejeje. Ahora me dirás que no... que el sistema no funciona del todo bien... que tiene algún error... :D :D. Y además Fernandooo1 ahí sin parar, venga a dejar comentarios, venga a dejar comentarios... y claro, subiendo puestos... uuuy, esto a mi me huele mal eh? jejeje.

Ahora hablando en serio. Tengo una curiosidad, y ya sabes que eres el tomo 1 de mi enciclopedia htmalera ;). Cuando escribo una entrada, si pongo una imagen en medio del texto y la centro, no sé por qué todo el texto que queda debajo cambia el color y en lugar de en negro se pone de color gris, por lo que me toca cambiar el color a todo el texto. Parece una tontería sin mayor importancia pero cuando parte de ese texto lleva enlaces, me toca también cambiar el color de los enlaces, por lo que es un poco coñazo y desde hace tiempo opté por colocar las imágenes tal cual sin centrarlas.

¿A qué puede ser debido?

Anónimo

Jabba, ni tongo, ni nada parecido :D
El ranking toma la información de los últimos 500 comentarios y los antiguos se van quedando atrás...así que ya sabes ¡a comentar! .-X

Lo de las fotos que me comentas, no lo había oído y menos visto, claro, nunca, de hecho me he quedado "flipada" :-O y como ya estarás intuyendo, no tengo idea a que puede ser debido...al menos no creo que sea nada que tenga relación con la plantilla...
Que ni idea vamos...:-$

..NaNy..

muy chulo y practico el menu con imagenes espero saver como poner las cosas. gracias ROSA

Anónimo

Nany, no es difícil si sigues los pasos como está, sin modificar nada, el menú debería aparecer en tu blog,después solo tienes que incluir los enlaces en el código.

Jabba

Toooooongo! Jeje, es broma mujer. Esperaba que me dijeses un "eso es porque tienes que modificar la etiqueta "hadegtjln" de tu plantilla", peeeero, me has dejado igual :p. De todas formas no es que sea nada demasiado molesto, pero si que es raro de narices...

Bueeeno, moltes grasies doña flor.

Anónimo

Hola Rosa,
como siempre que vengo encuentro lo que buscaba :D

Un pasito más allá: En lugar de ponerlo en la sidebar, me gustaría crear una página fija en mi blog con lo último de varios RSS, que se va a llamar "Actualidad". La idea es algo como la página de inicio de iGoogle.
Ya sé cómo crear páginas fijas a partir de entradas de blogger, de hecho creo que lo aprendí de ti, y tengo varias en mi blog.
Mi plan es crear los widgets y modificar el estilo como tu explicas aquí y luego de alguna forma llevarlos al cuerpo de la entrada.

¿Sabrías cómo hacer esto último?

Anónimo

aergenium, pues no, lo siento, los widgets de Blogger no pueden trasladarse a las entradas.

Manuel Heredia

¿Cómo has hecho tu página de Archivos? ¿No son widgets de etiquetas?

Anónimo

aergenium, no, mi página de archivos está hecha "a mano"...
Diciembre por ejemplo es un enlace normal en el que he colocado la url que obtengo cuando pincho sobre "Diciembre" en el widget de Archivos...

Manuel Heredia

OK.
Tengo una idea para probar:
1) colocar los widgets en cabecera o pie de página
2) mostrarlos condicionalmente sólo en la entrada concreta, utilizando las indicaciones en Vagabundia o Pizcos:

http://vagabundia.blogspot.com/2008/09/mostrar-elementos-condicionales-en-la.html

http://humanossinsentido.blogspot.com/2008/03/diferentes-elementos-en-la-sidebar.html

Te tendré informada.

¡Muchas gracias!

Anónimo

aergenium, gracias, me encantará ver el resultado...no es mala idea, seguro que consigues un resultado apropiado.

Publicar un comentario

Si vas a dejar una consulta, procura tener habilitado tu perfil en Blogger o deja la url del blog a revisar (no enlace).

Los comentarios están siendo moderados.

:) :(( :( :P :D :$ ;) :I :X :O |O :S