------------------------------------------------------------2333

2 de marzo de 2011

Agrega emoticones a tu blog

Si tienes activado el formulario de comentarios debajo de cada post, entonces seria bueno que le dieras oportunidad a tus lectores al comentar de agregar una lista de emoticones o smilies para que aquellos que deseen comentar en vez de colocar un texto para demostrar agrado como el común"Jajaja" coloquen una carita feliz con los distintos codigos que salen al lado de cada imagen y que al publicar el comentario o post, ya que también sirve para tus entradas, el Script lo sustituya por cada imagen correspondiente.

El formulario de los comentarios se vera igual o similar al que puedes observar en la imagen, a continuacion.

 

Para agregar estos emoticones, debes seguir los siguientes pasos.
[1] Inicia sesion en Blogger, luego ve a la pestaña Diseño>Edicion HTML y expandiendo los artilugios, busca el siguiente codigo.
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>

 
[2] Ahora, entre estas dos lineas, pega el siguiente codigo.


<div style='-moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; width: 369; text-align: left; border: 1px solid #cccccc; padding: 5px; background: #eeeddf; height:86'>
<b>
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif' width='18'/> :))
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif' width='18'/> ;))
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif' width='18'/> ;;)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif' width='18'/> :D
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif' width='18'/> ;)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif' width='18'/> :p
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif' width='22'/> :((
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif' width='18'/> :)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif' width='18'/> :(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif' width='18'/> :X
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif' width='18'/> =((
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif' width='18'/> :-o
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif' width='20'/> :-/
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif' width='18'/> :-*
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif' width='18'/> :|
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif' width='24'/> 8-}
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif' width='31'/> :)]
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif' width='44'/> ~x(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif' width='30'/> :-t
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif' width='18'/> b-(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif' width='18'/> :-L
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif' width='34'/> x(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif' width='30'/> =))
</b>
</div>


[3] Ahora, busca la etiqueta </body> y justo antes de ella, pega el siguiente codigo.

<script src='http://sites.google.com/site/archivosfrikibloggeo/friki-bloggeo/smiley.js'/>

[4] Finalmente, guardas la plantilla.

La linea roja es el script que hace que se remplace el texto por la imagen, pero el archivo .js esta cargado en la pagina de Google Sites , si deseas subir el script a tu propio servidor puedes decargarte el ZIP de archivo, subirlo y sustituir esa dirección por la tuya.

16 comentarios:

  1. hola, te quería avisar que me gusta pero tengo un problema hago todo y cuando quiero guardar me tira el error que algunos caracteres no se podían reconocer. Me puedes pasar de donde conseguiste la Info.

    Para que sepas en Taringa soy vivavalve

    ResponderEliminar
  2. Te equivocaste en el codigo antes de body va otra cosa, te lo paso por Mp;)


    Quisiera preguntarte como le cambiaste el icono a tu blog(en las pestañas de los navegadores)?

    vivavalve

    ResponderEliminar
  3. @Anónimo

    Vivavalve ya el codigo esta arreglado ya debe salir los emticones en tu blog

    ResponderEliminar
  4. solo vine a probar los emoticones ^^

    :)) :D :p :-t

    ResponderEliminar
  5. quién es el Chistoso que se puso manolo12 :D

    ResponderEliminar
  6. Vivavalve, para cambiar el favicon en blogger utiliza el siguiente tuto:

    http://ayuda-bloggers.blogspot.com/2010/12/cambiar-favicon-en-blogger.html

    Saludos y buen Blog!

    PD: Elimina sin pensarlo 2 veces la Navbar o tu blog puede ser denunciado, recuerda que es warez..

    http://ayuda-bloggers.blogspot.com/2010/12/quitar-navbar-barra-superior-de-blogger.html

    ResponderEliminar
  7. @Cloudx18

    Si gracias amigo por el concejo se te tiene en cuenta ya hice lo que me pedistes la oculte mas no la quite definitavamente :) :)

    ResponderEliminar
  8. @Cloudx18

    Gracias de verdad que tu concejo me sirvio de mucho ;) ;)

    ResponderEliminar
  9. gracias por enseñarnos a los que comenzamos en esto saludos

    ResponderEliminar
  10. @Anónimo ok anonimo gracias a ti por visitar y comentar espero que este truco te sirva :)

    ResponderEliminar
  11. Te recomiendo LinkProtect.com para proteger los enlaces, dificultas el cierre del blog, los enlaces duran más, y ganas money! El addon de firefox que tienen es genial te protege las urls en el formulario de publicación, pruébalo! Gracias por la página está genial.

    Silvina

    ResponderEliminar
  12. @Silvina Es muy bueno ese sistema ya lo probe,gracias por comentar..

    ResponderEliminar