Đưa biểu tượng cảm xúc vào nhận xét trên Blogger

Đối với blog trên Wordpress, việc đưa biểu tượng cảm xúc (emoticons) vào các nhận xét thật dễ dàng vì Wordpress có tính năng tự động chuyển các nhóm ký tự định sẵn thành các biểu tượng cảm xúc, mặt cười. Tuy nhiên đối với Blogger thì phải dùng đến thủ thuật.

Cộng đồng Blogger cũng đã giới thiệu nhiều cách đưa biểu tượng cảm xúc Yahoo Messenger vào nhận xét, có thủ thuật hoạt động tốt, có thủ thuật không thể hoạt động được, có thủ thuật hoạt động được trên Template này nhưng lại không hoạt động được dối với Template khác vì nhiều lý do khác nhau. Hôm nay tôi xin giới thiệu một cách, khác với những cách mà bạn tìm thấy được trên Internet.

1. Sau khi đăng nhập Blogger, vào Design >> Edit HTML, chọn Expand Widget Templates.

Dán đoạn mã dưới đây vào sau dòng ]]></b:skin> hoặc vào trước thẻ </head>.

<!-- Emoticons -->
<style type='text/css'>
.comment-body p img {vertical-align: top; padding-right: .3em;}
</style>
<script type='text/javascript'>
//<![CDATA[
function emoticonComentario(cual) {
if(!document.getElementById) {return;}
bodyText = document.getElementById(cual);
cualTexto = bodyText.innerHTML;
// :-A
cualTexto = cualTexto.replace(/:-\A/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons387.gif" />');
// :-Z
cualTexto = cualTexto.replace(/:-\Z/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons505.gif" />');
// :-C
cualTexto = cualTexto.replace(/:-\C/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons358.gif" />');
// :-X
cualTexto = cualTexto.replace(/:-\X/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons390.gif" />');
// :-E
cualTexto = cualTexto.replace(/:-\E/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons305.gif" />');
// :-F
cualTexto = cualTexto.replace(/:-\F/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons290.gif" />');
// :-G
cualTexto = cualTexto.replace(/:-\G/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons504.gif" />');
// :-H
cualTexto = cualTexto.replace(/:-\H/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons340.gif" />');
// :-I
cualTexto = cualTexto.replace(/:-\I/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons374.gif" />');
// :-J
cualTexto = cualTexto.replace(/:-\J/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons281.gif" />');
// :-K
cualTexto = cualTexto.replace(/:-\K/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons325.gif" />');
// :-L
cualTexto = cualTexto.replace(/:-\L/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons253.gif" />');
// :-M
cualTexto = cualTexto.replace(/:-\M/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons180.gif" />');
// :-N
cualTexto = cualTexto.replace(/:-\N/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons303.gif" />');
// :-O
cualTexto = cualTexto.replace(/:-\O/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons336.gif" />');
// :-P
cualTexto = cualTexto.replace(/:-\P/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons393.gif" />');
// :-Q
cualTexto = cualTexto.replace(/:-\Q/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons451.gif" />');
// :-R
cualTexto = cualTexto.replace(/:-\R/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons292.gif" />');
// :-(
cualTexto = cualTexto.replace(/:-\(/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons415.gif" />');
// :-T
cualTexto = cualTexto.replace(/:-\T/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons413.gif" />');
// :-a
cualTexto = cualTexto.replace(/:-\a/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons324.gif" />');
// :-e
cualTexto = cualTexto.replace(/:-\e/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons403.gif" />');
// :-i
cualTexto = cualTexto.replace(/:-\i/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons294.gif" />');
// :-o
cualTexto = cualTexto.replace(/:-\o/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons419.gif" />');
// :-w
cualTexto = cualTexto.replace(/:-\w/g,'<img src="http://www.mundodosgifs.com/emoticons/emoticons285.gif" />');
bodyText.innerHTML = cualTexto;
}
//]]>
</script>

2. Dùng tổ hợp phím Ctrl + F tìm đến đoạn mã như bên dưới.

<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>

</b:if>
</dd>

Thay dòng <p><data:comment.body/></p> bằng đoạn mã như bên dưới.

<p expr:id='&quot;combody-&quot; + data:comment.anchorName'><data:comment.body/></p>
<script type='text/javascript'>
cual = &quot;combody-&quot; + &quot;<data:comment.anchorName/>&quot;;
emoticonComentario(cual);
</script>

3. Tiếp tục tìm đến dòng mã:

<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>

Rồi dán vào trước nó bằng đoạn mã bên dưới.

<center>
<table bgcolor='white' border='1'>
<tbody>
<tr>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons387.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons505.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons358.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons390.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons305.gif'/></td>
</tr>
<tr>
<td>:-A</td>
<td>:-Z</td>
<td>:-C</td>
<td>:-X</td>
<td>:-E</td>
</tr>
<tr>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons290.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons504.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons340.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons374.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons281.gif'/></td>
</tr>
<tr>
<td>:-F</td>
<td>:-G</td>
<td>:-H</td>
<td>:-I</td>
<td>:-J</td>
</tr>
<tr>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons325.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons253.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons180.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons303.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons336.gif'/></td>
</tr>
<tr>
<td>:-K</td>
<td>:-L</td>
<td>:-M</td>
<td>:-N</td>
<td>:-O</td>
</tr>
<tr>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons393.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons451.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons292.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons415.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons413.gif'/></td>
</tr>
<tr>
<td>:-P</td>
<td>:-Q</td>
<td>:-R</td>
<td>:-(</td>
<td>:-T</td>
</tr>
<tr>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons324.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons403.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons294.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons419.gif'/></td>
<td><img src='http://www.mundodosgifs.com/emoticons/emoticons285.gif'/></td>
</tr>
<tr>
<td>:-a</td>
<td>:-e</td>
<td>:-i</td>
<td>:-o</td>
<td>:-w</td>
</tr>
</tbody>
</table>
</center>

4. Lưu Template.

Tiếp tục vào Settings (Cài đặt) >> Comments (Nhận xét). Ở mục Comment Form Placement, chọn Embedded below post.

:ha Chuẩn bị sắp ra lò thủ thuật :29) Đưa biểu tượng cảm xúc vào bài viết và nhận xét Blogger (Emoticons for Blogger Posts and Comments). :27)