Emoticons nos Comentários do Blogger

Saiba como colocar emoticons nos comentários do Blogger, como mostra a imagem abaixo:

Este código só funciona em formulário de comentários com postagem abaixo incorporados!

Para verificar isso, vá em Configurações->Comentários-> e selecione a opção Postagem abaixo incorporada.

Feito isso, vamos ao tutorial!

A primeira coisa a fazer é ir em Layout->Editar HTML e clicar em Expandir Modelos de Widgets.

Feito isso, clique em ctrl+F e cole na caixinha que abrir no canto direito o seguinte trecho:

<p><data:blogCommentMessage/></p>

Observação:Pode acontecer de ter mais de uma vez esse trecho no código HTML do seu blog! caso isso aconteça, você terá que colocar o código abaixo de cada vez que ele aparecer!

Cole logo abaixo o seguinte código:

<div style=' width: 575px; text-align: left; border: 1px solid #ff00ff; background: #FEF9EA; padding: 10px; color:#ff00ff; font-weight:bold; '><br /> &#160;<img border='0' src='http://ohmydollz.uol.com.br/forumbr/img/smilies/bisous.gif'/> :a<br /> &#160;<img border='0' src='http://ohmydollz.uol.com.br/forumbr/img/smilies/gai.gif'/> :b<br /> &#160;<img border='0' src='http://ohmydollz.uol.com.br/forumbr/img/smilies/intr.gif'/> :c<br /> &#160;<img border='0' src='http://ohmydollz.uol.com.br/forumbr/img/smilies/quoi.gif'/> :d<br /> &#160;<img border='0' src='http://ohmydollz.uol.com.br/forumbr/img/smilies/non.gif'/> :e<br /> &#160;<img border='0' src='http://ohmydollz.uol.com.br/forumbr/img/smilies/ouf.gif'/> :f<br /> &#160;<img border='0' src='http://ohmydollz.uol.com.br/forumbr/img/smilies/love.gif'/> :g<br /> &#160;<img border='0' src='http://ohmydollz.uol.com.br/forumbr/img/smilies/lol.gif'/> :h<br /> &#160;<img border='0' src='http://ohmydollz.uol.com.br/forumbr/img/smilies/mdr.gif'/> :i<br /> &#160;<img border='0' src='http://ohmydollz.uol.com.br/forumbr/img/smilies/fete.png'/> :j<br /> &#160;<img border='0' height='35' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/emo-girl-002.gif' width='35'/> :k<br /> &#160;<img border='0' height='35' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/emo-girl-012.gif' width='35'/> :l<br /> &#160;<img border='0' height='35' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/emo-girl-001.gif' width='35'/> :m<br /> &#160;<img border='0' height='35' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/emo-girl-009.gif' width='35'/> :n<br /> &#160;<img border='0' height='35' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-013.gif' width='35'/> :o<br /> &#160;<img border='0' height='35' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-014.gif' width='35'/> :p<br /> &#160;<img border='0' height='35' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-018.gif' width='35'/> :q<br /> </div>

Depois cole o código abaixo antes de </body>.

<span style="font-family: inherit;"><script type='text/javascript'><br /> //<![CDATA[<br /> a = document.getElementById('comments');<br /> if(a) {<br /> b = a.getElementsByTagName("DD");<br /> for(i=0; i < b.length; i++) {<br /> if (b.item(i).getAttribute('CLASS') == 'Author-comment-body' , 'comment-body') {<br /> _str = b.item(i).innerHTML.replace(/:j/gi, "<img src=' <span style="line-height: normal;">http://ohmydollz.uol.com.br/forumbr/img/smilies/bisous.gif</span> ' alt='' class='smiley'/>");<br /> <span style="font-family: inherit;">_str = _str.replace(/:a/ig,"<img src='http://ohmydollz.uol.com.br/forumbr/img/smilies/gai.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:b/ig,"<img src='http://ohmydollz.uol.com.br/forumbr/img/smilies/intr.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:c/ig,"<img src='http://ohmydollz.uol.com.br/forumbr/img/smilies/intr.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:d/ig,"<img src='http://ohmydollz.uol.com.br/forumbr/img/smilies/quoi.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:e/ig,"<img src='http://ohmydollz.uol.com.br/forumbr/img/smilies/non.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:f/ig,"<img src='http://ohmydollz.uol.com.br/forumbr/img/smilies/ouf.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:g/ig,"<img src='http://ohmydollz.uol.com.br/forumbr/img/smilies/love.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:h/ig,"<img src='http://ohmydollz.uol.com.br/forumbr/img/smilies/lol.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:i/ig,"<img src='http://ohmydollz.uol.com.br/forumbr/img/smilies/mdr.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:j/ig,"<img src='http://ohmydollz.uol.com.br/forumbr/img/smilies/fete.png' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:k/ig,"<img src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/emo-girl-002.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:l/ig,"<img src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/emo-girl-012.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:m/ig,"<img src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/emo-girl-001.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:n/ig,"<img src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/emo-girl-009.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:o/ig,"<img src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-013.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:p/ig,"<img src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-014.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">_str = _str.replace(/:q/ig,"<img src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-018.gif' alt='' class='smiley'/>")</span><span style="font-family: inherit;">b.item(i).innerHTML = _str;</span><span style="font-family: inherit;">}</span><span style="font-family: inherit;">}</span><span style="font-family: inherit;">}</span><span style="font-family: inherit;"><br /> </span><span style="font-family: inherit;">//]]></span><span style="font-family: inherit;"><br /> </span><span style="font-family: inherit;"></script></span></span>

Prontinho! Agora salve!

Você pode alterar as cores da caixinha onde ficam os emoticons. Para isso, procure essa linha:

<div style=' width: 575px; text-align: left; border: 1px solid #ff00ff; background: #FEF9EA; padding: 10px; color:#ff00ff; font-weight:bold; '>

E altere de acordo com o seu blog:

width: 575px --/*largura total*/
border: 1px solid # ff00ff --/*borda*/
background: # FEF9EA --/*cor de fundo*/
color: # ff00ff; --/*cor do texto dos simbolos*/

Tutorial elaborado por Aline.A cópia total ou parcial deste artigo é proibida!Se aprendeu aqui,não custa creditar!