Auto Highlight pada Tag Pre

Auto Highlight pada tag PRE. Mungkin sobat sudah tidak asing lagi dengan istilah tag 'pre'. Tag PRE biasanya digunakan untuk menampilkan kode pada postingan. Kalau sobat melihat kode-kode di blog saya, yang warna-warni itu menggunakan tag pre.

Yang dimaksud auto highlight di sini adalah, sobat tidak usah menseleksi semua kode ketika akan mengcopy kode yang diperlukan, cukup mengkilk dua kali (double klik) pada area tag pre, maka secara otomatis semoa kode akan ter-select.

Auto Highlight pada Tag Pre

Untuk melakukan hal tersebut di atas , sebetulnya cukup mudah, hanya dengan menambahkan JavaScript pada template anda. Untuk lebih jelasnya, ikuti langkah di bawah ini:

1. Login ke Blogger
2. Klik Template --> Edit HTML --> Lanjutkan
3. Simpan kode ini sebelum </body>

<script type='text/javascript'>
var pres = document.getElementsByTagName(&quot;pre&quot;);
for (var i = 0; i &lt; pres.length; i++) {
  pres[i].addEventListener(&quot;dblclick&quot;, function () {
    var selection = getSelection();
    var range = document.createRange();
    range.selectNodeContents(this);
    selection.removeAllRanges();
    selection.addRange(range);
  }, false);
}
</script>

4. Simpan template.

Selamat mencoba.