follow ehpedia.com di facebook follow ehpedia.com di twitter follow ehpedia.com di google plus

Membuat Seleksi Otomatis Pada Blockquote & Pre di Blog

Membuat Seleksi Otomatis Pada Blockquote & Pre di Blog

Membuat seleksi otomatis pada tag blockquote atau tag pre ini akan mempermudah & mempercepat pengunjung dalam melakukan seleksi & meng-copypaste kode-kode script seperti HTML, CSS, JavaScript, jQuery atau teks lain yang dimuat dalam kode blockquote dan pre.
Hal ini juga sering disebut Click To Select All yakni dengan sekali klik teks yang terdapat di dalam blockquote / pre akan ter-select.

Secara default blogger atau semua template telah memiliki Tag blockquote ini. Namun jika tampilan blockquote blog anda kurang menarik untuk dijadikan kotak menyimpan script, maka anda bisa mengganti kode CSS nya dan mengganti tampilan blockquote menjadi seperti dibawah ini.
Dan untuk cara pemasangan tampilan blockquote seperti ini bisa Anda baca disini Cara Membuat Blockquote Menjadi Kotak Script Dalam Posting Secara Otomatis
Oke, mari kita lanjutkan ke topik posting ini dan simak langkah-langkah Cara Membuat Seleksi Otomatis Pada Tag Blockquote & Pre.

Membuat Seleksi Otomatis Pada Tag Blockquote & Pre


1. Login ke Blogger

2. Pada dashboard blog klik "Template" > "Edit HTML"
Membuat Seleksi Otomatis Pada Blockquote & Pre di Blog
3. Simpan kode dibawah ini sebelum </body> 
Membuat Seleksi Otomatis Pada Blockquote & Pre di Blog
Untuk seleksi Otomatis Pada Tag Blockquote ini kodenya:
<script type='text/javascript'>
var pres = document.getElementsByTagName(&quot;blockquote&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>
Untuk seleksi Otomatis Pada Tag Pre ini kodenya:
<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>
Catatan* :
Pada script di atas, saya menggunakan double click dalam men-seleksi teks.
Untuk menerapkan satu kali klik langsung terseleksi, maka ganti dblclick menjadi click
Membuat Seleksi Otomatis Pada Tag Blockquote & Pre

Membuat Seleksi Otomatis Pada Blockquote & Pre di Blog

di 12 March, 2015 - 04:07 dengan 1 komentar

artikel terkait lainnya

1 komentar

  1. work gan keren banget dah

    http://www.mastahbloging.com/

    ReplyDelete

Mari berkomentar dan berbagi info atau pengalaman Anda. Dan jangan SPAM!

Contact Form

Name

Email *

Message *