Cara Membuat Auto Block Pada tag Code

Cara Membuat Auto Block Pada tag Code - Berhubung masih hari raya idul fitri saya selaku admin blog ini mengucapkan minal aidin walfaizin mohon maaf lahir dan batin :).

Postingan awal lebaran saya buat yang agak simpel bahkan sangat simpel yaitu Auto Block Pada Tag Code biasanya setiap kode diselubungi oleh tag pre namun untuk setiap kode pendek biasanya cukup ditandai dengan <code>...script...</code>.

Pemasangan Auto Block Tag Code pada blog:
Masuk ke edit template kemudian tambahkan CSS dan letakkan diatas kode ]]></b:skin>

CSS
Css disini meliputi: font, background, border dll dan dapat divariasi sesuka hati

code {
  font:normal 12px/14px Monaco,Monospace;
  background:rgba(255,255,255,.4);;
  border:1px solid #eee;
  padding:1px;
  cursor:default;
  border-radius:2px;
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
}

Javascript
Letakkan script dibawah ini diatas kode </head>

<script type='text/javascript'>
$(function() {
    $('code').click(function() {
        var refNode = $(this)[0];
        if($.browser.msie) {
            var range = document.body.createTextRange();
            range.moveToElementText(refNode);
            range.select();
        } else if($.browser.mozilla || $.browser.opera) {
            var selection = window.getSelection();
            var range = document.createRange();
            range.selectNodeContents(refNode);
            selection.removeAllRanges();
            selection.addRange(range);
        } else if($.browser.safari) {
            var selection = window.getSelection();
            selection.setBaseAndExtent(refNode, 0, refNode, 1);
        }
    });
});
</script>

Kemudian Simpan.

Penerapan pada posting
Tambahkan pada setiap kode pendek yang akan di block dengan script <code>...isi...</code>

Tutorial ini hanya untuk newbe semata jika ada mastah yang kurang berkenan mohon maaf, karena saya disini masih belajar :D

Sumber refrensi: Taufik Nurrahman dan jangan lupa mampir kesini