Cómo agregar emoticones en los comentarios de tu blog

¡Hola!

Se me ha ocurrido que quizás a algunos les gustaría tener esto en sus cajas de comentarios. Aclaro que podrán cambiar las imágenes de emoticones si lo desean, solo dejaré los que ya venían.

Esto es una traducción de un tutorial ya hecho pero que estaba en inglés. Abajo de todo les dejo adjunta la página.

¡Empecemos!

RECUERDEN QUE PARA COPIAR EL CÓDIGO DEBEN HACER CLICK EN VIEW RAW


1. Plantilla - Crear/Restablecer copia de seguridad

2. Plantilla - Editor html

3. Click en el recuadro de código y hacer Ctrl+f

4. Buscar </body>

Aquí presten atención ya que son dos caminos dependiendo del sistema de comentarios que tenga su blog.

Si su blog es de la versión anterior de comentarios de blogger y que no posee el botón de responder (como aparece en mi blog), deben pegar esto antes de la etiqueta:

Si su blog sí posee la función de responder un comentario, entonces esto es lo que irá arriba de </body>


Si tienen la función de responder comentarios ignoren los pasos del 5 al 8.

5. Busquen con Ctrl+f
<b:loop values='data:post.comments' var='comment'>
6. Encima de esa línea, coloquen esto:
<div id='smileys'>
7. Busquen con Ctrl+f
</b:loop>
8. Después de esa línea coloquen esto:
</div>

9.

 a) Ahora, para los que tengan el viejo sistema de comentarios busquen esto:
<data:blogTeamBlogMessage/>
ACLARACIÓN: Si encuentran más de cuatro veces esta línea, deténganse en la segunda (hagan enter dos veces).

b) Si tienen el nuevo sistema, busquen esto:
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
10. Antes de cualquiera de esas dos líneas, deben pegar este código:
Como pueden ver, más debajo de la caja de comentarios aparece "Show emoticones", eso es para que los usuarios sepan qué caritas usar y con qué caracteres.

Si no quieren eso allí, entonces antes de la opción a o la opción b, deben pegar esto:
Pueden notar que hay links, esas son las imágenes que representan a cada emoticon. Pueden personalizarlos si desean y cambiar los links. Tengan cuidado a la hora de hacerlo.

11. Para finalizar, busquen esta línea: ]]></b:skin>

Justo encima, coloquen esto:
.itemo{float:left;font-size:11px;height:30px;line-height:1.2;padding:10px 0;text-align:center;width:85px;}
span#smiley-toggle{clear:both;padding:15px 10px;float:left;font:bold 14px 'Oswald', sans-serif;}
span#smiley-toggle a{text-decoration:none;}
#smiley-toggle img{vertical-align:bottom;}
img.smiley{vertical-align:bottom;}


Den en vista previa para verificar que no haya ningún error y si no hay problemas, guardan la plantilla.

¡ESO ES TODO!

FUENTE

9 comentarios:

  1. Muchas gracais, me parece útil :)
    Un beso, nos leemos.

    ResponderEliminar
  2. Hola Maar!
    Paso a contarte que te nominé para el tag Under 200 en mi blog! http://disparatescosmicos.blogspot.com.ar/2017/02/tag-under-200.html
    Ojalá puedas realizarlo :)
    ¡Besos!

    ResponderEliminar
  3. Hola como estas?
    Tus tutoriales siempre son muy completos. Me encantaria agregar los emoticones pero se me complica hacerlo. No tengo paciencia para tantos pasos.
    Saludos

    ResponderEliminar
  4. Hola Mar! Me encantó, no sabía que se podía hacer esto! Voy a practicarlo ya mismo para ver cómo queda y ver si después lo agrego a mi Blog, muchas gracias!

    ResponderEliminar
  5. ¡Hola Mar! No tenía ni idea de como hacer esto, ¡mil gracias por el tutorial! Besos ❤️

    ResponderEliminar
  6. ¡Hola! Otra vez por acá :-) Es una señal que casi siempre me toca leer y comentar tus recomendaciones, y me encanta, porque me voy poniendo al día, y aprendiendo mucho de todo esto que no tenía ni idea jajajaja ¡Lo voy a probar! Muchas gracias por la información. ¡Un beso!

    ResponderEliminar
  7. Dónde aprendiste todos estos trucos? a mi nunca se me hubieran ocurrido jaja
    Saludos!!!

    ResponderEliminar
  8. Hola mar!
    Muchas gracias por el tutorial los emoticones quedan tan lindos la verdad <3

    ResponderEliminar
  9. Hola! Como estas? :) Me encantó la reseña... Me hizo acordar a los tiempos en los que me la pasaba en los foros de Laura Gallego o cosas por el estilo. Esos emoticones eran los que se usaban. Eran "la bomba" para ese entonces xd
    Beso!

    ResponderEliminar