Thêm biểu tượng vui/emoticons blogger 2

Xin chào, trong bài trước mình đã giới thiệu đến các bạn cách thêm biểu tượng vui/emoticons vào bình luận blogger. Tuy nhiên, ở một số blog khác không tích hợp nên hôm nay mình xin giới thiệu với các bạn một cách khác.

Thêm biểu tượng vui/emoticons blogger

Không cần nói nhiều nữa, vào luôn nhé:
Bước 1: Bạn đăng nhập Blogger, sau đó chọn Mẫu => Chỉnh sửa HTML.
Ctrl + F để tìm kiếm ]]></b:skin> và thêm đoạn mã sau vào trước nó:

.emo1 {position: relative;width: 86%;padding: 10px;margin: 0 auto;background: #fff;background-image: -ms-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);background-image: -moz-linear-gradient(center, #FFFFFF 0%, #FFF9F2 100%);background-image: -o-linear-gradient(center, #FFFFFF 0%, #FFF9F2 100%);background-image: -webkit-gradient(linear, right top, left top, color-stop(0, #FFFFFF), color-stop(1, #FFF9F2));background-image: -webkit-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
background-image: linear-gradient(to left, #FFFFFF 0%, #FFF9F2 100%);border: 1px solid #3C69C9;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;box-shadow: 0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);-moz-box-shadow: 0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);-webkit-box-shadow: 0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);box-shadow: 0 2px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);font-weight: normal;color: #333}

Bước 2: Tiếp theo coppy đoạn mã dưới đây:

<div class='emo1'>
<div class='emoticons'>
  <b><img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/9.gif' style='max-height:24px'/> :)
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/62.gif' style='max-height:24px'/> :(
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/66.gif' style='max-height:24px'/> :((
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/20.gif' style='max-height:24px'/> :))
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/42.gif' style='max-height:24px'/> ;)
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/36.gif' style='max-height:24px'/> :D
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/59.gif' style='max-height:24px'/> :-/
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/17.gif' style='max-height:24px'/> :x
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/13.gif' style='max-height:24px'/> :P
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/67.gif' style='max-height:24px'/> :-O
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/22.gif' style='max-height:24px'/> X(
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/47.gif' style='max-height:24px'/> :-h
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/24.gif' style='max-height:24px'/> I-)
<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/78.gif' style='max-height:24px'/> =D7
  <img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/6.gif' style='max-height:24px'/> @-)</b>
  </div></div>

Bước 3: bạn tìm đoạn mã dưới đây và dán đoạn mã đã coppy ở bước 2 vào trước mà này:

      <b:if cond='data:post.allowNewComments'>
        <b:include data='post' name='threaded-comment-form'/>

Bước 4: bạn tìm đoạn code dưới đây và cũng dán đoạn code ở bước 2 vào sau nó:

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

Bước 5: Tìm </body>  và dán đoạn mà sau vào trước nó:

<!--  Smileys Script by JQThang -->
<script type='text/javascript'>
/* Smileys For Blogger Comments
 * by JQThang
 * Url:http://jqthang.blogspot.com
 */
a = document.getElementById(&#39;comment-holder&#39;);
if (a) {
b = a.getElementsByTagName(&quot;p&quot;);
for (i = 0; i &lt; b.length; i++) {
if (b.item(i).getAttribute(&#39;CLASS&#39;) == &#39;comment-content&#39;) {
bh_b_smly = b.item(i).innerHTML.replace(/:\)\)/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/20.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/:\(\(/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/66.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/:\(/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/62.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/\;\)/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/42.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/:D/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/36.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/:-\//gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/59.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/:x/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/17.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/:\P/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/13.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/:-\O/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/67.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/\X\(/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/22.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/:\)/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/9.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/=\)\)/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/20.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/:-h/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/47.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/\I-\)/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/24.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/=\D7/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/78.gif' style='max-height:24px'/>&quot;);
bh_b_smly = bh_b_smly.replace(/\@-\)/gi, &quot;<img alt='' class='bhacksmly' src='http://blog.uhm.vn/emo/bpopo/6.gif' style='max-height:24px'/>&quot;)
b.item(i).innerHTML = bh_b_smly;
}
}
}
</script>
<!--Smileys Script Ends -->

Lưu mẫu và cảm nhận thôi!