Tutorial - Emoticons nos comentários

---------*Começo do tutorial*----------

Entre no painel de seu blog clique em design, editar html, clique para expandir modelos de widgets e procure por:

Código :

data:blogCommentMessage

Visualize isso :

Código :



<h4 id='comment-post-message'><data:postCommentMsg/></h4>

Cole o seguinte código abaixo:

Código :


div style=' width: 370px; text-align: left; border: 2px solid #0084ce; background: #FEF9EA; padding: 10px; color:#0084ce; font-weight:bold; '>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjQNIu7Hogf0UWw0vsATg__idAbz6k3z6MMOInh4600urU0zTyjK8nBgzP5_BssGxIy7TeRRXBikfxYtrOTLRwchFJXiAjazxGddGNSn2CJ7EknitoJAeY4WTj1TwggsFCL8el_D43_Os/s800/emoticon-0100-smile.gif'/> :a
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggwKDdYqK4UHSToZM0pKNCJfcuTVqp4nFlHSsJI6FS3-1JKLe9UD6QaBZSSvsbNf4arXcTjm7U7P0vnFbP5aGbCDdhSKQkIRgdQSjbzAMN41sxPj8wFbo_4HDE-g2q-I9t3ASMNyEx9fI/s800/emoticon-0101-sadsmile.gif'/> :b
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvOU2RQc3-NGqg96XmpLzT-wh-CInTIzg4wdtbMia4iloaBtZ_ZAFP_v9VVnqMh8oBS2giRFJXhnxRf_Jk7HMs_eyKwgn6abLTbY-MnR35Zn8E1xUWgAvpDw1RDQ363ZTH2mJlKj_KwjI/s800/emoticon-0102-bigsmile.gif'/> :c
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5chkNFbPU1eN9V9PRMUYGYZ_CgwnkOY-2gd_KVcA_gIgyUUkA-L5eLK61OwR3x4JZ28prX2jmQN0A6_1sPsFLFyZQO3gAJaQpd8sk6Ia6YHBsOK30DrAstdQutGFaLewjNhgllheMvXQ/s800/emoticon-0105-wink.gif'/> :d
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVZWZauO9q3hTiSEmIXO6qqCs2z2wd5pgizgdJBYRos2hY9-azACtDt7gV8Z5GsmAZKwsorghwE94NRI_OmsQNW5akS34tYmOREzkZJDhPijN4QqNfXoFJThSckUHGq1K-Ncrb0EKpvFw/s800/emoticon-0104-surprised.gif'/> :e
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkDdSZubiDivGAxLcAvtseCIqv4FknMOZiTThmDUmGteIs6M5tgATC1LGq_sjBKmCcWGuR628yxhHkXY7pUDso8QEEKCmTV5C_D9KxKQMHm-9ReRtYKSOypZXLEN9GnnRjtDuXZ_jbDUw/s800/emoticon-0106-crying.gif'/> :f
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaK788YB5iIboNOwBQ38LFIYXXiw1qXxegSUhySvVizF296X_WINe7QvUR_67LzlAbFW9UXXk_waS_F8ooOtod-S7b6JVMBXAtZEZxx8bWD9EtJmF_h_P2BJLC3WX-0akIf2p9TKof-dQ/s800/emoticon-0109-kiss.gif'/> :g
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjl0I_n2XQIEM53ptHgzi4nEv27NN0qwkNvFct99pJ1oEenm1zdyr6dMA9JubFizbltj0uBneQHmn413htJMZWvkCR2RiM67EFjr3YHy32JGO8vR55CBgFcXu2TRpZrhFo9CSxv9JlBM1M/s800/emoticon-0111-blush.gif'/> :h
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAPjUQBU_89V1lMZoponW6rRX-vpr29RhdvDW4nc0VF7Gqnnm-oIY2McID-EOUx7lw2S4P4gkgQt2mRRTVOO6m3RJzz6MRyZ-WUsRn0VIHQV0_ylxHf_Wsrr7ni9Ch0nYl6rzLe0wCkBA/s800/emoticon-0110-tongueout.gif'/> :i
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1JiqZH95r3kdLF5wGS_GVsHgcWoJ0-sc1ZoXPF2AlLFWD8Tj6E5HbanZGJERML1VdxAW21DfXY0vhRJcL63Z1VmXX4hLHbXHo5Aw8bjw2M_NvdyL0SVsqpEC_M-a6NrDL56xfqwotOF0/s800/emoticon-0126-nerd.gif'/> :j
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5OcD12LPQydrh_1T1u-gWpP-uYkMLSzgtk35xma-j8F_2Zool2I-4Kt1JzNSUZcb2heAWXnIuMOQN67dSJGcZwn26JJWtRaNUoedVxz0XJm5xUx0HxPDHgTjYIvVJJeO9wbJCSW4Jrk/s800/emoticon-0103-cool.gif'/> :k
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCIYx-w8KzhvKw_lw0nCYxFsUKEfJw7gQz7CTuLN0R-u3uCoQEido3QyLBnK01ElICzb0-_NgjNvW2ymygMyw6xbeUtnMuUradyk6ZCC827c5tF6yBOx8gzFiWLO_7imHidLfeL23oPJg/s800/emoticon-0130-devil.gif'/> :l
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhg-0MZOUeG7zMEVtOX2euxyWKc6X7zxtCAnH-q_CIL8tyL1zuulHkyKVNyHnmfqNDEa0GLPYGQqZ9h_AcZNoVSPuwXuKaIeBaLtnEeiHVG8vVEcNaUTcDOftfAiMykMRe5c_-cfrp2buc/s800/emoticon-0133-wait.gif'/> :m
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiZoW7nH2Hld-NiIw5GWDKKHcfsbecK-gdvG2qiCIScS2Zgxd556897aC8l4QSlESJBcO_tl_eIKoAw76DvNt2GyWT9GIvrm84pAvXiorcI3GOnHu7-bA_AGqeNehEidzIlnogp3X9deQ/s800/emoticon-0137-clapping.gif'/> :n
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZz5BCCq-zvapCIoInrPggEdOTWz4SVu_2fue7pK27Yfi75dMkw3PFncpUScvzc4J3Wnzf8zMf3Jv1OGRGd7g2Md7GBwxrlJp_VCD2pFLNrKacL9h-gLyNXe8-CBCVu6xXOIS_ObuqAJk/s800/emoticon-0136-giggle.gif'/> :o
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh75FvFfXSj-lxlFbvI6vJiqtLPHaRaQjtIJ2mKS4jX19e17HHrw2Am2Lf4uUTEvevKaFtcvDG50TXvHGejh6UkyUQeG-IN6iyXtUcvkNe7Obmbk6fUCVwq99yEPecZYs0a1xxZE6W0LSA/s800/emoticon-0141-whew.gif'/> :p
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMT9OLo15BE-GCF5nft1J2Js4PLd2VgIxFf117jaZ89i2xWv3pARA3funoMW7X81T3XJ2oXeqVxxalHElXh-K6SFUBYOyHaK55z6XrFcH3MTvTJRkc322KPS_FMeomVykj8v-zvgnTVns/s800/emoticon-0148-yes.gif'/> :q
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDlQm7ki7r2sTGOSp5yv9aWJ91mPx_QlplQ37YIjLC9IYXkQHZAQ9zz50Vf3kVE6qeu2n2R-8uiqsM8yDT18zSnGp8e37_pcZ3HFHg0O7y9orTR4r-RN8c-AYfrMmEDHkY1UavauPsWVg/s800/emoticon-0149-no.gif'/> :r
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvIW6hc7lOFg_LQptQ4GStvbh3rbNb8V4oEVnvfZFX1uNqoR_wuRKq1nrVyfTtAJBa9VbRSQoEkELyuegTCe8zwAQH_DXneJoLfMuS5TanqlPu7jUqMr7S40NDmxtQIj3rIEpHyjnBvHY/s800/emoticon-0178-rock.gif'/> :s
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwyuzHSpr9yd4y_mJM4ZmU90h5saKyHc9wSwmijKja-Pnq5NwykHwzRDZ-AMMeCsKdp2CYm_94z2i629sh544dGTPJDyS871MzlNQxPiC29SHSwbV_4FNQKL5zeWHzAPRIjCuOJBvAgiA/s800/emoticon-0155-flower.gif'/> :t
</div>

Clique para salvar.

agora  procure por: </body> e coloque o seguinte código antes dele </body> :

Código :



<script type='text/javascript'>
//<![CDATA[
a = document.getElementById('comments');
if(a) {
b = a.getElementsByTagName("DD");
for(i=0; i < b.length; i++) {
if (b.item(i).getAttribute('CLASS') == 'Author-comment-body' , 'comment-body') {
_str = b.item(i).innerHTML.replace(/:j/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1JiqZH95r3kdLF5wGS_GVsHgcWoJ0-sc1ZoXPF2AlLFWD8Tj6E5HbanZGJERML1VdxAW21DfXY0vhRJcL63Z1VmXX4hLHbXHo5Aw8bjw2M_NvdyL0SVsqpEC_M-a6NrDL56xfqwotOF0/s800/emoticon-0126-nerd.gif' alt='' class='smiley'/>");
_str = _str.replace(/:k/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5OcD12LPQydrh_1T1u-gWpP-uYkMLSzgtk35xma-j8F_2Zool2I-4Kt1JzNSUZcb2heAWXnIuMOQN67dSJGcZwn26JJWtRaNUoedVxz0XJm5xUx0HxPDHgTjYIvVJJeO9wbJCSW4Jrk/s800/emoticon-0103-cool.gif' alt='' class='smiley'/>");
_str = _str.replace(/:l/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCIYx-w8KzhvKw_lw0nCYxFsUKEfJw7gQz7CTuLN0R-u3uCoQEido3QyLBnK01ElICzb0-_NgjNvW2ymygMyw6xbeUtnMuUradyk6ZCC827c5tF6yBOx8gzFiWLO_7imHidLfeL23oPJg/s800/emoticon-0130-devil.gif' alt='' class='smiley'/>");
_str = _str.replace(/:m/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhg-0MZOUeG7zMEVtOX2euxyWKc6X7zxtCAnH-q_CIL8tyL1zuulHkyKVNyHnmfqNDEa0GLPYGQqZ9h_AcZNoVSPuwXuKaIeBaLtnEeiHVG8vVEcNaUTcDOftfAiMykMRe5c_-cfrp2buc/s800/emoticon-0133-wait.gif' alt='' class='smiley'/>");
_str = _str.replace(/:n/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiZoW7nH2Hld-NiIw5GWDKKHcfsbecK-gdvG2qiCIScS2Zgxd556897aC8l4QSlESJBcO_tl_eIKoAw76DvNt2GyWT9GIvrm84pAvXiorcI3GOnHu7-bA_AGqeNehEidzIlnogp3X9deQ/s800/emoticon-0137-clapping.gif' alt='' class='smiley'/>");
_str = _str.replace(/:o/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZz5BCCq-zvapCIoInrPggEdOTWz4SVu_2fue7pK27Yfi75dMkw3PFncpUScvzc4J3Wnzf8zMf3Jv1OGRGd7g2Md7GBwxrlJp_VCD2pFLNrKacL9h-gLyNXe8-CBCVu6xXOIS_ObuqAJk/s800/emoticon-0136-giggle.gif' alt='' class='smiley'/>");
_str = _str.replace(/:p/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh75FvFfXSj-lxlFbvI6vJiqtLPHaRaQjtIJ2mKS4jX19e17HHrw2Am2Lf4uUTEvevKaFtcvDG50TXvHGejh6UkyUQeG-IN6iyXtUcvkNe7Obmbk6fUCVwq99yEPecZYs0a1xxZE6W0LSA/s800/emoticon-0141-whew.gif' alt='' class='smiley'/>");
_str = _str.replace(/:q/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMT9OLo15BE-GCF5nft1J2Js4PLd2VgIxFf117jaZ89i2xWv3pARA3funoMW7X81T3XJ2oXeqVxxalHElXh-K6SFUBYOyHaK55z6XrFcH3MTvTJRkc322KPS_FMeomVykj8v-zvgnTVns/s800/emoticon-0148-yes.gif' alt='' class='smiley'/>");
_str = _str.replace(/:r/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDlQm7ki7r2sTGOSp5yv9aWJ91mPx_QlplQ37YIjLC9IYXkQHZAQ9zz50Vf3kVE6qeu2n2R-8uiqsM8yDT18zSnGp8e37_pcZ3HFHg0O7y9orTR4r-RN8c-AYfrMmEDHkY1UavauPsWVg/s800/emoticon-0149-no.gif' alt='' class='smiley'/>");
_str = _str.replace(/:t/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwyuzHSpr9yd4y_mJM4ZmU90h5saKyHc9wSwmijKja-Pnq5NwykHwzRDZ-AMMeCsKdp2CYm_94z2i629sh544dGTPJDyS871MzlNQxPiC29SHSwbV_4FNQKL5zeWHzAPRIjCuOJBvAgiA/s800/emoticon-0155-flower.gif' alt='' class='smiley'/>");
_str = _str.replace(/:s/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvIW6hc7lOFg_LQptQ4GStvbh3rbNb8V4oEVnvfZFX1uNqoR_wuRKq1nrVyfTtAJBa9VbRSQoEkELyuegTCe8zwAQH_DXneJoLfMuS5TanqlPu7jUqMr7S40NDmxtQIj3rIEpHyjnBvHY/s800/emoticon-0178-rock.gif' alt='' class='smiley'/>");
_str = _str.replace(/:a/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjQNIu7Hogf0UWw0vsATg__idAbz6k3z6MMOInh4600urU0zTyjK8nBgzP5_BssGxIy7TeRRXBikfxYtrOTLRwchFJXiAjazxGddGNSn2CJ7EknitoJAeY4WTj1TwggsFCL8el_D43_Os/s800/emoticon-0100-smile.gif' alt='' class='smiley'/>");
_str = _str.replace(/:b/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggwKDdYqK4UHSToZM0pKNCJfcuTVqp4nFlHSsJI6FS3-1JKLe9UD6QaBZSSvsbNf4arXcTjm7U7P0vnFbP5aGbCDdhSKQkIRgdQSjbzAMN41sxPj8wFbo_4HDE-g2q-I9t3ASMNyEx9fI/s800/emoticon-0101-sadsmile.gif' alt='' class='smiley'/>");
_str = _str.replace(/:c/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvOU2RQc3-NGqg96XmpLzT-wh-CInTIzg4wdtbMia4iloaBtZ_ZAFP_v9VVnqMh8oBS2giRFJXhnxRf_Jk7HMs_eyKwgn6abLTbY-MnR35Zn8E1xUWgAvpDw1RDQ363ZTH2mJlKj_KwjI/s800/emoticon-0102-bigsmile.gif' alt='' class='smiley'/>");
_str = _str.replace(/:d/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5chkNFbPU1eN9V9PRMUYGYZ_CgwnkOY-2gd_KVcA_gIgyUUkA-L5eLK61OwR3x4JZ28prX2jmQN0A6_1sPsFLFyZQO3gAJaQpd8sk6Ia6YHBsOK30DrAstdQutGFaLewjNhgllheMvXQ/s800/emoticon-0105-wink.gif' alt='' class='smiley'/>");
_str = _str.replace(/:e/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVZWZauO9q3hTiSEmIXO6qqCs2z2wd5pgizgdJBYRos2hY9-azACtDt7gV8Z5GsmAZKwsorghwE94NRI_OmsQNW5akS34tYmOREzkZJDhPijN4QqNfXoFJThSckUHGq1K-Ncrb0EKpvFw/s800/emoticon-0104-surprised.gif' alt='' class='smiley'/>");
_str = _str.replace(/:f/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkDdSZubiDivGAxLcAvtseCIqv4FknMOZiTThmDUmGteIs6M5tgATC1LGq_sjBKmCcWGuR628yxhHkXY7pUDso8QEEKCmTV5C_D9KxKQMHm-9ReRtYKSOypZXLEN9GnnRjtDuXZ_jbDUw/s800/emoticon-0106-crying.gif' alt='' class='smiley'/>");
_str = _str.replace(/:g/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaK788YB5iIboNOwBQ38LFIYXXiw1qXxegSUhySvVizF296X_WINe7QvUR_67LzlAbFW9UXXk_waS_F8ooOtod-S7b6JVMBXAtZEZxx8bWD9EtJmF_h_P2BJLC3WX-0akIf2p9TKof-dQ/s800/emoticon-0109-kiss.gif' alt='' class='smiley'/>");
_str = _str.replace(/:h/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjl0I_n2XQIEM53ptHgzi4nEv27NN0qwkNvFct99pJ1oEenm1zdyr6dMA9JubFizbltj0uBneQHmn413htJMZWvkCR2RiM67EFjr3YHy32JGO8vR55CBgFcXu2TRpZrhFo9CSxv9JlBM1M/s800/emoticon-0111-blush.gif' alt='' class='smiley'/>");
_str = _str.replace(/:i/ig,"<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAPjUQBU_89V1lMZoponW6rRX-vpr29RhdvDW4nc0VF7Gqnnm-oIY2McID-EOUx7lw2S4P4gkgQt2mRRTVOO6m3RJzz6MRyZ-WUsRn0VIHQV0_ylxHf_Wsrr7ni9Ch0nYl6rzLe0wCkBA/s800/emoticon-0110-tongueout.gif' alt='' class='smiley'/>")
b.item(i).innerHTML = _str;
}
}
}
//]]>
</script>

------------*fim do tutorial*----------

observação :



Clique novamente para salvar e depois é só fazer os testes, lembre-se que os comentários do blogger podem demorar uns minutos para aparecer, normalmente não demora, então se não aparecer na hora é normal, mas isso não quer dizer que deu errado, nos testes que fizemos demorou uns 2 minutos para ser visível o comentário com emoticons no blogger.
E o melhor de tudo sobre esses emoticons para colocar no blog é que você pode criar os seus emoticons facilmente, repare que os trechos que se repetem varias vezes:
_str = _str.replace(/:k/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5OcD12LPQydrh_1T1u-gWpP-uYkMLSzgtk35xma-j8F_2Zool2I-4Kt1JzNSUZcb2heAWXnIuMOQN67dSJGcZwn26JJWtRaNUoedVxz0XJm5xUx0HxPDHgTjYIvVJJeO9wbJCSW4Jrk/s800/emoticon-0103-cool.gif' alt='' class='smiley'/>");
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5OcD12LPQydrh_1T1u-gWpP-uYkMLSzgtk35xma-j8F_2Zool2I-4Kt1JzNSUZcb2heAWXnIuMOQN67dSJGcZwn26JJWtRaNUoedVxz0XJm5xUx0HxPDHgTjYIvVJJeO9wbJCSW4Jrk/s800/emoticon-0103-cool.gif'/> :k
&#160;
Cada um numa parte do código é repetido apenas trocando o endereço da imagem e o código para o emotion , portanto se trocar o endereço da imagem: https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5OcD12LPQydrh_1T1u-gWpP-uYkMLSzgtk35xma-j8F_2Zool2I-4Kt1JzNSUZcb2heAWXnIuMOQN67dSJGcZwn26JJWtRaNUoedVxz0XJm5xUx0HxPDHgTjYIvVJJeO9wbJCSW4Jrk/s800/emoticon-0103-cool.gif'


Fonte : Isabel Tutoriais .