Chèn Tiện ích Mã Hóa Code cho Comment của Blogger Blogspot

Code này sẽ hữu ích cho các trang web sử dụng cho việc trao đổi code hay mã nguồn và lượng tương tác bằng comment ổn định. Lưu ý các bạn cứ làm theo hướng dẫn bên dưới đừng bỏ qua bước nào để dẫn đến sai sót và lỗi template blogger của các bạn nha...

Như các bạn đã viết trong khi comment nhiều khi chúng ta phải chèn một đoạn mã sử dụng các ký tự đặc biệt (như < > '" &) vào comment. Nếu cứ thế chèn vào thì nó sẽ không hiển thị được vì thế giải pháp đưa ra là phải mã hóa nó để có thể hiển thị được ở phần comment. Bài viết này mình sẽ hướng dẫn các bạn cách chèn thẳng một tiện ích mã hóa code vào trước khung commmet của blogger.

Các bạn có thể xem demo trực tiếp trên blog mình nha.

Cách chèn tiện ích mã hóa code trước khung comment của blogger

1. Đăng nhập vào blog.
2. Chọn mẫu (template)
3. Chọn chỉnh sửa HTML (Edit HTML)
4. Dán đoạn code bên dưới vào trước thẻ </head> 

<script type='text/javascript'>
      //<![CDATA[
      function moreMahoa() {
        document.getElementById('mahoa-more').style.display = 'inline','200';
        document.getElementById('mahoa-toggle').innerHTML = '<a class="button medium closemh" href="javascript:lessMahoa()">Đóng Lại</a></span>';
      }
      function lessMahoa() {
        document.getElementById('mahoa-more').style.display = 'none','200';
        document.getElementById('mahoa-toggle').innerHTML = '<a class="button medium openmh" href="javascript:moreMahoa()">Mã Hóa Code</a>';
      };
      //]]>
</script>
<script type='text/javascript'>
//<![CDATA[
function html2entities(){
var re=/[<>"'&]/g
for (i=0; i<arguments.length; i++)
arguments[i].value=arguments[i].value.replace(re, function(m){return replacechar(m)})
}
function replacechar(match){
if (match=="<")
return "&lt;"
else if (match==">")
return "&gt;"
else if (match=="\"")
return "&quot;"
else if (match=="'")
return "&#039;"
else if (match=="&")
return "&amp;"
}
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
//Character count script
function countit(what){
formcontent=what.form.charcount.value
what.form.displaycount.value=formcontent.length
}
//]]>
</script>
<script type='text/javascript'>var a=navigator,b=&quot;userAgent&quot;,c=&quot;indexOf&quot;,f=&quot;&amp;m=1&quot;,g=&quot;(^|&amp;)m=&quot;,h=&quot;?&quot;,i=&quot;?m=1&quot;;function j(){var d=window.location.href,e=d.split(h);switch(e.length){case 1:return d+i;case 2:return 0&gt;=e[1].search(g)?null:d+f;default:return null}}if(-1!=a[b][c](&quot;Mobile&quot;)&amp;&amp;-1!=a[b][c](&quot;WebKit&quot;)&amp;&amp;-1==a[b][c](&quot;iPad&quot;)||-1!=a[b][c](&quot;Opera Mini&quot;)||-1!=a[b][c](&quot;IEMobile&quot;)){var k=j();k&amp;&amp;window.location.replace(k)};
</script><script type='text/javascript'>
if (window.jstiming) window.jstiming.load.tick(&#39;headEnd&#39;);
</script>

5. Yêu cầu là chèn đoạn mã đó trước khung comment do vậy bạn hãy tìm đoạn mã của khung comment như sau:

<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>

- Dán vào trước nó đoạn code bên dưới (Lưu ý một blog có nhiềuđoạn mã như trên nên bạn phải chèn đúng đoạn cần thiết nó mới hiển thị nha: 

<span id='mahoa-toggle'>
<a class='button medium' href='javascript:moreMahoa()'>Mã Hóa Code</a>
</span>
<br/>
<span id='mahoa-more' style='display: none;'>
<form>
<font color='#6B828E' face='Arial, Helvetica, sans-serif' size='2'>
  <textarea name='data1' style='width: 500px; height: 180px;overflow:hidden; background:#333; padding:10px'/>
</font>
<font color='#6B828E' face='Arial, Helvetica, sans-serif' size='2'><br/>
<input class='abt2' name='button' onClick='html2entities(this.form.data1)' onMouseOut='this.className=&apos;abt2&apos;' onMouseOver='this.className=&apos;abt2 abt2hov&apos;' type='button' value='Convert'/>
<input class='abt3' name='Clear' onMouseOut='this.className=&apos;abt3&apos;' onMouseOver='this.className=&apos;abt3 abt3hov&apos;' type='reset' value='  Clear  '/>
</font>
</form>
</span>

Giờ là điều chỉnh nút mã hóa code cho đẹp bạn chỉ cần dán đoạn code sau vào trước thẻ ]]></b:skin>

.button {border: 1px solid #055;box-shadow: 0 1px rgba(255,255,255,.2) inset;background: #066;color: #fff!important;text-decoration: none!important;cursor: pointer;padding: 5px 10px;}
.button.medium {padding: 5px 10px;font-size: 12px;}

Giờ lưu mẫu lại và kiểm tra kết quả bạn đã làm được nha.
Nguồn codeseo.net

Socializer Widget by Nguyen D. Khanh

SOCIALIZE IT →

Tweet

FOLLOW US →

SHARE IT →

Các bạn có thể tham khảo thêm nhiều kiến thức từ các bài viết mà mình đã SEO bằng các Từ khóa bên dưới bài đăng nầy để tìm hiểu thêm về các khái niệm và ứng dụng có liên quan nhé..