75

Imagen y enlace en la firma del post para varios autores

Ya habíamos visto como cambiar la firma de las entradas por una imagen, veremos ahora como hacer eso mismo en un blog compartido es decir, con más de un autor.

Antes de empezar tendremos preparadas las imágenes que vamos a usar para cada autor, teniendo en cuanta que lo lógico será que todas tengan las mismas medidas y que no sean demasiado grandes pues no obtendríamos un buen resultado dado el lugar donde van a mostrarse.

[1] Una vez en nuestro panel de Blogger, vamos a "Edición HTML" y marcamos la opción de "expandir las plantillas de artilugios" para localizar este código:

<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>

[2] Tendremos que cambiar ese código por este otro:
<span class='post-author'>
<b:if cond='data:post.author == &quot;TU_NICK_AQUI&quot;'>
<data:top.authorLabel/>
<img class='blog-autor' src='URL_DE_TU_IMAGEN'/><data:post.author/>
</b:if>
<b:if cond='data:post.author == &quot;NICK DEL 2º AUTOR&quot;'>
<data:top.authorLabel/>
<img class='blog-autor' src='URL_DE_LA_IMAGEN_2º AUTOR'/><data:post.author/>
</b:if>
</span>
[3] En "TU_NICK AQUI" colocamos el nombre del autor principal del blog, escrito exactamente como su nick aparece en la firma de entradas,  y en "URL_TU_IMAGEN" la url de la imagen que usará el autor principal.

En "URL_DE_LA_IMAGEN_2º AUTOR" colocaremos la url de la imagen para el otro autor del blog.

[4] Si es necesario, añadimos algo de CSS para controlar la posición de la imagen (lo colocamos como siempre antes de ]]></b:skin>):

img.blog-autor {
padding: 2px; margin: 0; border: 0;}



Resultado:
Firma autores

Modificaciones:

En el ejemplo son dos los autores que publican en el mismo blog, para hacer lo mismo cuando son más de dos, tendríamos que añadir en el código las condicionales necesarias por cada autor.
Por ejemplo para un tercer autor, colocaríamos en el código antes de  </span> esta nueva condición :
<b:if cond='data:post.author == "NICK_DEL_TERCER_AUTOR"'>
<data:top.authorLabel/>
<img class='blog-autor' src='URL_DE_LA_IMAGEN_TERCER_AUTOR'/><data:post.author/>
</b:if>


Haciendo unos ligeros cambios en el código, también podemos conseguir:

Mostrar la imagen después del nombre del autor
<span class='post-author'>
<b:if cond='data:post.author == "TU_NICK"'>
<data:top.authorLabel/>
<data:post.author/><img class='blog-autor' src='URL_TU_IMAGEN'/><data:post.author/>
</b:if>
<b:if cond='data:post.author == "SU_NICK"'>
<data:top.authorLabel/>
<data:post.author/><img class='blog-autor' src='URL_IMAGEN_OTRO_AUTOR'/>
</b:if>
</span>
Firma + imagen

Firma sin el "publicado por"
<span class='post-author'>
<b:if cond='data:post.author == "TU_NICK"'>
<data:post.author/><img class='blog-autor' src='URL_TU_IMAGEN'/><data:post.author/>
</b:if>
<b:if cond='data:post.author == "SU_NICK"'>
<data:post.author/><img class='blog-autor' src='URL_IMAGEN_OTRO_AUTOR'/>
</b:if>
</span>
Firma e imagen

"Publicado por" y la imagen de la firma
<span class='post-author'>
<b:if cond='data:post.author == "TU_NICK"'>
<data:top.authorLabel/>
<img class='blog-autor' src='URL_TU_IMAGEN'/>
</b:if>
<b:if cond='data:post.author == "SU_NICK"'>
<data:top.authorLabel/>
<img class='blog-autor' src='URL_IMAGEN_OTRO_AUTOR'/>
</b:if>
</span>
Publicado por+imagen

Enlace en la imagen de la firma a un sitio determinado

Lo haremos tal como ya hicimos antes al añadir el enlace en la firma del autor, dentro del código anterior y en la imagen de cada uno:

<a href='http://url_del_enlace' target="_blank"><img class='blog-autor' src='URL_IMAGEN_OTRO_AUTOR'/></a>

Entradas Relacionadas:

75 comentarios:


Iván_RG

Mira por dónde, me pillas conectado y "rebuscando" en tu blog... gamberra!!

Muy bueno y útil el truco, no estaría mal para identificar los post de Todotwitter ahora que también voy a a andar yo por allí...

POR CIERTO!!! oooohhh... cosa bonita el nuevo botón para enlazar tu blog que has puesto en la sidebar... jajaja!!

Un beso, ...miss DJ!!

★Iván
P.D.- Creo que ya arreglé mi problemín con mister Google... (misterio, misterio...)

Nathan yo

Eres una genia Rosa :p este truco es muy útil para diferenciar de manera pesonalizada a los autore bien... muy bien

Theemilio_crazy

Esto es Excelente Rosa Muchas Gracias :D

Anónimo

Rosa y si son mas de 5 autores, como sería el código?

Lino Moinelo

¿Se podría poner de alguna forma la foto del perfil de blogger?

Saludos

Anónimo

Nav!´s En la entrada está, en "modificaciones" has de ir añadiendo tantas condicionales como autores...

Izquierda Unida Benalmádena

Hola!
Te quería preguntar como consigues poner un color de fondo y tenerlo encerado con lineas azules cortanres como por ejemplo el de "Dejotas Radio" que tienes en el sidebar.
Gracias

núria

Hola, rosa!
He mirado en tu blog por si lo habias explicado pero no encontré nada. Quiero cambiar el color de mis enlaces (salen azul eléctrico :( pero aunque me deja en Fuentes y Colores luego no se refleja en el blog*.
Muchas gracias.
http://miazulejo.blogspot.com/
* sí cambia el color una vez visitados

Anónimo

ola Rosa, tengo 14años, llevo un rato viendo este blog, si q lo tienes bien lindo!! te felicito xq he aprendido muchas cosas de aqui....me gustaria q visitaras mi blog:
http://lacasitadeperros.blogspot.com/
Gracias!!!

Tokio Hotel Costa Rica

Hola Rosa
Muchas gracias por contestarme exactamente con lo que quería hacer, claro que esta idea estña mejor que la que tenía en mente porque en esta puedes agregar una imagen.

Para hacer algo así es necesario crear perfeiles en otras cuentas de blogger? Me refiero a que lei algo parecido a esta entrada solo que mencionaba el hecho de enlazare perfiles de los autores desde otras cuentas de blogger...

Muchas Gracias otra vez y Saludos

Eli - http://tokiohotelcr.blogspot.com

Anónimo

núria Si te deja en fuentes y colores pero luego no se refleja, me da que pensar que usas Word para editar tus entradas... eso es uno de los efectos habituales de usarlo, cuando no peores...
Word es incompatible con Blogger, si es este el motivo, tendrás que editar las entradas donde lo has usado y desde la pestaña HTML retirar el código sobrante... o editar y borrar y volver a escribirlas...

Anónimo

Tokio Hotel Costa Rica Se supone que en un blog con más de un autor, cada uno de ellos tiene cuenta en Blogger y por tanto perfil... puede enlazarse la url del perfil con la imagen tal como indico en la entrada.

Lino Moinelo

Al decir lo de la foto del perfil, me refería automáticamente, sin necesidad de saber la URL, solo el usuario que ha publicado.

Anónimo

Lino No de forma automática... que yo sepa al menos, o esto, o esto otro:
http://elescaparatederosa.blogspot.com/2008/09/imagen-propia-en-las-entradas-para-cada.html

Lino Moinelo

Gracias por la información. Saludos

Sailor

Eres una DIosa!!! gracias por visitarme!!!

Blog de Pruebas

hola rosa, muy bueno el blog, perdon que use este post para pedir ayuda, pero en el otro no entra nadie hace meses :s, bueno mira, yo estaba viendo tu post de como poner emoticones en el blog, este:

http://elescaparatederosa.blogspot.com/2007/05/emoticonos-en-tu-blog.html

y funciono bien, en los comentarios se ven correctamente, pero en las entradas se ven como un cuadrado negro alrededor, asi:

http://1.bp.blogspot.com/_8PJ-pgoBhWQ/RglKxIjdsaI/AAAAAAAABIc/_5J0u_HmYwA/s400/Dibujo.PNG

me podrias ayudar con este inconveniente? :)

Juan Carlos P

Tu blog está muy bueno. Felicitaciones

Anónimo

Blog de pruebas Aunque nadie comente hace años incluso...todos los comments llegan a mi email, estén en el post que estén, la próxima vez recuerdalo...

Y en cuanto a tu problema, tu blog no está online, sino privado, así que no puedo comprobar lo que dices, una imagen no me sirve.

laMar

No me cansaré de darte las gracias por tu blog. Me solucionas un montón de dudas y problemas. Gracias.
Un abrazo

Casi Angeles Remix

Hola Rosa, me gustaría que me agregues a tu lista de blog's recomendados. Mi blog se trata de una serie Argentina "Casi Angeles", creo que tambien se emite en España, no se si la conoces. La dirección es http://casiangeles-remix.blogspot.com

Yo ya te agregué a la mía. Muchas Gracias.

Theemilio_crazy

Rosa, Ya no se Que hacer, Estoy por volverme loco :(... Es que mi buscador no funciona y no se que puedo hacer y los usuarios ya se estan quejando mucho por que no pueden encontrar nada, no aparece nada aunque este en el blog. Por ejemplo estas peliculas

Busqueda Implacable lo escribes y no aparece y aqui esta el link

http://www.elmundodepeliculas.org/2009/01/busqueda-implacable-taken.html

osea que si esta en el blog

esa es solo una de tantas que no aparecen, Rosa espero que me puedas ayudar, ya no se que puedo hacer...

Botineras Telefe

hola rosa quisiera saber si porai sabrias como resaltar una frase osea que una parte del texto tenga otro color de fondo espero la respuesta

Anónimo

Casi Angeles Remix No hago intercambio de enlaces.

Anónimo

Theemilio_crazy Me pasó como a ti...al incluir Blogger los cambios en las plantillas para el nuevo "leer más" los buscadores normales, no son capaces de encontrar todos los datos... no se como resolver eso.

En mi caso y como puedes ver, he optado por usar el buscador gadget de Blogger, va muy bien y muestra resultados muy concretos y afinados...

Anónimo

Noticias al instante Algo como esto??:
http://elescaparatederosa.blogspot.com/2007/05/destacar-texto-en-una-entrada-usando.html

NeNe_WeNo

Muy buenas. ¿Y es posible poner el enlace a solamente las entradas del autor en cada caso? Porque no encuentro nada al respecto... :-|

Saludos.

Anónimo

NeNe_WeNo No es posible, que yo sepa...

Nathan yo

Rosa, en serio esa radio que has puesto me encanta, pone "puras buenas" LOL

Gilda Dmyuv

Eres la mejor, lo he probado y funciona genial. :)

Kisses

Eligor!

Wow.. rosa que buen aporte! como siempre jeje tengo una pregunta? como puedo Ocultar/Mostrar la barra de navegacion de blogger? intente esto pero nada :S http://ayudaparaelblog.blogspot.com/2007/06/ocultarmostrar-la-barra-de-navegacin-de.html ...

alguna idea? :D

Anónimo

Lacrimas (Adm) Si, tengo una idea :D... ¿Porqué no usas el buscador y pones Navbar en el, que es como se llama la barra de Blogger?

Bleid

Hola rosa
tengo mi firma ya creada, y estoy intentando añadir otra para otro autor.Hago todo como tu dices, y cuando lo hago solo se ve l afirma del nuevo autor
help me
gracias

Anónimo

bleid Tienes costumbre de decir siempre "hago todo como dices"...todos mis trucos los pruebo yo antes en varias plantillas y funcionan, con lo cual algo no haces como yo digo...cuando explico una entrada, lo hago lo mejor que se y puedo, así que cuando he de volver a explicarlo lo hago exactamente igual...revisalo.

Bleid

Hola rosa
se que soy pesado, he puesto lo de meta content , pero sigue saliendome en laparte superior del blog, supongo que me he dejado algo, alguna " o / lo intento buscar pero no lo veo.
Por lo que me has puesto en el tema de la firma, tienes razon, a veces voy tan deprisa que me salto cosas, y logicamente no lo hago como tu dices si no saldria bien.Ten paciencia conmigo porque soy un poco tarugo para esto de los blogs
gracias

Anónimo

bleid De verdad que no lo entiendo... ¿cambias la que ya has puesto por la que te digo o la dejas ahí y pones la otra?
Borra esa que has puesto y colócala de nuevo como te dije, sino se queda bien ya no se entonces que decirte...

Bleid

ok
de todas formas, yo tengo creada una firma para mi, entonces lo que hago ahora es intentar añadir una firma para mi mujer, pero al hacerlo sale solo su firma y la mia desaparece.Voy a seguir probando desde el principio pero en mi firma sale como un codigo html a parte de la url y no se si en a de mi mujer debo ponerlo tambien
gracias por tu paciencia
saludos

Jessica

Hola Rosa! Hace tiempo que no te molestaba con mis preguntas, pero ahora me quedé estancada en algo aquí, y quería saber si puedo molestarte nuevamente preguntandote algo.

Deseo hacer un recuadro con una mini-biografía para cada autor en el footer de cada entrada. Esto es para mi blog Intérpretes de ASL/Español ( http://interpretesdeasl.blogspot.com/ )

Quiero hacer algo al estilo de PSD.tutsplus.com, pero en vez de tenerlo al principio de cada entrada, q sea al final, justo arriba de donde tengo puesta ahora la fecha/autor/labels.

¿Sabes cómo podría lograr hacerlo? He estado buscando en tu blog, el de Gema, el de JMiur, y no he hallado nada en específico sobre como hacer esto.

Te agradezco muchísimo cualquier ayuda. :D

--Jessica

Anónimo

Jessica Esto es algo que "se aproxima" a lo que dices:
http://elescaparatederosa.blogspot.com/2008/09/imagen-propia-en-las-entradas-para-cada.html

En esa web que me muestras, a pesar de que no es de Blogger y no puede compararse...lo hacen incluyendo cada autor cuando publica el código que muestra esos datos, no de forma automática...

En algunos blogs de Blogger, incluyen el código de todos los autores en la plantilla de entrada (Cofiguración) y a la hora de publicar, cada autor borra el de los demás...claro que de esta manera solo podría estar o antes de la entrada o después, pero siempre dentro del "cuerpo" de esta...

Jessica

Gracias, Rosa. Sí, pensé en hacerlo como tu explicas en esa entrada q mencionas, pero solo permite imágenes, no? Eso sería una solución, si las convierto a solo imágenes.

También encontré ayer esta entrada
http://chethstudios.blogspot.com/2009/01/wordpress-about-author-widget-blogger.html
que explica lo mismo q tu dijistes, haciendolo de forma manual para cada autor.

Así terminé haciéndolo, aunque es algo tedioso. Voy a ver si encuentro alguna forma "mágica" de hacerlo automático.

De todas formas, gracias por responderme tan rapidito! :D Y gracias por tu ayuda siempre. Vales un montón :D

Diego Arenas

Rosa tengo un pequeño problema tengo 3 colaboradores en mi blog mas yo 4 siguiendo este tutorial tuyo va todo bien..... lo que pasa esque en la firma que tengo de autor se le añade en las respuestas a los otros 2 colaboradores como arreglo ese detalle?

Asi tengo el codigo aplicado en mi blog

http://boxstr.com/files/6123384_fu5ty/Autores%20imagenes.js


Diego Arenas

Anónimo

Diego Arenas La firma en los comentarios es independiente de esto...está aplicada para el autor del blog sea quien sea...así que tal como la tienes no sirve.

En cuanto pueda publicaré algo al respecto,pero te adelanto que sería algo así:
http://banakabanaka.blogspot.com/2009/02/imagenes-en-los-comentarios1-firma.html

Diego Arenas

--->>> que mal :(

Rosa como quedaria el codigo siguiente:

"Publicado por" y la imagen de la firma

Pero para 4 autores del blog ?


Diego Arenas

Ascanio

una pregunta como le hago para poner en mi blog los enlaces hacia la entrada reciente pagina principal y entradas antiguas

Anónimo

Diego Es igual que el de esta entrad, solo que pones la imagen de la firma de cada autor en la url de la imagen...

Anónimo

Por Chars Mira si es este el problema que impide mostrarlos:
http://elescaparatederosa.blogspot.com/2009/03/recuperar-los-enlaces-de-navegacion.html

Dark

:)Rosa eres lo maximo te lo agradesco muchisimo.

Emmanuel Rodriguez

la verdad que no me sale y es raro...
nomas me sale la firma del otro compañero...
ayudame please

Anónimo

RD-JUEGOS No se como puedo ayudarte más...:( si solo sois dos autores, es más sencillo aún, pues es justo el ejemplo de mi entrada para dos...

Emmanuel Rodriguez

ok... intentare...
Quiero que expliques como colocar un fondo al blog.. Porfa!

Anónimo

RD-JUEGOS Eso puedes verlo aquí:
http://elescaparatederosa.blogspot.com/2007/01/imagen-en-el-fondo-de-pgina-blogger.html

Alexis S

hola rosa me podrias ayudar con el contenido de mi blog mira este es mi problemacuando ecribo algo en una nueva enrada la letra me sale muy pequeña y lo que quiero es cambiar el estilo y el tamaño.

No se si se pueda aser eso en edicion de plantilla por favor ayudame

Anónimo

alex Eso lo haces en fuentes y colores.

Diva Gando

Hola,

Hola Rosa,

He probado lo anterior y lo otro y nanai. El caso es que yo despues de lo de post author
span class='post-author' tengo "vcard". No sé si eso puede influir.

Otra cosa, si he escrito alguna pregunta para que me ayudes y no recuerdo el post donde lo he hecho, ¿Cómo lo puedo ver? Lo ideal sería hacerlo en la columna que tienes en la entrada al blog a la derecha que pone "ultimas opiniones" Sin embargo allí van desapareciendo a medida que surgen nuevas. ¿Como puedo acceder a mis preguntas "viejas"? ¿Existe la forma?

Again aqnd again. Gracias.

Anónimo

Diva Gando Eso no tiene nada que ver, yo también lo tengo así...

En el formulario de comentarios hay un enlace que dice "Suscripción por correo electrónico" ahí pinchas después de dejar un comment y las respuestas en esa entrada irán llegando a tu email... cuando recibas la tuya puedes "des-suscribirte" y ya etá.

Diva Gando

Rosa

¿Se puede cambiar sólo el color del nombre del autor de la entrada?
Para que sea diferente del resto de palabras que aparecen al final de la entrada (comentarios,etiquetas..)

¿Cómo puedes saber si tu URL es válida? Yo la copio en la barra de navegación y me da error. Es eso normal?

Gracias,

Diva

Anónimo

Diva Gando Si copias en el navegador la url de una imagen y da error, no es válida, para que lo fuese tendrías que ver la imagen al copiar su url e ir a la dirección.

Para cambiar el color solo al autor... localiza esto:
.post-author {

justo debajo añades el código para el color que sea:
color: #000000;

Unknown

disculpe las molestias pero no puedo poner otro
autor me aparece error en blogger :(

ademas aparece un nombre raro "Princelinnk"

ajala y puedas ayudarme.

www.carlospsp.blogspot.com

carlos.15-gold@hotmail.com

Rosa

carlos.15 No se que más ayuda puedo darte que la entrada... ahí explico como lo mejor que puedo...

Aileen

Hola, Rosa, soy yo otra vez, Aileen =?

Resulta que en nuestro blog no tenemos autores principales, sino que somos todos administradores, ¿daría lo mismo poner el nick de cualquier administrador del blog si luego queremos que se vea "Publicado por" y la imagen de la firma solo?

¿Se me entiende? Jeje, bueno, gracias de antemano por contestarme anteriormente.

Muchos besos ^^, Aileen

Anónimo

Aileen Loa administradores también son autores, ya que pueden publicar... así que la respuesta es si.

Alice Blake (soñadores)

Hola rosa no consigo hacerlo para tres autores, sin embargo en mi blog de pruebas para un autor lo hago sin problemas si pudieras ayudarme te lo agradecería si necesitas los enlaces de las firmas, y la plantilla me avisas en mi blog, gracias

Anónimo

Alice Justo eso es lo que explico en la entrada... lo hago lo más claro y sencillo que puedo... más no puedo ayudarte.
Me es imposible hacer estas cosas yo misma a todos y cada uno que me lo piden.

Alice Blake (soñadores)

Hola de nuevo Rosa, ya he conseguido ponerlo para dos autores que salga solo publicado por y la firma de dos de nosotros pero al ir a ponerlo para un tercero, me da error. ?Me puedes dar el codigo entero para tres personas sin cortes por favor? muchas gracias

Alice Blake (soñadores)

Siento molestarte de nuevo Rosa, he vuelto a probar añadiendo el codigo que tu das para un tercer autor y nada ahora aparece en el blog dos firmas solamente y el tercer autor al publicar le aparece la firma de otro de los dos autores, puse el codigo que das despues de me estoy volviendo loca intentando modificarlo y sigue dandome error!

Anónimo

Alice Blake (soñadores) Pues así de pronto y gracias a ti, creo que el código que digo hay que añadir para más autores tiene un error... aunque hasta que yo tenga un rato y lo compruebe no estoy segura... en lugar del <b:else/> de cierre coloca ahí un </b:if>
Me cuentas y trataré de probarlo, se me complica porque no tengo un blog con mas de dos autores... pero tu dime a ver...

Alice Blake (soñadores)

Hola Rosa.

El problema que me surge al hacer lo que me dices es que en el codigo que no lleva para el nick, en la publicacion del (mi nick) aparece publicado por (firma) publicado por (firma del que no hay que poner el nick) y sin embargo el del (tu nick) sale perfectamente.

Anónimo

Alice He editado la entrada, y he eliminado cierta parte en las condicionales, espero que así sea más fácil para ti y para todos.
Por cierto... lo he probado en un blog de pruebas y funciona correctamente para tres autores... si tienes problema o quieres ver el blog de pruebas me lo dices.

Alice Blake (soñadores)

Hola Rosa (creo que acabaras arta de mi xD) mira he puesto los codigos y no me da error pero por alguna extraña razón, me aparece solo la firma del primer autor y del tercero el que puse en segundo lugar no aparece pone solo en (la hora) ni siquiera aparece el publicado por y he repasado varios veces los codigos y creo que estan bien. Yo ya no sé de que manera ponerlos

Anónimo

Alice No se que más hacer ni que más decirte... o algo no haces bien o es posible que este efecto no funcione en plantillas del Diseñador, que pasa con muchos...

Mira las tres entradas de mi blog de pruebas, y solo he hecho lo mismo que explico aquí:
http://picumoros.blogspot.com/

Alice Blake (soñadores)

Si la verdad que no lo entiendo porque me lleve los codigos a word para verlo mejor y ver que no los hubiera colocado mal y estan igual que explicas quizas sea por la plantilla. Esperare a que la cambiemos y lo probaré de nuevo, igualmente muchisimas gracias por la ayuda

Anónimo

Alice ¿No estarás pegando los códigos desde Word?... es incompatible con Blogger y una vez los pegas en una entrada, en la plantilla o donde sea, cualquier cosa puede pasar... desde cambiar el color a los enlaces del blog, hasta tirar la sidebar, he visto de todo...
Si vas a hacer eso, nada mejor que el blog de notas de Windows.

Alice Blake (soñadores)

no, no. Los he copiado a word para ver que estuvieran bien colocados despues de haberlos puesto en el blog. Pero desde word no los he pegado

Alice Blake (soñadores)

Hola Rosa, por fin logré poner las tres!!! creo que habra que montar una fiesta jaja la firma que no salía la hice nueva y la cambie por otro estilo y color y no sé como pero ya sale. Muchas gracias por tu ayuda :D

Anónimo

Alice ¡Me alegro mucho! :D

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