JMiur [E]

El tema de los avatares en los comentarios me ha provocado un problema indeseado. Si bien no es algo usual, como podría repetirse, quisiera mostrar la forma en que lo he solucionado.

Se trata de los emoticones en los comentarios y se me ocurre que esta modificación también podría ayudar en otros casos donde el truco no funciona porque interfiere con el formulario u otros elementos agregados.

El script, lo que hace es leer un sector específico del blog y buscar una serie de textos. Si los encuentra, los cambia por cierta imagen. Por ejemplo, si encuentra :D cambia esos dos caracateres por una imagen como esta risa. El problema surge cuando esos caracteres son parte de un código, al cambiarlos se produce alguna clase de resultado indeseado.

Si bien es cierto que esas combinaciones de caracteres no son usuales, el nuevo código de los avatares podría llegar a contenerlos, es raro pero es posible. De los cientos que he chequeado sólo ocurrió con uno pero, aún así, ese es suficiente para trastocar una página.

El script es sencillo pero requiere de un dato, el ID del bloque a verificar y cambiar. En un principio el sector a cambiar era el identificado como comments, luego, cuando se agregaron los formularios incrustados hubo que limitar ese bloque así que se usaba comments-block, ahora, hay que limitarlo aún más y verificar sólo el contenido del comentario pero, esa etiqueta no tiene un ID:
<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>
Así que, lo primero que haremos será agregarle uno, usando el número que le asigna Blogger para identificarlos e inmediatamente después llamaremos a la función de JavaScript para que lo verifique y lo cambie:
<p expr:id='&quot;combody-&quot; + data:comment.anchorName'><data:comment.body/></p>
<script type='text/javascript'>
cual = &quot;combody-&quot; + &quot;<data:comment.anchorName/>&quot;;
emoticonComentario(cual);
</script>
Por último, deberíamos eliminar el script anterior y agregar el nuevo antes de </head> condicionándolo para que sólo se cargue en las páginas individuales:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
function emoticonComentario(cual) {
if(!document.getElementById) {return;}
bodyText = document.getElementById(cual);
cualTexto = bodyText.innerHTML;
// ....... AQUI NADA CAMBIA
bodyText.innerHTML = cualTexto;
}
//]]>
</script>
</b:if>
El nuevo script que reemplaza el mostrado en una entrada anterior está contenido en este archivo de texto

41 comentarios:

Gem@  

Bueno es saberlo, sólo me falta que los emoticones salgan corriendo por todo el blog :D

Responder
Claudio - Poca Tinta  

¡Pensé que solo me pasaba a mi!

Probaré las recomendaciones

Responder
JMiur  

No es usual, Gem@, te diría que es raro y sólo lo vi en un caso pero, hay que estar atentos y el cambio es sencillo de hacer.

¿Te pasó, Claudio? Yo también creí ser el único; es rarisimo porque tampoco encontré la combinación de caracteres sin embargo, haciéndolo de este modo, se solucionó. misterios :D

Responder
Gem@  

¡¡Lo sabía!! ¡¡Lo sabía que tenía que ocurrirme! jajajaja si fuera un viaje o algo bueno no me tocaría.

Responder
JMiur  

Es para que claudio y yo no nos sintamos tan solos, Gem@ :D Me alegra que se haya solucionado.

Responder
Jorge  

:D

Responder
Bonzu Pipinpadaloxicopolis III  

Ese error ya lo había detectado desde antes de los avatares, fue una vez cuando reemplazé los íconos de Blogger como el de OpenID por una imagen de Blogger/Picasa que, para variar, tenía que tener una combinación de tipo emoticon en la larguísima url :(. Y en las imágenes de perfil pasa que la url de la imagen tenga X D juntas. En fin, regresé a los íconos de Blogger y olvidé el asunto… …hasta ahora que el problema regresó, dediqué un rato a dar un vistazo a entradas con varios comentarios y lo detecté.
¡Imagínate que sea tu imagen de perfil la que ocacione el problema!, se detectaría más rápido y sería más molesto, por suerte este no fue mi caso y el problema sólo lo vi en algunos comentarios de un post.

Responder
Ragnarok  

JMiur eres un genio :) pase buen rato preguntandome porque mi blog se habia deformado cuando agrege los dichosos emoticonos :S ... ahora ya los tengo :)

Responder
JMiur  

Somos varios a los que nos ha pasado lo mismo, Ragnarok. Me alegro que se arreglara :)

Responder
Libreria Nazareth  

Muchas gracias por la info voy a seguir los pasos que detallas aca amigo.

Saludos cordiales. :D

Responder
k_nelita  

Hola JM tengo un problema parecido, instalé recién el ir arriba con la librería scriptaculos, la de Google, y yo tenía el fondo de los comentarios con jquery, no se si se escribe así, y ahora no tengo mas fondo en los comentarios.
Supongo que es una incompatibilidad de scripts que he leído en algún lado, sabés como puedo arreglarlo? O si puedo? Cambiar de sitio alguno de los dos scripts o algo así?
Me queda muy feo sin fondo los comentarios :(

Responder
JMiur  

Sí, k_nelita. En principio, ambas librerías son incompatibles entre si y usarlas junatas crea problemas.

Responder
k_nelita  

Entonces no hay forma de arreglarlo?
Cambiando de lugar alguno de los scripts de las galerías o algo así?
Tengo que eliminar la de jquery si o si?

Responder
JMiur  

En general, sólo queda elegir uno de esos llamados frameworks (prototype, jquery, etc) y, de allí en adelante, usar ese ya que hay alternativas para todos; usar dos de ellos no es recomendable ya que son pesados y generan problemas, sobre todo en Blogger.

Responder
Graciela  

JMIUR estoy hinchándote:
he seguido paso a paso lo de los avatares en los comentarios, pude incorporar la imágen para los anónimos o de wordpress...ahora:
* el avatar de blogger me queda muy pegado con el nombre de la persona que comenta

* quisiera centrar todo ;) si es posible, me refiero a que la cajita de comentar donde estoy escribiendo no queda a pesar de seguir lo que me dijiste; tampoco los comentarios...

Esto creo que es peór que trabajar en la NASA :D al menos los ingenieros saben qué caracoles desean...o Blogger me la complica o estoy medio boba :O

Todo este trabajo te puede llevar el tiempo que desees, será abonado con alfajores cordobeses 'originales' o si prefieres mis tortas elige: chocolate, vainilla, luego el baño que deseessssss

Responder
JMiur  

Veamos si entendí.

Para ubicar bien los avatares, yo haría esto. En:
.comment-author {
font-weight:bold;
margin:0.5em 0 0;
padding:0 0 0 20px;
}
cambiaría el padding:
padding:0 0 0 5px;

y se lo agregaría acá:
#comments-block .avatar-image-container {
float:left;
height:46px;
padding-right:15px;
position:static;
width:46px;
}
de esa manera se moverían hacia la izquierda y se separarían de los textos.

Pare centrar el formulario, primero, le quitaría el width="100%" del IFRAME:
<iframe id="comment-editor" class="blogger-iframe-colorize" width="100%" ........

y lo pondrçia acá:
#comment-editor {
overflow:hidden;
width:500px;
}
el valor de 500 es para que veas la diferencia, con eso, controlas el ancho del formulario en si mismo. Y lo centras con text-align:center; en este otro lugar:
#comment-form {
clear:both;
margin:0 auto;
text-align:center;
}

Eso de centrar la parte de los comentarios en si mismo no lo entendí bien :$

Responder
Graciela  

es que tanta pregunta junta me hace saltar a mi los tapones de la luz!!! jajaja -los recuerdas?- imaginemos entonces lo que puede producirle a alguien a quién se le pregunta tanta cosa ;)

Bien tesoro hago todo lo que me dices...luego o sea mañana, pasado o cualquier día si algo no lo veo como deseo, repregunto.

Tanti graci amigo y muchas gracias :D

Responder
JMiur  

Suerte Graciela :D

Responder
Graciela  

¿a que no sabes como quedó???!!! maravilloso, espectacular, harrrmosoooo
Guau que suerte contar con gentes como vos, estuve dos semanas pero no podía encontrarle la vuelta

quedó 'pipí cucú' jajaja

Amigo con "A"

Feliz día...hoy es feriado, disfruta con los tuyos y chauuuuuuuuuuuuuuuu

Responder
JMiur  

Perfecto, Graciela :D

Responder
Maite  

Bueno, soy una desobediente y no pude resistirme :D
Estoy poniendo emoticones, fui directa a dar los dos pasos concretos de la ultima entrada de Gema al respecto, parecía tan sencillo... pero en IE salía genial y sin embargo en Fire no se carga la caja de publicar comentario a no ser que se de al botón de actualizar la página.
Luego he seguido estos pasos, y qué ilusión cuando vi en fire que todo salía bien, y aggggg qué rabia cuando en IE salían aspas en vez de emoticones.
No se qué hacer ni como arreglar ninguno de los dos JMiur... está en el blog de pruebas esta ultima. Tienes alguna sugerencia? cuál de los dos sería más facil de arreglar? tengo las dos plantillas guardadas por si acaso :$

Responder
Maite  

No estoy segura, creo que te dejé aquí un comentario haciéndote una consulta, pero ya he solucionado el tema y sale todo perfecto.
Espero que estés con los pies secos !!!!! Os deseo un caluroso y secano día.

Responder
egoloco  

Hola JMiur! Mirá, fuí hasta lo de Gem@ y le dejé esta consulta en su entrada que habla sobre lo que posteas acá. Esta es la consulta:

"Lo hice, al pie de la letra y siguiendo también las indicaciones de JMiur, por las dudas, pero el cambio salió mal. JMiur explicaba que podían existir errores con los avatares, hice la prueba con un comentario anonimo, incluyendo en el nombre esto para ver si salía en el nombre el emoticon, y si, salía, incluyendo un texto con "width y height" sobre la imagen del anónimo. Hice los cambios de esta entrada, pero ahora las "caritas" no quieren salir."

Ella me dijo que te consulte a vos, porqué no me salen los emoticones en los comentarios?

Responder
Gem@  

Hola JMiur, no sé si tendrá algo que ver que egoloco tiene la tabla dentro del div del formulario oculto, por eso indiqué que serías la persona indicada para orientarle ya que no he probado con ese sistema de formulario oculto.

Responder
JMiur  

egoloco:

El problema es que el archivo con el script es erróneo, un archivo con scripts sólo debe contener código JavaScript y no puede tener otro tipo de codigo HTML como ese donde, se ve que dice:

<!-- EMOTICONES - transformar texto en imagen solo en paginas individuales -->
<b:if cond='data:blog.pageType == "item"'>
<script type='text/javascript'>
//<![CDATA[

y

//]]>
</script>
</b:if>

Los códigos condicionales sólo van en la plantilla que debería decir esto:

<!-- EMOTICONES - transformar texto en imagen solo en paginas individuales -->
<b:if cond='data:blog.pageType == "item"'>
<script src='http://sites.google.com/site/egoblogo/scripts/Emoticones.js' type='text/javascript' />
</b:if>

y el archivo, sólo debe contener la función:

function emoticonComentario(cual) {
..............
}

Responder
Gem@  

Pensaba que al final el error sería mío y estuve repasando la entrada, pero estaba bien, el archivo de descargar está tal y como me dijiste.

Responder
JMiur  

Gem@:

Sí, el archivo es correcto y tu post dice la forma de usarlo: "los emoticones, o mejor dicho el script los añadiremos directamente a la plantilla, nos evitamos con ello buscar alojamiento externo para el script".

El problema ha surguido al suponer que era lo mismo agregarlo en la plantilla que alojarlo en un servidor externo. Para esto último, es necesario quitarle el código HTML y la forma de incluirlo sería otra, quitándole algunas cosas para que sólo quedara la función y eso que se quita debería ponerse en la en la plantilla.

Sólo es un error de interpretación, nada grave, se soluciona fácil :D

Responder
egoloco  

Es verdad! que ciego fuí. No me había percatado de eso. Ahora lo corrijo. Mil gracias!

Responder
JMiur  

Con eso, debería funcionar normalmente ... o no pero, ya sería otra historia :D

Responder
egoloco  

Problema resuelto, mil gracias a los dos :D

Responder
Jose Manuel  

Hola amigo he colocado emoticones a Mi Blog, pero tengo el siguiente problema: Los emoticones producen un salto cuando se insertan en un comentario o post, no se colocan en linea con el texto. Si yo hiciese esto en mi blog: :) :D :( :(( ;) :-| Los emoticones en vez de mostrarse horizontales, se ven verticales porque hay un salto de línea. Espero que me ayudes. Exelente blog. esperaré tu respuesta.

Responder
JMiur  

Jose Manuel :
Eso es porqu todas las imagenes de tu blog están definodas como bloques es decir, crean un salto de línea automático como los párrafos.
No creo que eso sea una buena idea y que lo mejor sería que n olo fueran aunque, es probable que al cambair eso, se vean afectadas otras.

Entonces, hay dos alternativas. La primer, de fondo es quitar display:block; de acá:

img {
..................
display:block;
}

luego, en todo caso, corregir alguna cosa que haya quedado mal. Es la solución de fondo ya que evitará problemas futuros.

La segunda posibilidad es sólo corregir el problema en los comentarios, en ese caso, habria que agregar algo como esto en el CSS:

.comment-body img { display:inline; }

Responder
Jose Manuel  

Muchas gracias amigo. quite el código display:block; y los emoticones van bien. Saludos!

Responder
Diego Arenas  

Hola tenia algo de tiempo que no actualizaba mi blog y por lo que veo dejaron de funcionar los emoticones :S me pdrias hechar la mano? y perdona por la jodedera ;)

http://arenasgamerr.blogspot.com/

Responder
JMiur  

Diego:
Tienes dos funciones llamadas emoticonComentario() y eso es un error. Estás tratando de actualizar la función como indica esta entrada pero,ahñi, l oque debes ahcer es reemplazar:

// ....... AQUI NADA CAMBIA

por lo que dice el "viejo" script, o sea la segunda función que luego, debes eliminar.

Lo que "no cambia" son las definiciones de los emoticone
cualTexto = cualTexto.replace ........

Responder
Diego Arenas  

decidi quitar el script mucho engorre de todas maneras muchas gracias jmiur tuanis desde costa rica ;)

Responder
gavetita  

hola!
hemos aplicado tus indicaciones para los emoticones en este blog:
crochetingclub y no salen los emoticonos que hemos cambiado por los nuestros

en este otro, donde he descargado la plantilla del anterior SÍ salen, blog de pruebas

un misterio, nos puedes ayudar?

Un saludo, garcias

Responder
JMiur  

No noto problema alguno. Se ven perfectamente. Esta es una captura del sitio.

Responder
Daniel Escobar  

No entendí nada, ahora si que me quedaron grandes las modificaciones. Podrias echarme la mano JMiur? Mi blog es www.tecno-co.blogspot.com
Tengo ya un script de emoticons que ya no funciona.
Saludos espero respuesta y gracias por tu blog, vaya que es la principal referencia en Internet para blogger.

JMiur  

No veo que el script de emoticones esté colocado; por lo menos, no lo veo en el código fuente aunque si se ve que se trata de ejecutar pero, falta el script.

También veo que usas otros dos scripts que son inaccesibles; puede ser que sean archivos privados:
http://btemplatesscripts.googlecode.com/files/cufon-yui.js
http://btemplatesscripts.googlecode.com/files/Allerr.js'

Con respecto a los avatares, dime que quieres hacer o cómo quieres que se muestren.

Daniel Escobar  

Ya busque y tienes razón, no esta el script, el script era algo parecido a esto:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
function emoticonComentario(emoticon) {
if(!document.getElementById) {return;}
bodyText = document.getElementById(emoticon);
cambiarLetra = bodyText.innerHTML;

// :)
cambiarLetra = cambiarLetra.replace(/:)/g,'<img src="https://lh5.googleusercontent.com/-20cNHpka-fA/TikBlTXm_KI/AAAAAAAABkE/1orU58ycSu8/fb_sonrisa.gif" />');

Pero en la pagina de donde lo saque dice que ya no funciona y hace referencia a un articulo tuyo para arreglarlo. Lo que haré es quitar todo y dejarlo como estaba para poner el que tu sugieres.
Podrías decirme como agregar emoticons...
En cuanto a los avatares, no tengo ningún cambio que hacer por ahora... gracias

Responder

¿Quiere dejar un comentario?

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

Todos los archivos y demos alojados en Fileden han sido redireccionados y deberían estar funcionando correctamente.
De todos modos, también puede accederse a ellos a través de SkyDrive

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