Skip to main content

Cara Double Tap to Select All di Blog

Cara Double Tap to Select All di Blog - Hi friends, I hope you are all in good healthwallpaper, In the article you are reading this time with the title Cara Double Tap to Select All di Blog, We have prepared this article well for you to read and take information in it. hopefully the contents of the post Artikel Blog, what we write you can understand. ok, happy reading.

Title : Cara Double Tap to Select All di Blog
link : Cara Double Tap to Select All di Blog

read also


Cara Double Tap to Select All di Blog

Cara menambahkan fungsi double tap/click to select area ke dalam Blog, bagi yang sering mengunjungi blog atau web tutorial coding dan edit-edit template pastinya telah akrab dengan proses copy paste code.

double click to select all code blog

Apa itu Fitur Double Tap to Select? 

Fitur double tap atau double click to select memungkinkan kita untuk menyeleksi keseluruhan isi kode yang terdapat di dalam sebuah kolom/tag/parent yang telah ditentukan.

Ada kalanya kegiatan copas code ini sangat menyenangkan karena sang empunya Blog telah menerapkan double click to select, fitur ini dapat menjadi poin plus lho karena terbukti memudahkan pengunjung dalam menerapkan tutorial dalam artikel kita.

Tak jarang kita cukup diribetkan juga karena harus tap dan geser-geser terlebih dahulu untuk sekedar memblock/select keseluruhan isi kode.

Tak ingin kan para pengunjung menjadi kapok alias ogah balik lagi karena pengalaman dalam menjalankan tutorial yang kurang menyenangkan. Daripada berlama-lama lagi yuk langsung simak tutorialnya.

Menerapkan Fungsi Double Click Select All di Blog

Harap lakukan Backup terlebih dahulu sebelum melakukan tutorial yang mengharuskan perubahan kode pada Template untuk berjaga-jaga.

  1. Buka blogger dan masuk dengan akun google sobat
  2. Buka Template dan pilih Edit HTML
  3. Cari code </body> dan letakan kode dibawah ini tepat diatasnya (pilih salah satu)
    <script type='text/javascript'>
    //<![CDATA[
    for (var pres = document.querySelectorAll("pre,code"), 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>
    Versi minify
    <script type='text/javascript'>
    //<![CDATA[
    for(var pres=document.querySelectorAll("pre,code"),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. Save Template

Dengan melakukan langkah diatas maka fitur Dblclick telah berhasil ditambahkan pada Blog sobat, untuk memanfaatkan fitur tersebut silahkan tulis artikel yang berisikan beberapa baris kode yang dibungkus dengan tag:

<pre><code>masukan kode disini</code></pre>

Untuk hasil atau demonya silahkan double tap pada baris kode diatas dalam artikel ini.

Script ini berfungsi untuk tag pre dan code. Jika ingin menambahkan tag, id atau class lain silahkan tambahkan dengan menggunakan tanda koma (,) sebagai pemisah. Contoh: pre,code,blockquote,(tag yang ditambahkan),dst.

Penutup dan Kesimpulan

Demikian tips Blog coding edit template sederhana bagaimana caranya agar kode di dalam artikel blog dapat di select all hanya dengan 2 kali click.

Terima kasih kepada blog bloggingbray sebagai referensi rujukan kode yang CatatanDroid gunakan dalam artikel kali ini, bagaimana sobat cukup mudah bukan? semoga bermanfaat dan selamat mencoba! CatatanDroid



That's the article Cara Double Tap to Select All di Blog

That's it for the article Cara Double Tap to Select All di Blog this time, hopefully can be useful for all of you. okay, see you in another article post.

You are now reading the article Cara Double Tap to Select All di Blog with link address https://wallpapers-10.blogspot.com/2022/01/cara-double-tap-to-select-all-di-blog.html
Comment Policy: Please write your comments that match the topic of this page post. Comments containing links will not be displayed until they are approved.
Open Comments
Close Comment