JMiur [E]

Pasó mucho tiempo desde que Maurico C. preguntara si era posible modificar la fuente o el color de fondo de los comentarios dejados por el administrador del blog pero, de todas maneras, aquí va uno de los posibles métodos para hacerlo.

En una plantilla normal, los comentarios se muestran en tres rectángulos diferentes:
<b:loop values='data:post.comments' var='comment'>

<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
....... es el nombre del comentarista y un ícono que lo representa .......
....... data:comment.authorUrl es la URL del comentarista  y data:comment.author su nombre
....... es el texto adicional que se muestra .......
</dt>

<dd class='comment-body'>
....... es el contenido del comentario .......
</dd>

<dd class='comment-footer'>
....... es la fecha en que fue enviado el comentario .......
....... también se incluye el ícono para eliminar los comentarios  .......
</dd>

</b:loop>
Como son tres partes diferentes, podemos modificar sólo una de ellas (en este caso la segunda) o todas a la vez de tal forma que los comentarios del autor en su propio blog se verán "tan distintos" como uno quiera.

Para conseguir esto, lo que debemos hacer es condicionar el código y verificar "quien" comenta y eso lo podemos hacer con la variable data:comment.author (nuestro nombre) o con la variable data:comment.authorUrl que es única y por lo tanto, más precisa. Esta URL es personal, cada usuario tiene una diferente y corresponde a la del perfil así que puede copiarse directamente desde el escritorio de Blogger en el enlace Ver Pefil. Sería algo así:

http://www.blogger.com/profile/XXXXXXXXXXXXXXXXXXXX

El primer paso es poner la condición "rodeando" el contenido del loop; sea cual sea el que tengamos:
<b:loop values='data:post.comments' var='comment'>

<b:if cond='data:comment.authorUrl == &quot;http://www.blogger.com/profile/XXXXXXXXXXXXXXXXXXXX&quot;'>

<b:if cond='data:comment.authorClass == &quot;blogger-comment-icon&quot;'>

<!-- estos serán nuestros propios comentarios -->
....... y aquí pondremos el nuevo código .......

</b:if>

<b:else/>

<!-- estos son los comentarios "normales" tal y como están ahora -->
<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
....... 
</dt>
<dd class='comment-body'>
....... 
</dd>
<dd class='comment-footer'>
....... 
</dd>

</b:if> </b:loop>
Si ahora guardáramos, veríamos lo mismo que antes pero no nuestros comentarios. Faltaría agregar el código para eso que, será muy similar al otro excepto que podemos eliminar cosas ya que sabemos que son nuestros y no hace falta verificarlos. El código podría ser algo así:
<div class='misComentarios'>
<dt class='comment-author-YOMISMO'>
<a expr:name='data:comment.anchorName'/>
<img class='icoYO' src='URL_miImagen' style='width:50px;height:50px;'/>El texto que queremos que aparezca
</dt>
<dd class='comment-body-YOMISMO'>
<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-YOMISMO'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'><data:comment.timestamp/></a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</div>
Para controlar el contenido con facilidad le agregamos clases CSS a cada sector. Así que ahora, podemos ir a la parte de estilo de la plantilla y antes de </b:skin> colocar esas definiciones.

dt.comment-author-YOMISMO { /* es el rectágulo superior con nuestro nombre */
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
background-color: aliceBlue;
border: 2px solid CornflowerBlue;
border-bottom: 1px dotted cornflowerBlue;
color: CornflowerBlue;
font-size: 22px;
height: 50px;
padding: 10px 10px 5px 10px;
}
dd.comment-body-YOMISMO { /* es el rectágulo central con el comentario en si mismo */
background-color: aliceBlue;
border-right: 2px solid CornflowerBlue;
border-left: 2px solid CornflowerBlue;
clear: both;
color: #444;
font-family: Comic Sans MS;
font-size: 16px;
margin: 0;
padding:5px 10px 10px 10px;
}

dd.comment-footer-YOMISMO { /* es el rectágulo inferior con la fecha */
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
background-color: aliceBlue;
border: 2px solid CornflowerBlue;
border-top: none;
margin: 0 0 30px;
padding: 10px;
text-align: right;
}
dd.comment-footer-YOMISMO a {
color: cornflowerBlue;
font-family: Tahoma;
font-size: 11px;
}
img.icoYO { /* es el icono de laimagen */
float: left;
padding-right: 10px
}

46 comentarios:

Paramatma  

Genial, intentare hacerlo cuando termine semestre en la u porque me voy a enloquecer, hasta luego maestro.

Responder
Unknown  

muy bueno JMIUR!!! despedazado jajaja, el ejemplo también, un buen día :D

Responder
Gem@  

Salio perfecta la prueba, voy a investigar si tiene otras posibilidades, está sabrosona esa entrada :)

Responder
JMiur  

No es demasiado complicado ¿verdad? Primero, me pareció poco útil pero, después me gustó. Podría quedar divertido y agregarse más cosas.

A ver qué se te ocurre, Gem@ Yo espio :D

Responder
Bonzu Pipinpadaloxicopolis III  

El cierre de b:if tiene una / de mas
Al comentar como nombre/url y colocar la url del autor se da el mismo resultado y algo de suplantación de identidad.

Responder
Bonzu Pipinpadaloxicopolis III  

También interfiere con el contador de comentarios, esos comentarios los salta y no los cuenta.

Responder
Gem@  

Pues a mi no me da error me sale igual que a J.Miur pero no probé con los comentarios numerados :O

Responder
JMiur  

Bonzu:
Todo está referido a una plantilla mínima o sea, a los códigos standard que posee Blogger; el agregado de otras cosas, debe ser contemplado una por una.

Con Nombre/URL, pasa lo mismo que pasa normalmente, si alguien usa tu nombre parece tuyo. Eso se evita de otros modos pero no están contemplado por defecto en en las plantillas. Cambiar el estilo de los comentarios personales o dejarlos como están no modifica en nada ese tema que, en todo caso, debe ser solucionado con otros métodos. Por ejemplo, en lugar de:

<b:if cond='data:comment.authorUrl == "http://www.blogger.com/profile/XXXXXXXXXXXXXXXXXXXX"'>

Se puede utilzar un doble IF:

<b:if cond='data:comment.authorClass == &quot;blogger-comment-icon&quot;'>
<b:if cond='data:comment.author == &quot;MINOMBRE&quot;'>
.................... AQUI VA EL CODIGO NUEVO
&lt/b:if>
&ltb:else/>
..........................

Como no es un script y sólo es CSS no afecta otros scripts pero claro, todas esas otras modificaciones o agregados personales deben tenerse en cuenta y también deben ser solucionados uno por uno. En el caso del contador, es sencillo. No lo contempla porque no es parte de un código normal así que hay que colocarlo también en el código nuevo exactamente igual que en el código viejo.

El nuevo, eso que "cambia" la forma de mostrar el comentario del autor no es otra cosa que el mismo codigo general al que se le cambian las clases para darles propiedades gráficas diferenciadas. Todo lo que esta en una parte debe estar en la otra.

Un ejemplo sencillo con los mismo códigos de este post, puede verse en este blog de pruebas, que contiene una copia de esta misma plantilla.

Responder
Unknown  

aquí tendría que tener el ícono que se despanza de risa jajaja...como tengo ya clases o cómo se llamen...NO SABES COMO QUEDÓ, encima cortaron la luz 2 veces...me dije a mi misma: si por esas cosas del destino comentan, creerán que un virus azotó a los comentarios jajaja...gracias al cielo regresó la electricidad :D
Con lo que estoy diciendo: por hoy paso, le hice montones, que sacas código y pones...eso tienen los comentarios!!! no se pueden mirar antes de guardar QUÉ TE PASA BLOGGER jajaja

Responder
JMiur  

Paciencia, Graciela :D Y si. El no poder verlo con Vista Previa es un problema. Una sugerencia, crea otro blog y copiá allí tu plantilla original, de esa manera, podés trabajar con esa copia sin problemas.

Responder
Bonzu Pipinpadaloxicopolis III  

Gracias JMiur el contador funciona, realizé otra prueba con el código que ofreces pero, aunque ya no hay problema con Nombre/URL, cuando una cuenta Blogger ajena comenta con mi nombre de usario lo interpreta como comentarios míos, ¿se podrán combinar los dos métodos? digo, para así no aver confuciones.

Responder
JMiur  

¿Dos usuarios con una cuenta con el mismo nombre? ¿Es eso posible?

Responder
Bonzu Pipinpadaloxicopolis III  

Dos usuarios de blogger diferentes con dos cuentas distintas y el mismo nombre. En otras palabra diferentes perfiles, url diferentes del perfil, mismo nombre.

Responder
JMiur  

Pués entonces, no entiendo cuál es el problema con respecto al código original ya que este usa el Profile del autor y esa URL es única:

<b:if cond='data:comment.authorUrl == &&quot;http://www.blogger.com/profile/XXXXXXXXXXXXXXXXXXXX&quot;'>

Responder
Bonzu Pipinpadaloxicopolis III  

Son dos casos:
Fulano comenta como Nombre/URL con la url del perfil y el mismo nombre del administrador.
En este caso el primer método de identificación falla.
Con el segundo código funciona y lo identifica.
Ejemplo 1Perengano comenta con cuenta Blogger y el mismo nombre del administrador del blog.
Aquí falla el segundo método pero funciona el primero.
Ejemplo 2

Responder
JMiur  

A ver. Teniendo la opción de colocar una URL, cualquiera puede colocar cualquier cosa. Diría que simplemente, se trata de un intento deliberado de estafa y lo razonable es que el administrador del blog lo detecte y simplemente lo elimine. Eventualmente, si se trata de algo repetido no tendrá otro remedio que no utilizar esa opción de comentario o moderarlos.

Creo que no se trata de algo "normal" pero, de todas maneras, podría evitarse combinando todos los IFs, verificando primero que el autor del post esté logueado en Blogger:
b:if cond='data:comment.authorClass == "blogger-comment-icon"

luego, verificando el nombre:
b:if cond='data:comment.author == "MINOMBRE"'

y por último, verificando el perfil:
b:if cond='data:comment.authorUrl == &"http://www.blogger.com/profile/XXXXX"'

La fundamental es la primera ya que esa indica si alguien está o no está logueado en Blogger:
data:comment.authorClass == "blogger-comment-icon"

Responder
Bonzu Pipinpadaloxicopolis III  

Pues si, estoy evitando que alguien se haga pasar por mi pero me intereza conservar ese comentario ademas de ayudar a identificarme mas fácil. Y es que me dió un susto al ver ese comentario con mi nombre y cuenta Blogger y ademas estaba personalizado como administrador.

Al usar los tres códigos a la vez se ocultan algunos comentarios y solo se muestran los míos y los del imitador, el resto son ocultados.
Creo que necesito mas ayuda para colocar los códigos JMiur.

Responder
JMiur  

Entiendo. El error que me dices que ocurre cuando aplicas todos los IFs combinados debe ser un problema de sintaxis. Fíjate en este post donde he colocado el ejemplo siguiendo tu idea.

El código es imposible mostrarlo en un comentario pero, si más o menos te convence, lo hago en un post.

Responder
Bonzu Pipinpadaloxicopolis III  

Imprecionante JMiur, supongo que así se logra un identificación sin falla, veo que no personalizaste el comentario del autor pero supongo que también se puede hacer. Espero con paciencia ese post y la acostumbrada explicación detallada que hace todo más fácil :-).

Responder
JMiur  

Estoy en eso, Bonzu. Si puedo, lo publico hoy y si no, mañana.

Voy a ver si hago a tiempo de agregarle lo de la personalización de los comentarios del administrador. Poder se puede. eso seguro :D

Responder
Bonzu Pipinpadaloxicopolis III  

heee!!!!! :P

Responder
Anónimo  

Hablando de personalizar comentarios, vengo con una pregunta sobre eso... sobre el formulario que tienen los comentarios, la caja en donde se escribe el texto. ¿Se pueden poner opciones para editar el texto (negrita, itálica y crear enlace? Busqué en Google y no encontré nada :(

Lo que pregunto es de algo así como lo que tiene el blog Zona Firefox en los comentarios.

Responder
JMiur  

No. eso no es posible. ZonaFirefox es un blog que utiliza WordPress y no Blogger.

Responder
Anónimo  

Gracias por responderme.

Y tengo otra pregunta en este momento: ¿Qué códigos controlan el texto del mensaje y el estilo de los comentarios cerrados?

En tu blog había visto una entrada con los comentarios cerrados y parecía estar modificada en esa parte.

Responder
JMiur  

Un comentario se cierra editando el post y marcando eso en las opciones que hay debajo del editor. No hace falta tocar la plantilla para que funcione.

Responder
Anónimo  

Ok, pero lo que yo preguntaba era si esa parte se puede modificar. Lo que pregunto es qué codigos controlan ese aviso de que los comentarios están cerrados.

Responder
JMiur  

Por lo general sólo hay una condición:

<b:if cond='data:post.allowComments'>

Si se tiene el formulario incrustado y los comentarios están deshabilitados ese texto creo que es este:

<data:post.noNewCommentsText/>

Responder
Unknown  

Jmiur he realizado esto, lo que significa que ha quedado como :X
El nombre de las personas que comentan está en duplicado!
Mi comentario no varía, solo que encantadoramente el borde queda genial!

Podrías ayudarme?

Responder
JMiur  

Habría que ver la plantilla, Graciela, es algo que online no puede saberse porque no se ve. Deberías decirme exactamente qué querés cambiar o cómo querés que se vean los comentarios del autor y ahí revisar los códigos que son bastante engorrosos así que es fácil meter la pata :D

Responder
Unknown  

Te dejo abierto el camino, lo haces cuando puedas.
Quiero que mis comentarios queden de diferente color, manera, de los demás.
Verás que mi nombre no sale, sí doblemente de los demás, magia pura magia :P

Responder
JMiur  

OK. Me fijo :D

Responder
PablosckY  

otra cosa aplicada y funcionando al 100% :D

Responder
Unknown  

¿Me puedes dar el diseño del comentario de autor de http://vpcomautor.blogspot.com/2009/05/una-entrada-cualquiera.html please?

Responder
JMiur  

Es el que está explicado en esta misma entrada.

Responder
Liliana  

Hola espero que te encuentres bien, gracias por tus aportes, siempre me doy la vuelta por tus post, son siempre interersantes. Corazón yo quisiera saber algo sencillo dónde puedo agregar borde a la zona de los comentarios, por ejemplo: Sí alguien comenta quiero que aparezca un borde arriba y uno abajo, basícamente como lo tienes tú. Quiero que mi avatar quede dentro de esas líneas. Gracias por ayuda.

Responder
JMiur  

Depende de la plantilla que estés utilizando, debería ver el blog para responderte.

Responder
Liliana  

Mi blog está casi terminado, estoy agregándole algunos detallitos, mis amigas está muy curiosas por eso no lo tengo el perfil habilitado para que no entren a mi blog aún. Gracias por contestarme de todas maneras. JMiur es simple lo que quiero es algo sencillo como lo tienes tú. Veo que dónde te comenté el avatar está dentro del margen de arriba y luego está el comentario y viene el margen de abajo, lo que no quiero es encerrrarlo formando un rectángulo, el tuyo es perfectamente lo que quiero. Me explico ahora? Gracias corazón por tu ayuda.

Responder
JMiur  

Si, Lilianam, lo que ocurre es que, para decirte eso, debería ver el blog porque las propeidades y etiquetas que controlan eso, pueden diferir de uno en otro.

Responder
Liliana  

@JMiur
Estás en lo correcta, gracias por contestarme. Voy a dejar ese detalle para cuando ya tenga listo el blog, gracias por tu tiempo. Seguiré visitándote, siempre aprendo mucho de tus post, nuevamente gracias por tu tiempo y apoyo. Cuídate.

Responder
JMiur  

Sí. Es un detalle que se puede agregar luego, no vas a tener problemas.

Responder
GoodOldLeon  

Jmiur, Lo intenté mil veces y chequeé los pasos una y otra vez pero no logro que funcione. Te dejo la dirección de la plantilla donde estoy diseñando para que te puedas fijar que es lo que estoy obviando :S desde ya muchas gracias

http://armando-plantillas.blogspot.com/

Responder
JMiur  

No veo comentarios en esa entrada de pruebas ¿Hay alguno y no se muestran?

Responder
GoodOldLeon  

Si, hice uno para ver si funcionaba, en la entrada dice que hay uno, cuando entras a comentar te sigue diciendo que hay uno pero no se ve :S

Responder
JMiur  

Como no se ve absolutamente nada del código, es evidente que está errado pero no puedo decirte dónde porque eso sólo se ve en la plantilla.

Por las dudas, revisa que esté colocado en la parte de los comentarios de los posts y no en los backlinks ya que hay dos includables muy similares y es fácil confundirse.

Responder
GoodOldLeon  

luego de una minuciosa y extensa examinación noté que para como mi plantilla estaba editada, el problema era la definición de uno de los condicionales, ya lo solucioné y anda perfecto :D es increíble lo que te pueden llegar a complicar unos pocos caracteres :/

Responder
JMiur  

Nos pasa a todos. Es parte de esta trágica diversión :D

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR