Poner foto comentaristas en blogger

Con esto ponemos la foto de los comentaristas de nuestras entradas.

En otras plataformas es bastante común encontrar plantillas con la foto de los comentaristas de nuestro blog, esa foto es la que se encuentra en el perfil de los lectores. Blogger no contempla esa posiblidad.
Vamos a hacer algunos cambios que nos permitirá tenerlo en Blogger.

1. Descargamos el archivo comment_photos.js y lo alojamos en nuestro servidor habitual.

2. Antes de </head> añadimos este script:


<script src='url_comment_photos.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
BloggerProfiles.noimage =
'url_imagen_sinfoto'
BloggerProfiles.imageWidth = 60;
BloggerProfiles.imageHeight = 75;
addLoadEvent(function(){showCommentPhotos('commentphoto','comment-author',
1);});
//]]></script>
En url_comment_photos.js ponemos la url donde hemos alojado el fichero . js anterior.
En url_imagen_sinfoto ponemos la url de la foto que hemos elegido para identificar los comentaristas que no tienen foto en su perfil de Blogger.
En BloggerProfiles.imageWidth = 60; ponemos la anchura de la foto.
En BloggerProfiles.imageHeight = 75; ponemos la altura de la foto.

3. Expandimos la plantilla y buscamos la parte siguiente e incorporamos las dos lineas resaltadas en amarillo:

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<div class='commentphoto' style='float:left;'/>
<a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
<div style='clear:both;'/>
</b:loop>
</dl>

Y añadimos este css antes de ]]></b:skin>.

.commentphoto img {
margin: 2px;
}

Visto en Purple Moggy.

5 comentarios:

magbrastar

te aconsejo que te pongas un tagboard ps encuentrlo en
www.cbox.ws/

muy bueno el blog ...gracias me sirve de mucho...

Clauminara

Gracias, ya lo puse en mi blog y funcionó muy bien ;)

Riverloom

Buenas, llegue aqui desde un backlink, sea como fuera, me lo voy a mirarlo todo q tiene buena pinta tu blog :). solo queria preguntarte si desde ayer te pasa lo mismo que a mi , el script no funciona y solo salen las imagenes .noimage ... a saber que habra cambiado blogger XD.

felicidades por el blog y hasta pronto :)

jesgo

Riverloom:
Creo que tienes razón, el script ha dejado de funcionar, esperemos que sea de momento.
Gracias, hasta pronto.

» Escribe tu comentario aquí:


Si quieres hacer alguna consulta sobre tu blog habilita tu perfil o deja un enlace a tu blog:
<a href="url-de-la-página">Texto enlace</a>

» O utiliza el antiguo formulario


Los comentarios están siendo moderados y publicados lo antes posible.



jesgo23 ©2008/2009 | Plantilla Blogger | Diseño jesgo Creative Commons License