Monday, May 29, 2017

JavaScript Atribusi Otomatis

Sticky Attribution

Setelah membuat Rich Text Editor, Saya jadi makin familiar dengan API Rentang Seleksi. Kali ini Saya membuat plugin dengan memanfaatkan fitur tersebut. Dengan tingkatan yang lebih sederhana lagi, sehingga akan mudah untuk diterapkan pada Blogger, yang Saya rasa akan bermanfaat terutama untuk para penulis yang tidak suka jika artikelnya disalin oleh penulis lain tanpa menyertakan tautan sumber yang asli.

Plugin ini tidak menjamin bahwa penyalin konten akan menyertakan tautan Anda pada artikel mereka, tapi setidaknya ini bisa memberikan sedikit peringatan. Selain itu, plugin ini juga memiliki beberapa keistimewaan, salah satunya adalah plugin ini tidak akan menambahkan tautan atribusi secara otomatis ketika teks yang disalin berada di dalam elemen <pre> dan <code>. Saya menambahkan fitur ini karena berdasarkan pengalaman Saya dulu, Saya juga pernah menggunakan plugin sejenis dari luar (kalau tidak salah namanya Tynt), tapi setiap kali Saya menyalin kode (yang tujuannya memang untuk disalin) untuk Saya gunakan, pada saat Saya menempelkan kode tersebut di suatu tempat, tautan atribusi ikut di dalamnya, sehingga orang yang tidak mengerti akan menganggap bahwa atribusi itu memang diperlukan padahal kemungkinan besar atribusi tambahan tersebut malah akan membuat kode menjadi error. Plugin ini juga akan mengembalikan seleksi ke posisi semula sesaat setelah aksi copy dilakukan.

Demo Halaman Proyek

Untuk mengaktifkan fitur ini di blog, cukup salin kode ini dan tempelkan di atas </body>:

<script>
//<![CDATA[
!function(e,t){var n="getSelection",o="removeAllRanges",i="addRange",l="parentNode",a="firstChild",d="appendChild",r="removeChild",s="test",c="innerHTML";if(e[n]){var p,g,f,h,u,y;t.addEventListener("copy",function(C){for(g=C.target;3===g.nodeType;)g=g[l];if(h=t.createElement("div"),(p=e[n]())&&p.rangeCount&&(p=p.getRangeAt(0))&&(f=p.cloneRange(),p=p.cloneContents())){for(;u=p[a];)h[d](u);if(!/^(pre|code)$/i[s](g.nodeName||"")&&!/(^|\s)no-attribution(\s|$)/i[s](g.className||"")){var v=e.location.href;h[c]+="<br><br>&copy; "+t.title+'<br>Source: <a href="'+v+'">'+v+"</a>"}y=t.createRange(),t.body[d](h),y.selectNodeContents(h),p=e[n](),p[o](),p[i](y),setTimeout(function(){h[l][r](h),p[o](),p[i](f)})}},!1)}}(window,document);
//]]>
</script>

Simpan perubahan.

Labels: ,

14 Comments:

At Monday, May 29, 2017 at 10:38:00 PM GMT+7, Blogger Bundet said...

Ijin make om Taufik B) terimakasih banyak :-bd

 
At Tuesday, May 30, 2017 at 4:48:00 AM GMT+7, Blogger @Oci_tz said...

Dapet ilmu baru...
Langsung pasang...hehehe

Thanks a lot

 
At Wednesday, May 31, 2017 at 10:31:00 PM GMT+7, Anonymous Anonymous said...

Ilmu baru..

 
At Thursday, June 8, 2017 at 3:48:00 PM GMT+7, Blogger BrayenL said...

maaf bang taufik, saya oot. Saya ingin menanyakan mengenai layouting template blogger. Saya pemula, saya sedang mengerjakan sebuah template dengan menggunakan sebuah text-editor. Ketika saya preview di browser dengan membuka file project saya, layoutnya sesuai dengan yang saya inginkan dan tidak ada masalah. Namun rencananya saya akan menggunakannya untuk template blogger, apakah template yang saya kerjakan tersebut dapat kompatibel ketika dipasang di blogger, atau harus ada penyesuaian lagi ?

 
At Friday, June 9, 2017 at 8:00:00 PM GMT+7, Blogger Taufik Nurrohman said...

Saya coba googling dan nggak sengaja nemu ekstensi ini, mungkin bisa dicoba.

 
At Tuesday, June 13, 2017 at 7:59:00 PM GMT+7, Blogger IRIL SAGITA said...

Kak taufik itu diterapkan pada posting selain pada blogquote gimana caranya kak ?

 
At Tuesday, June 13, 2017 at 9:36:00 PM GMT+7, Blogger Taufik Nurrohman said...

Tinggal nambahin nama tag di bagian tes.

 
At Tuesday, June 13, 2017 at 10:17:00 PM GMT+7, Blogger Taufik Nurrohman said...

BTW Saya ngerasa ada komentar pengunjung yang gagal dipublish, kalau ada yang ngerasa komentarnya nggak tampil-tampil coba kirim lagi. Trims.

 
At Friday, June 16, 2017 at 1:26:00 AM GMT+7, Blogger IRIL SAGITA said...

Ok, Terima kasih ?
Jadi mudeng.....

 
At Monday, June 19, 2017 at 10:10:00 PM GMT+7, Blogger Unknown said...

Terima kasih artikelnya bang Taufik. Cocok buat pengcopas tapi gak cocok buat pencuri feed.

 
At Wednesday, June 21, 2017 at 6:51:00 PM GMT+7, Blogger BrayenL said...

Bang Taufik, apa perbedaan dari menggunakan $(document).ready(function(){..... dengan langsung menggunakan function xxx(){.... ?

 
At Wednesday, July 5, 2017 at 9:55:00 PM GMT+7, Blogger Taufik Nurrohman said...

/2013/08/memahami-domcontentloaded.html

 
At Thursday, July 13, 2017 at 7:24:00 AM GMT+7, Blogger Iwan Efendi said...

Makasih kang Taufik, keren.. Sudah diterapkan di blog. :-bd

 
At Sunday, July 23, 2017 at 8:25:00 AM GMT+7, Blogger Unknown said...

Wah ini nih yang saya cari, matur suwun ya bro. Aja kelalen ngopine \o/

 

Post a Comment

<< Home