85

Emoticonos en tu blog

EmoticonosEs una bonita forma de expresar sentimientos cuando nos parece que las palabras no son suficientes o, simplemente nos apetece adornar un poquito nuestros post consiguiendo que tanta letra junta no se vea tan aburrida.

[1] Nos descargamos el script a nuestro PC, lo descomprimimos y lo subimos a un alojamiento de archivos adecuado.

A continuación tenéis que añadir dentro del <head> de vuestra plantilla justo encima de </head> esta línea e incluir la url del script:

<script src='URL_DEL_SCRIPT' type='text/javascript'></script>

Y, justo casi al final de todo el código de la plantilla, antes de </body>, colocáis este otro:
<script language='javascript'>
addSmiley();
</script>

En la parte del CSS de la plantilla, para evitar que los emoticonos se desplacen o se vean con borde, añadís esto:
.post-body img#new {
margin:0px;
padding:0px;
border:none;
}

Las caritas se verán en tus entradas y en los comentarios cuando están expandidos. Una vez el blog acabe de cargar aparecerán los emoticonos, esto impide que obstaculice el tiempo de carga de la página.

Entradas Relacionadas:

85 comentarios:


Rosa

Una pregunta de ignorante¿ cual es la parte CSS de mi plantilla? y otra puse el sigue leyendo pero aun que no ponga esta parte span class="fullpost" span siempre queda escrito en el post leer mas, como hago para que eso no pase

Anónimo

El CSS es la parte que va desde las variables hasta skin, es donde hay tantas { de estas.

Si, Rosa, lo siento, estos de Hackospere algo han hecho con el script que sale siempre lo de leer más, mejor quitalo mientras lo arreglan.

Gem@

Es un gran descubimiento Rosa, con tu permiso lo añadiré en mi blog, este código es mucho más sencillo de aplicar que los anteriores para añadir smiles.
(Al fin pude comentar aquí, llevo dos días intentándolo,Blogger está muy mal grrr)

Anónimo

Si es cierto Gem@, esta fatal, llevo dos días intentando añadir un elemento nuevo en la sidebar y ni modo...

Permiso concedido, es más, no tienes ni que pedirlo, es un truco para compartir, de eso se trata ;-)

Unknown

Rosa, cada día me sorprendo más de lo útil que es tu blog y claro por su posteadora!

ÅNG€L

Hola Rosa , te quiero dar las gracias por el gran blog de ayuda que aqui tu tienes .
Y tengo una pregunta para ti. Porque mis icons o cualquier grafico que agrego a mi pagina siempre salen con recuadro. (como un marco alrededor?)

Anónimo

Hola thoth, gracias por pasar!

Mira, es fácil...busca esto en tu plantilla, esta por arriba donde ves tantas llaves de estas {

.post img {
padding:4px;
border:1px solid #222;
}

En border, cambia el 1 por cero, y listo!!

¡Suerte!!

Paula

Hola!! yo de nuevo, me dijiste que tratara con este script porque tuve problemas con el otro de una linea, bueno... tuve el mismo problema con este :(
Mis entradas aparecen todas expandidas cuando pongo este script... Ojala tengas alguna idea de como puedo arreglarlo, ahh y muchas gracias por tu dispocición y ayuda :) ;)

Anónimo

Paulara, lo único que se me ocurre es recomendarte el sistema que yo uso, que en realidad,son dos, uno para los posts y otro para los comentarios, son de Vagabundia:

http://vagabundia.blogspot.com/2007/08/emoticones-en-los-posts.html

http://vagabundia.blogspot.com/2007/08/blogger-y-los-emoticones.html

Paco

Hola Rosa,

Desde hace unos meses que descubrí tu blog he hecho muchas cosas de las que nos enseñas y una de ellas era poner emoticonos en los comentarios y entradas mias, pero tengo un problema.

Lo he intentado en dos de los tres blog que tengo y solo me ha funcionado en uno de ellos.

¿Puede ser que no funcione en todas las plantillas?

Es que tengo un blog chorra en el que también hago pruebas y me ha funcionado y luego uno que escribo amenudo, familiar, etc... y que además es privado no me ha funcionado, pero no crea que sea por lo de privado porque lo hice público durante un tiempo para descartar esto, yo casi que diría que es por la plantilla ¿es posible?

Muchas gracias, y como ya sabes y te han dicho muchos, tienes un blog de 10.

Anónimo

Paco, algo de razón llevas...hay varios "trucos" para poner los emos y no a todos les funciona uno u otro, a veces incluso ninguno, pero no depende tanto de la plantilla, sino de algún otro script o función que se le ha añadido antes y que no "se lleva bien" con el de los emos.

Anónimo

Hola Rosa estaba mirando lo de los smiles que dices pero solo me salen en el "pie" de mi blog y tampoco funcionan a sí, me puedes hechar una mano?
Gracias.

Anónimo

Rosa... !!!Socorro!!! no se poner los Smiles que dices en uno de tus posts http://vagabundia.blogspot.com/2007/08/blogger-y-los-emoticones.html

Nisskapizca

ups... pues algo pasó...

no me funciona...

nada de smiles.... ni una gota,...

uf!

Anónimo

Pizca, no te preocupes, seguro que no has hecho nada mal...si lees el resto de comentarios verás que a menudo no funciona en todas las plantillas...
Estoy probando con el método que yo uso (solo es para los comentarios) a ver si soy capaz de adaptarlo para que funcione en todo el blog...aunque me llevará tiempo, cosa que no me sobra precisamente XD.

Paula

Hola Rosa!!
Ahora que cambie de plantilla probé estos smilies y me han resultado muy bien, tanto en los post como en los comentarios :D

Quería preguntarte cómo puedo agregar más smilies al mismo mismo, bajé el archivo .js pensando en modificarlo y subirlo a un servidor yo misma, vi que están la url del emoticon y todo, pero no se bien como ni donde agregar el texto en especial que quiero que reemplace por el emoticon.

Ojala se halla entendido mi duda.
Saludos!

Anónimo

Paula, en el archivo .js ves que cada línea donde está la url de cada emo, corresponde a un emoticon.
Por ejemplo esta:
d[i].innerHTML = d[i].innerHTML.replace(/\s:-?P/ig, '<img src="http://aditya.vm.googlepages.com/ksk-tongue.png" id="new" /> ');

Esa es la de la carita con la lengua fuera, que se sustituye por :-P para que se sustituya por la imagen del emo.
Suponte que en el script no estuviese la carita de sonrisa, o sea, :-D

Pues para incluirla lo más sencillo sería copiar la última línea (la de otra carita) pegarla de nuevo debajo de esa última y ahí modificarla. Cambiaríamos la url por la de nuestra carita sonriente y en la línea (sin tocar nada más) las letras que sustituyen, así:

d[i].innerHTML = d[i].innerHTML.replace(/\s:-?D/ig, '<img src="URL_DE_CARITA_NUEVA" id="new" /> ');

He puesto en negrita el :-D para que veas donde iría...creo que me heliado un poco al explicarlo, pero si te fijas bien en esa parte del script enseguida lo verás. :D

Paula

Muchas muchas gracias!!! si me resultó :)
Saludos y muuuuchas gracias!

GiaCherry

Wow :D gracias a ti mi blog esta quedando muy lindo ya te enlaze para que todos sepan de donde saco tan buenos consejos ;)

Anónimo

GiaCherry, gracias :D

Sole

Uh! que bueno! al fin me funciona después de tantos intentos...
Cómo hago para que aparezca en los comments tambien?
Gracias por la ayuda!!

Anónimo

Sole! se supone que si has aplicado el truco tendrían que verse también en los comentarios...¿no es así? :-X

Sole

Copié todo como indicaste. Me aparece en los post pero no en los comments.
No te preocupes igual, no es nada terrible! :)
Gracias por tu blog, fue de mucha ayuda!

Anónimo

Hola Rosa, he puesto el código en otro de mis blogs y me sale muy bien, pero el problema es que no se queda alineado, hace un salto de linea y no sé como corregirlo :(

Anónimo

Alexia Stark, necesitaría ver a que te refieres...he mirado en tu otro blog y no lo veo...

Anónimo

Es que en el que estoy trabajando aún no lo tengo "abierto", pero te explico:
Cuando pongo un emoticono de estos por ej: :P en vez de salirme junto al texto me sale así:
:P

Es decir abajo, como si hubiera puesto "enter".
Supongo que habria que añadirle algún códiguito de estos para que este aliniado (>.<)

Si sigues sin ententerde (por que a veces me explico fatal) me lo dices y te abro el blog para que lo veas.

Anónimo

Ya he abierto el blog, el comentado en varias de las entradas que ha puesto el chico, allí verás lo que te decía ;)

Anónimo

Alexia Stark, me parece muy bien que hayáis colocado el aviso de "contenido para adultos" ;-)

Prueba colocando este código como el de entradas pero para los comentarios:

.comments img#new {
margin:0px;
padding:0px;
border:none;
}

Anónimo

Hola Rosa, lo he probado pero o no lo he puesto donde toca o sigue faltando algo, porque yo lo veo igual, estos emoticonos siempre me han tenido mania, en el de L'Univers lo deje por imposible y este al ser nuevo pensé que me saldria, pero por lo visto es cosa de la plantilla (la no se que moto xD).

Anónimo

Alexia, prueba así:

.comment-body img#new {
margin:0px;
padding:0px;
border:none;
}

Anónimo

Nada, sigue saliendo abajo :(

Anónimo

Gracias Rosa, utilizo el mismo script, que he alojado aparte para mi, de momento no lo tocare, ya me esta bien con lo básico. Si un día tengo paciencia para ponerme manos a la obra añadiré emos. ;-)

Anónimo

Me encanto este dato!
Le da más personalidad al comentario :P
Gracias Rosa

Anónimo

Ups sorry!
____________

Hola Rosa, sabes que cuando dejo un comentario no me aparecen los emoticones a mi!! Pero si a las demas?

¿Qué puede estar pasando?

Desde ya muchas graacias

Anónimo

Sidhe, no tengo ni idea...:-X
No hay nada en el script que distinga quien comenta para colocar los emos, no debería suceder eso...

MINDistortion

grrrrrrrrrr en one me salio de pasada y me salio en una gracias rosa tiempo q no entro a tu blog x ahi deje algo pendiente una pregunta q te hize

y me doy la gran sorpresa que cambiaste el skin a tu blog grrrr y yo q pense q la anterior estaba buena y que ya no podia ser mejor me dejaste sorprendido bien ahi rosa por cierto ya puse tu banner en mi blog saludos xD

ahi te vuelvo a comentar para lo de la barra d arriba :D

Luis Mejuto Viña (Chitauri)

:-D Gracias, por la info.

:roll:

:shock.

:twisted:

Liz Hopps

Rosa no me aparecen caritas en los comentarios!!! y los de vagabundia son un poco complicado porque tengo muy alterada la platilla...

Anónimo

Elizabetha Souvre , igual has movido de sitio el script o has puesto otro delante...fijate donde estaba antes o si has puesto otro antes de el pásalo a después, me han comentado que pasa eso...

Unknown

Si funciona :D con los comentarios que ya estan hechos. Pero no con los recientes =S

Unknown

Revisa este post en especial.

Jas Trujillo

Anónimo

Surplus21 , normalmente no funcionan si no hay texto delante del emoticon...no se porque pero es así.

Unknown

Gracias Rosita creo que es por demas =S no funcionan. Tratare de revisar implementandolo en un blog de pruebas y a mirar codigos y comparar O.o no queda de otra = ) gracias por tu ayuda =O

Lisett

No me sale nada Rosita, no me salen los emoticones.. pero gracias por el dato!:P

Ahora te puedo hacer una consulta: mira una vez que ya adecue todo mi blog, mi esposo se dio cuenta que esta en javascrpit y no en HTML, y se dificulta todo no? bueno.. la pregunta es:

Como puedo hacer para que aparezca la imagen de la persona que me comenta? en el comentario que me hacen siempre aparece solamente un cuadrado "vacio" :( y no se como podria hacer para que aparezca la imagen de mi comentarista..

Gracias Rosita por adelantado!

Lisett

Anónimo

Lisset, el espacio está vacío porque esa plantilla es una adaptación de Wordpress y no han incluido en ella ningún sistema para mostrar las imágenes de los comentaristas.
Yo solo conozco un método que no he explicado aún aquí, y la verdad, no me decido a hacerlo porque en según que plantillas no funciona bien.
Si quieres probar, Gem@ lo explica en esta entrada:
http://gemablog-.blogspot.com/2007/10/imagen-del-perfil-en-los-comentarios.html

Lisett

ya me di por vencida rosita, esa plantilla es tremendo enredo pero me gusta y normal ya que puedo hacer.

Con respecto a los emoticones, hice todos los pasos pero sabes lo curioso? no me aparece en las entradas, cuando escribi una parte a la que llame "ki del dia" y pongo :D alli si aparecen :S por eso no entiendo :O, hice algo mal?

Gracias otra vez y disculpa la molestia!

Anónimo

Lisett, en algunas plantillas no funciona si hay algún otro script que use comandos parecidos.
En tu caso, si salen en la sidebar, creo que saldrán también en los comentarios...he visto que has hecho uno en el último post y no ha salido, pero porque no has puesto el guión entre los dos puntos y la P

Deybi

Hola Rosa.

Con esto es que aparecen en el formulario de comentarios las caritas?.

Anónimo

gracias :-)

McsC

Hola Rosa :)
Ya hace 5 días que vengo arreglando mi blogger guiándome por tu blogg, de verdad muchas gracias por tu ayuda :)
Ha sido muy útil todos tus tutoriales :)
Un beso
Mi blogg cre que estará liso para el 2009
ahí comenzaré a publicar entradas :)
www.bayaverde-rosablanca.blogspot.com
Saludos y gracias por todo :)

Anónimo

Baya Verde, dile a tu blog que cuando esté listo me avise ;) estaré encantada de hacerle una visita:D

La Dueña

Rosa tu blog está espectacular, gracias a vos aprendí muchos trucos que ya los estoy aplicando en mi blog!

Gracias

Anónimo

La Dueña, gracias a ti, a tod@s vosotros...

Cocina

HOLA ROSA QUE DESILUCION,SEGUI TODOS LOS PASOS INDICADOS Y NO APARECIERON NUNCA PORQUE NO TENGO SUERTE YA NO SE QUE HACER!!!!!YO QUERIA QUE APAREZCAN EN LOS COMENTARIOS Y NADAAAAAA....

Cocina

ROSA POR FAVOR CONTESTAME PRONTO QUIERO TENER LOS EMOTICONES EN MI BLOG YAAAAAAAAAAAAAA!!!!
te hago otra consulta sobre esto es verdad que puede ocacionar problemas en el blog? asi como ponerse lento y demás.... gracias -

Anónimo

CLAU, cuando surge algún problema al añadir cualquier truco, a menudo ayuda leer los comentarios de la entrada...te lo digo porque si lees los comentarios anteriores podrás leer que en algunas plantillas no funcionan estos emos...

-eme-

Que es la parte CSS? No es muy claro esto para un principiante ...

Anónimo

Sol La parte del CSS de la plantilla es la que está desde la etiqueta ]]></b:skin> para arriba.

Adrian

como molas rosa tienes unos trucos que te cagas ;)

Nathan yo

sorry por molestarte pero sigue sin funcionar segui todo e incluso lo subi a donde tu recomendastes

Anónimo

Global Vuelve a intentarlo ahora, porque he modificado el script esta noche...a ver si ahora te anda.

Ravel

No me funciona :(( y eso q lo llevo buscabndo mas de un año :(( si me puedes ayudar , por favor avisame en ravelperez11@gmail.com
mi pagina es www.ravelallfull.blogspot.com

Anónimo

RAVEL No es solo "no me funciona" y ya...si lo veo instalado en un blog podría decirte en que estás fallando o lo que sea...

Yo no aviso ni contacto a nadie, lo siento, eres tu el que ha de estar "al tanto" de mis respuestas...¿es lo lógico no?

ana

Rosa una cosita, Pude poner todo y todo me va bien, no hace conflicto con ningun script(gracias a Dios), Todo genial. Pero me gustaria que se mostrarán los iconos que se pueden poner, como tu los tienes.
Donde se escribe el comentario, pues justo encima tienes los emos que se pueden poner, y me gustaria que el mio tambien tuviera, como puedo ponerlo? Gracias

Anónimo

ana Eso que ves es una imagen. Tendrías que hacer una con los tuyos y colocarla en tu plantilla (buscas con los artilugios expandidos) después de:
<p><data:blogCommentMessage/></p>

ana

Retiro lo dicho, no funciona, lo que pasa es que al poner el script transformaba los signos ya escritos en los comentarios en emoticonos, pero si escribo unos signos nuevos no los transforma, que podra ser?

Anónimo

ana Si transforma unos , tiene que transformar todos...:O

ana

jejeje, ya yo digo lo mismo, miralo tu
http://descargaloquequieres.blogspot.com/2009/01/posdata-te-quiero.html?showComment=1242839650319#c1214660344161926740

Espero que me puedas ayudar

ana

Rosa ya no te preocupes, el script molestaba a mooltool y prefiero que funcione mooltools, a ver si alguna vez sale alguna forma de que funcione a todos los emoticonos... Bueno un saludo Rosa :)

Anónimo

ana Si, la verdad que es un rollo lo de los emos...los míos van gracias a controlar todos los demás que voy añadiendo :S

Arepita

Hola rosa no me interesan esos emoticonos de esta entrada me interesarian los que tienes tu...en el blog como lo consigo??

Anónimo

Quema Goma Los que tengo yo no los he publicado en el Escaparate, pero puedes ver como instalarlos en Vagabundia... siento no poder decirte la entrada concreta, pero no la recuerdo ahora mismo, aunque si en su buscador pones "emoticonos en Blogger" creo que saldrá.

Emma Granger

Hay rosa rosa la maravillosaa NO ENTIEEEEEEEEEEEENDOOOO

Te cuento que hago y q es el SCRIPT!!
"Nos descargamos el script a nuestro PC y lo subimos a un alojamiento de archivos adecuado."

NO ENTIENDO ESA PARTEE, QIERO ESOS EMOTICONES U.U

Anónimo

Emma Granger Si no entiendes eso que es básico para la mayoría de trucos, entonces poco vas a poder hacer...
Empieza por aquí:
http://elescaparatederosa.blogspot.com/2007/11/como-subir-un-script-nuestro-propio.html

Admin

Hola he estado tratando de poner emoticonos, y ya hice todo lo que dices pero kio nubico que no se es el primer paso

1.Nos descargamos el script a nuestro PC y lo subimos a un alojamiento de archivos adecuado

subimos a un alojamiento de archivos adecuado?
no se en donde subirlo, te agradeceria muchisimo que me ayudaras.
disculpa mi ignorancia pero apenas estoy en esto del blog

Anónimo

aru077 Mira aquí:
http://elescaparatederosa.blogspot.com/2007/11/como-subir-un-script-nuestro-propio.html

Anónimo

disculpa rosa pero donde es el lugar apropiado para subir este archivo.

Anónimo

Peins Google Sites por ejemplo.

Anónimo

gracias rosa

Anónimo

|O gracias

vondav

Gracias Rosa, buscaba algo asi que funcione para la plantilla(toda la pagina) en general.

Saludos

Maya

hola oye rosa no se encontrar un alojamiento al archivo, e provado con google pero me sale : file:///C:/Documents%20and%20Settings/Claudio1/Mis%20documentos/blogger/emoticons.js ,, y se que esa url es invalida porque tiene que empesar por http:// , no se eso:(

Anónimo

mayaMira en es entrada:
http://elescaparatederosa.blogspot.com/2007/11/como-subir-un-script-nuestro-propio.html

Cartoncita Rosa

Hola Rosa :)

He puesto recientemente un icono de impresora en el post footer, pero me di cuenta que a excepción de la primer entrada, los emoticones dejaron de mostrarse, retiré el código de dicha impresora para comprobar y efectivamente sin ella todo se ve bien, pero me gustaría incluirla para que puedan imprimir y guardar en pdf las entradas. Ahora la he cambiado de forma que verás está justo debajo del título.

Pero pasa lo mismo, los emoticones dejan de mostrarse en antiguas entradas :((

¿Habrá forma de tener emoticones e impresora al mismo tiempo, sin que se afecten?

Seguiré intentando colocarla, mientras la dejaré asi para que si tienes tiempo la veas :D

Saluditos y gracias ;)

Anónimo

Viri Supongo que el código, script, que usa la impresora estará compuesto de alguna orden que se repite o no "se lleva" bien con el de los emoticonos... habría que cambiar el sistema de los emos y usar otro, por ejemplo, pero entonces quedarían hasta que los nuevos empezaran a usarse, los antiguos comentarios llenos de símbolos sin emos...

Siento no poder ayudarte más, a veces pasa esto entre algún script si...

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