Como poner Emoticones en blogger

12:02


Hola q tal enseguida t muestro como poner emoticones al comentar en blogger


















Q es un emoticon (WIKIPEDIA) : Un emoticono es una secuencia de caracteres ASCII que, en un principio, representaba una cara humana y expresaba una emoción. Pero, posteriormente, fueron creándose otros emoticonos con significados muy diversos. Los emoticonos que expresan alegría u otras emociones positivas se clasifican normalmente como smileys (de smile, «sonrisa» en inglés). Los emoticonos se emplean frecuentemente en mensajes de correo electronico,fors.SMS,chat y pag. web.


COMENCEMOS CON EL TUTORIAL POR ESCRITO
COMO PONER EMOTICONES EN BLOGGER




Para ponerlo solo pega Estos 2 códigos ya modificados:

((((Encuentra mas rápido presionando las teclas Ctrl + F ahí escribe lo que buscas  ))))


1º CÓDIGO
  • Modifica el sig. código y pegalo  antes de </head>

<!-- (Script Emoticones) -->
<script type='text/javascript'>
//<![CDATA[
document.getElementsByClassName = function(clsName){
    var retVal = new Array();
    var elements = document.getElementsByTagName("*");
    for(var i = 0;i < elements.length;i++){
        if(elements[i].className.indexOf(" ") >= 0){
            var classes = elements[i].className.split(" ");
            for(var j = 0;j < classes.length;j++){
                if(classes[j] == clsName)
                    retVal.push(elements[i]);
            }
        }
        else if(elements[i].className == clsName)
            retVal.push(elements[i]);
    }
    return retVal;
}
function addSmiley(){
  var postBodyClass = (postBodyClass) ? postBodyClass : 'post-body';
  var d = document.getElementsByClassName(postBodyClass);
  for(var i=0;i<d.length;i++){
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-\)/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-S/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-P/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-\[/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-D/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\}\:\-\]/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/x\*/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\;\-D/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-\|/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-\}/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\*\)/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
   d[i].innerHTML = d[i].innerHTML.replace(/\:\-\(/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
   d[i].innerHTML = d[i].innerHTML.replace(/\;\-\)/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
   d[i].innerHTML = d[i].innerHTML.replace(/XD/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
    }
var d = document.getElementsByClassName('comment-body');
  for(var i=0;i<d.length;i++){
 d[i].innerHTML = d[i].innerHTML.replace(/\:\-\)/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-S/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-P/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-\[/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-D/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\}\:\-\]/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/x\*/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\;\-D/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-\|/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\-\}/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
        d[i].innerHTML = d[i].innerHTML.replace(/\:\*\)/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
   d[i].innerHTML = d[i].innerHTML.replace(/\:\-\(/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
   d[i].innerHTML = d[i].innerHTML.replace(/\;\-\)/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
   d[i].innerHTML = d[i].innerHTML.replace(/XD/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');
    }
}
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}
addLoadEvent(addSmiley);
//]]>
</script>
<!-- (Fin Script Emoticones) -->




2º CÓDIGO

  • Ahora pegamos el sig. cogido ya modificado debajo de
    <p><data:blogCommentMessage/></p>  
    Para este recuerda Expandir plantillas de artilugios

<!-- ini tabla emoticones -->
<table border='0' cellpadding='0' cellspacing='1'>
  <tr>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='21' src='Link de tu emoticon' width='20'/></td>
    <td align='center' width='26'><img height='20' src='Link de tu emoticon' width='20'/></td>
  </tr>
  <tr>
    <td align='center' width='26'>:-)</td>
    <td align='center' width='26'>:-S</td>
    <td align='center' width='26'>:-P</td>
    <td align='center' width='26'>:-[</td>
    <td align='center' width='26'>:-D</td>
    <td align='center' width='26'>}:-]</td>
    <td align='center' width='26'>X*</td>
    <td align='center' width='26'>;-D</td>
    <td align='center' width='26'>:-|</td>
    <td align='center' width='26'>:-}</td>
    <td align='center' width='26'>:*)</td>
    <td align='center' width='26'>:-(</td>
    <td align='center' width='26'>;-)</td>
    <td align='center' width='26'>XD</td>
  </tr>
</table>
<!-- fin tabla emoticones -->









============================
COMO MODIFICAR EL 1º CODIGO
============================

Solo cambia donde dice link de tu emoticon por el del enlace de tu emoticon.

Por ejemplo:


  • El código de cada expresión del emoticon esta así:
d[i].innerHTML = d[i].innerHTML.replace(/\:\-\[/gi, ' <img src="link d tu emoticon" style="border:0; margin:0; padding:0;" id="new" /> ');


  • Una vez que le hayas cambiado "link d tu emoticon" por la url de tu gif quedara así:

 d[i].innerHTML = d[i].innerHTML.replace(/\:\-\}/gi, ' <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8AbynsEAwJrz95SNAYnuxSiYZ4ccocJe5lY7cJgYFwylV9d0HwI7ooqA5NohFTtFXeALqmh45PkdOt7wa3lEvcuLIg8cPwbjMWek6YABtLfWpLo5b4AdqfBiInM4xlwxhL9Y4tiFYb7Fb/s128/domo.gif" style="border:0; margin:0; padding:0;" id="new" /> ');



  • Recuerda que pegaras el mismo url en la parte de arriba como en la de abajo (como vez el código esta dividido en 2 partes: cada parte tiene 14 espacios -- "link d tu emoticon"-- tanto arriba como abajo, con los mismos códigos de caritas, para poner el enlace de tu emoticon VER VÍDEO PARA MEJOR COMPRENSIÓN .
Ejemplo:
Primera parte del código de Script Emoticones
d[i].innerHTML = d[i].innerHTML.replace(/\:\-\}/gi, ' <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8AbynsEAwJrz95SNAYnuxSiYZ4ccocJe5lY7cJgYFwylV9d0HwI7ooqA5NohFTtFXeALqmh45PkdOt7wa3lEvcuLIg8cPwbjMWek6YABtLfWpLo5b4AdqfBiInM4xlwxhL9Y4tiFYb7Fb/s128/domo.gif" style="border:0; margin:0; padding:0;" id="new" /> ');


El mismo código de Script Emoticones pero la parte de abajo: 

d[i].innerHTML = d[i].innerHTML.replace(/\:\-\}/gi, ' <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8AbynsEAwJrz95SNAYnuxSiYZ4ccocJe5lY7cJgYFwylV9d0HwI7ooqA5NohFTtFXeALqmh45PkdOt7wa3lEvcuLIg8cPwbjMWek6YABtLfWpLo5b4AdqfBiInM4xlwxhL9Y4tiFYb7Fb/s128/domo.gif" style="border:0; margin:0; padding:0;" id="new" /> ');




============================
 Como saber donde va cada emoticon
===========================

Guíate de la siguiente imagen 


 Ejemplo: 

 :-p     =       

el 1º q aparece en el codigo s la carita feliz /\:\-\
el 2º  nervioso (/\:\-S/ y asi sucesivamente ...





=============================
COMO MODIFICAR EL 2º CODIGO
=============================

  • De igual forma cambia donde dice "Link de tu emoticon" por los mismos link´s que le pusiste al código anterior. Recuerda tienen que ser los mismos.

Ejemplo:

Si al código de Script Emoticones le pusiste esta url a la carita o emoticon de (/\:\-\}: https://lh5.googleusercontent.com/u75Cc_XU2UE/Tlbu9bM9jcI/AAAAAAAACMo/po8dZQqsVbg/s128/domo.gif 

Le tendrás que poner el mismo url  a este segundo código de ini tabla emoticones quedaría así:
<td align='center' width='26'><img height='21' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8AbynsEAwJrz95SNAYnuxSiYZ4ccocJe5lY7cJgYFwylV9d0HwI7ooqA5NohFTtFXeALqmh45PkdOt7wa3lEvcuLIg8cPwbjMWek6YABtLfWpLo5b4AdqfBiInM4xlwxhL9Y4tiFYb7Fb/s128/domo.gif' width='20'/></td>


Una vez hecho esto ya esta LISTO  para usarse. 
  • Ya solo tendrás que escribir  el emoticon:
                      en vez de  "estoy feliz"   pondrás    "estoy :-D"

Si deseas emoticones da clic aquí para que te lleve a verlos.


EmoticonoSignificadoEmoticonoSignificadoEmoticonoSignificadoEmoticonoSignificado
:-)
(-:
:)
(:
=)
(=		Sonrisa (smiley):D
=D/xD		Risa:-(
)-:
:(
):D:
Dx
'n'		Tristeza\(
:-P
:P		Sacando la lengua; broma
:'(
='[
:_(
/T_T
TOT
;_;		Llora=O
:-O /		Susto o asombrado=8-OMuy asustado o muy asombrado:-*)
:$
u//u		Sonrojado/a me sonrojas
:-X
X-:
'x'		No dice nada, se ha quedado mudo;-)
;)
;D		Guiña un ojo8-)
(-8		Lleva gafas/sabiondoq=D
(-:b
(-:6		Lleva una gorra
:-o
o-:
:O
o:		Sorpresa:-7
:9		Relamiéndose:-\
XC
):-/
:\
/:		Disgustado@:-bMujer con moño
0:-)Santo, inocente+-:-)El Papa~<:º)Payaso=:-/Punk
{:-)Con boina:[
".,."
',--,'		Vampiro:-mPensativoT_T
ToT
Y_Y
T^T;O;
;__;		Ojos llorosos
ò_ó¬¬
-.- O.ó
o.Ó		Enfado:BMostrando los dientes^^Ojitos felices^_^
Ü
^o^
^^
'u'		Carita Feliz
u.u
u_u
U_U		Apenado, tristeQ:)Osaman_nAlegre>_<
>.<
><		No entiendo
O.O
O_O
'O'</>C_C		Muy sorprendidoO.o
'o'		Sorprendido:S
'~'U		Desconcertado@_@Loco
d[-_-]bEscuchar música Basshunter¬ ¬
¬ ¬*		Mirando enojado con ojos entrecerrados-_-Cara normalxD
XD		Risa, ironía
:S
'~'		Desconcertado. Que rollo o que pena.ñ_ñ
-.-'
-.-"		Sin palabras o vergüenza ajena:ĐAlegría extrema:3:BCarita tierna
-3-Beso negro
o0o
.¡.
,.l..		Levanta el dedo corazón (Seña obscena):-x
x_x
X_X		Muerto*-*
*O*
*_*		Maravillado
<3Corazón*¬*
:Q_
:F		Babear:*
=*
^*^
o3o		Besitoo_~
^_~		Guiñando un ojo
:$
;$$*
^///^
u///u		SonrojadoXPSacando la lengua apretando los ojos (burla)$_$Avaricia@>---Como una flor
:')Llora de felicidad>:]Sonrisa malvada
>;-))Con barba
//_O( ///_O
(//_-)>7.(		Emo
._.Indiferente
e.eMirando de reojo
:mmm:
>:3		Mirada Pervertida
-)Durmiendo





Gracias x tu vista y Comentario
Recuerda q Tu opinion s importanT para hacer crecer ste blog

Comparte esta información

Tags:

TAMBIÉN PODRÍA GUSTARTE

4 comentarios

  1. Alphazviernes, 01 julio, 2011

    oooo pero que buen aporte encerio pero tambien la verdad que hueva esta muy lago de hacer jejeje no te dijo flojerita hacerlo!!??!! ajajajaja y ahora que problemas tienes con tu blog que no puedes comentar...??!?!

    ResponderEliminar
  2. Lectora.miércoles, 06 julio, 2011

    Hooola , que tal??? Siento haber estado poco por aquí , y no vengo a pedirte ningún favor...bueno , uno pequeñiiito ,pequeñiiito , me podrías decir como puedeo encontrar fondos para un blog de cine??? Es que busco y busco pero no encuentro , y si encuentro algo lo tengo que descargar....porfaplisss lady piiink....

    Gracias ,Lectora.

    ResponderEliminar
  3. Anny Pinkmiércoles, 06 julio, 2011

    @Kevinalfa10 si es verdad sta algo largo no s dificil ponerlo si no da un poco d pereza hacer el codigo pero es solo poner el link de tus imagenes y ya. y ps como ya t habia dicho solo es con algunos blog`s y ps incluye al tuyo jumm :( pero a veces no hay problemas siii!!! pero de cualquier forma yo veo como le hago pero t comento XDDD d forma anonima segun ps. ya q tienes sta opcion XDD q no, cuidat ps q stes super mega ulta genial.

    @Lectora mira fondos como los q t proporciona blogger solo pon n google en la pestaña de imagenes la palabra cine y te da varias imagenes
    ahora si deseas cambiar el fondo atraves de codigo (((( ve la sig. ntrada para + informacion http://tutosladypink.blogspot.com/2011/05/como-hacer-un-fondo-para-tu-blog.html))))

    ncontre stas dentro de la imagen sta el autor d la misma

    http://i34.tinypic.com/2u91rvp.jpg
    http://static.zooomr.com/images/8381739_d072310d41_o.jpg

    ResponderEliminar
  4. Anónimoviernes, 20 julio, 2012

    hola buen aporte intentare a ver si funciona

    ResponderEliminar

Bienvenidos gracias por tu visita y comentario. Recuerda suscribirte para recibir actualizaciones en tu correo de lo nuevo de este blog y de las demás redes sociales de Tutos Lady Pink.


Welcome thanks for your visit and comment. Subscribe if you want to receive updates from this blog. Remember to visit the other social networking pink lady.


欢迎感谢您的访问和评论。
订阅如果您想收到这个博客的更新。
下次访问其他社会网络夫人粉色。