Chia sẻ code mã hóa ký tự HTML của KslZone.NET

Đã lâu lắm rồi không đụng đến blog của mình, điều thực sự dẫn đến lý do này là mình lười tìm ý tưởng để chế tác ra những thủ thuật mới để chia sẻ với mọi người quá. Thôi thì bữa nay tiếp tục chia sẻ những cái hiện có trên blog mình đi cho đỡ buồn. Bữa trước cũng có người hỏi mình về trang mã hóa code HTML của mình, thế nên hôm nay tiện viết một bài nhỏ để chia sẻ với mọi người code mã hóa mà mình đang sử dụng nhé.

Chia sẻ code mã hóa ký tự HTML của KslZone.NET
Khung mã hóa code của KslZone.NET
Đoạn mã này giúp các bạn chuyễn những ký tự đặc biệt về dạng ASCII. Mình thường sử convert như bằng nó để dán vào khung nhận xét nó hiện ra đoạn mã mà mình muốn chia sẻ chứ không bị ẩn đi. Để hiểu rõ hơn bạn có thể thảm khảo tại trang "Chuyễn mã HTML" dán một mã HTML bất kì và bỏ vào phần nhận xét trên blog bạn sẽ thấy nó hiện ra một cách bình thường.

Chuyển ký tự đặc biệt HTML qua ASCII

Ok bây giờ tơi phần code đây, bây giờ bạn chỉ cần sao chép đoạn mã này vào nơi mà bạn muốn hiện. Nó có 2 khung, khung trên điền và khung thứ 2 sẽ convert trực tiếp theo thời gian thực.
<script type="text/javascript">
function $(esc_tool){
 return document.getElementById(esc_tool)
}
var char2entity = { "'" : '&#39;', '"' : '&quot;',  '<' : '&lt;', '>' : '&gt;',  '&' : '&amp;'};
function escape_entities(str) {
 var rv = '';
 for (var i = 0;i < str.length; i++) {
 var ch = str.charAt(i);
 rv += char2entity[ch] || ch;
 }
 return rv;
}
function do_escape(e){
 document.getElementById('escaped').value = escape_entities(e.value)
}
</script>

<textarea onchange="do_escape(this)" onkeyup="do_escape(this)" rows="10" style="font-family: ‘courier new’,monospace; height: 10em; width: 100%;"></textarea>

<textarea id="escaped" onclick="this.select()" readonly="readonly" rows="10" style="font-family: ‘courier new’,monospace; height: 10em; width: 100%;"></textarea>
bạn có thể kết hợp đoạn mã này với thủ thuật "Spoiler cho Blogger" để thu gọn nó và nhét xuống vị trí khung comment để người dùng tiện sử dụng. Đoạn mã này có thể đơn giản hơn nhiều so với những blog khác nhưng mình cảm thấy chỉ như vầy là đủ.

Đoạn Javascript trên thì khá là đơn giản rồi nên mình cũng không giải thích thêm về nó nữa, mọi thắc mắc cần thiết, hoặc vị trí mà bạn muốn chèn vào blog mà không biết phải chèn sao thì cứ để lại nhận xét cho mình ở phía dưới nhé.

22 bình luận

  1. avatar says

    lúc 17:55 28 tháng 11, 2014

    Ae ai biết làm nút back to top như trang này ko?

    kriesi.at/blog

  2. avatar says

    lúc 19:32 28 tháng 11, 2014

    Giao diện thôi mà Duy ,thử cái này xem
    http://www.kslzone.net/2014/10/nut-tro-ve-dau-trang-truot-cho-blogger.html
    còn nếu muốn nó đen đen có mũi tên lên thì để có gì hướng dẫn cho.

  3. avatar Nặc danh says

    lúc 19:57 28 tháng 11, 2014

    Tiện ích Back to top em vừa viết có dùng một phần code blog của anh, anh bỏ qua cho em nhé. Em đã ghi rõ nguồn code anh ạ :)

  4. avatar says

    lúc 19:59 28 tháng 11, 2014

    Không sao đâu em như những cái đó có nhằm nhò gì.

  5. avatar says

    lúc 09:44 7 tháng 12, 2014

    Admin ơi có thể hướng dẫn một bài, cách làm ẩn hết các thành phần khác của blog ở một trang hoặc một bài đăng không, sau đó để tự bản thân thiết kế cho đặc biệt, giống kiể trang chuyển tiếp mà ksl từng giới thiệu ấy!

  6. avatar says

    lúc 10:22 7 tháng 12, 2014

    Quá được ấy chứ :D Đang lười tìm ý tưởng mà cứ được cung cấp thế này thì sẽ viết ngay ^^

  7. avatar says

    lúc 15:25 7 tháng 12, 2014

    Cảm ơn trước! Hóng thôi~

  8. avatar says

    lúc 15:19 10 tháng 12, 2014

    Hóng dài cả cổ mà vẫn chưa thấy nè (-, - )

  9. avatar says

    lúc 19:05 10 tháng 12, 2014

    Quên mất tiêu xin lỗi bác, mà bác muốn một trang trắng bóc luôn hay là có menu với footter bình thường.

  10. avatar says

    lúc 10:41 14 tháng 12, 2014

    Trắng được hơn Ngọc Trinh thì tốt :->

  11. avatar says

    lúc 15:40 16 tháng 12, 2014

    Làm thế nào để widget recent comments của tớ giống của Lâm ở chỗ: sau link ng` comment là : nội dung com luôn nhỉ?

    Of mình nó xuống dòng và đag ko biết làm thế nào cho cùng dòng để tiết kiệm :d

  12. avatar says

    lúc 19:13 16 tháng 12, 2014

    Tìm .tb_recent_comments li span trong cặp thẻ {} thêm vào margin-left: 5px; và xóa display: block; đi thử nhé. Thêm in đậm cái tên nữa thì kiếm .tb_recent_comments li a thêm vào trong font-weight: bold;

  13. avatar says

    lúc 23:09 16 tháng 12, 2014

    Chuẩn men luôn, thank Lâm. Muốn thêm dấu : hoặc - sau link ng` comment thì thế nào dậy :D

  14. avatar says

    lúc 08:11 17 tháng 12, 2014

    Tìm .tb_recent_comments li a
    và thêm lên trên nhé
    .tb_recent_comments li a:after {
    content: "-";
    margin-left: 5px;
    }
    css luôn cho khỏe chỉnh Javascript mất công nữa ^^

  15. avatar says

    lúc 11:22 17 tháng 12, 2014

    Thank Lâm. JS hình như bị mã hóa rồi :D

    có làm cho cái dấu - đó ko thuộc link đc ko Lâm ^^

  16. avatar says

    lúc 11:25 17 tháng 12, 2014

    Không thuộc link thì thử cái này nha, bỏ cái css cũ đi
    .tb_recent_comments li span:before {
    content: "-";
    margin-right: 5px;
    }

  17. avatar says

    lúc 11:39 17 tháng 12, 2014

    Tớ thử cách này rồi nhưng về chính tả ko ổn với dấu : vì cái dấu này phải nằm sát sau link. Nên tớ cho cái color cố định luôn, vẫn là link nhưng phân biệt màu đc :v Thanks

  18. avatar says

    lúc 11:41 17 tháng 12, 2014

    Comment của Lâm phân cấp đến đây trên mobile là khó nhìn luôn :D

  19. avatar says

    lúc 09:57 28 tháng 4, 2015

    Nếu tạo một trang tĩnh thì có thể ẩn các thành phần khác của blog bằng đoạn code này không anh Lâm?
    <style>
    #sidebar-wrapper {display: none !important}
    #id-cần-ẩn {display:none !important}
    .class-cần-ẩn {display: none !important}
    #mywrapper {width: 100% !important}
    </style>

  20. avatar says

    lúc 12:16 28 tháng 4, 2015

    Có bạn, tùy vào mục đích của bạn như thế nào thôi :D, nếu xài css như trên thì trang hoàn toàn ok, nhưng có 1 cái nhỏ thôi là trang vẫn phải load những thành phần đó.

  21. avatar Nặc danh says

    lúc 20:37 13 tháng 5, 2015

    Cảm ơn nhé pro


    http://auto-backlinks.ga - Auto Backlinks

  22. avatar says

    lúc 09:24 24 tháng 11, 2015

    anh ơi...anh có biết thủ thuật gì mà khi họ chia sẻ link trên facebook em thấy bên dưới link rõ ràng là nhũng trang uy tín mà khi em kích vào nó lại ra 1 trang khác không anh.

Mọi nhận xét trên blog KslZone.NET sẽ được kiểm duyệt trước khi được xuất bản trên blog. Lưu ý: Nếu bạn để lại backlink về website của bạn, miễn là kèm theo nhận xét hợp lý thì nhận xét đó vẫn sẽ được chấp nhận. Nếu bạn muốn hiện mã HTML thì bạn cần chuyển đổi trước bằng công cụ phía dưới.