Cara Mudah Membuat Fungsi Double Click To Select All di Blog

Tutorial kali ini kita akan membahas tips blogging yang sekiranya cukup berguna bagi pengunjung blog, terutama blog-blog yang sebagian besar dari isi postingannya berisi kode program. Tutorial tersebut yakni bagaimana cara Membuat Fungsi Double Click To Select All di Blog.

Apa itu Fungsi Double Click To Select All ?

Jika dilihat dari nama fungsinya, maka sudah jelas fungsi dari double click to select all adalah untuk menseleksi semua text dengan cara melakukan double click pada area teks tertentu yang ada di halaman blog. Misalkan teks yang ada dalam tag paragraf <p>…</p> teks yang ada dalam tag blockquote <blockquote>…</blockquote> teks yang ada dalam tag pre <pre>…</pre> dan teks yang ada pada area atau tag lainnya di blog.

Jika pada mulanya untuk menselect suatu teks pengunjung harus melakukannya dengan cara klik tahan mouse kemudian menggeser kursor mulai awal teks hingga akhir teks. Maka dengan adanya fungsi ini di blog, pengunjung tidak akan repot lagi untuk menselect teks yang ada di blog terutama teks yang berupa kode yang sangat panjang.

Langkah-langkah Membuat Fungsi Double Click To Select All

Untuk membuat fungsi ini caranya cukup mudah, silahkan ikuti langkah-langkahnya di bawah ini.

1. Login ke halaman blogger
2. Pilih Theme, kemudian pada Customise pilih Edit HTML
3. Cari kode </body> Kemudian copy paste kode di bawah ini dan letakkan di atas kode </body>

<script type='text/javascript'>
  //<![CDATA[ //Double Click for (var
  pres = document.querySelectorAll("blockquote,pre"), i = 0;
  i < pres.length;
  i++) pres[i].addEventListener("dblclick", function () {
    var e = getSelection(),
      t = document.createRange();
    t.selectNodeContents(this), e.removeAllRanges(),
      e.addRange(t)
  }, !1); //]]> 
</script>

4. Klik Simpan Template

Bagaiamana cukup mudahkan? Untuk script di atas sudah saya yang terapkan di blog ini. Akan tetapi fungsi ini akan bekerja hanya pada tag pre saja. Jadi jika ingin fungsi ini bekerja pada tag lainnya silahkan ditambahkan sendiri.

("blockqoute, pre, tag html")

Demikian tutorial Cara Mudah Membuat Fungsi Double Click To Select All di Blog. Terimakasih sudah membaca. Dan jangan lupa berikan dukungan dengan cara membelikan kopi di trakteer.id atau dengan cara share postingan ini.