Apa fungsi Blockquote dengan Fungsi Popup Copy Plain ini ?? Blockquote dengan Fungsi Popup Copy Plain ini berguna agar pengunjung yang akan mengcopy kode tidak perlu memblok teks atau kode yang admin berikan. Hanya klik tombol copy text click here kemudian akan muncul jendela popup yang memuat kode yang ada di dalam blockquote yang sudah terseleksi, sehingga pengunjung hanya perlu melakukan ctrl + c di blog kita.
Berikut ini contoh Blockquote dengan Fungsi Popup Copy Plain yang saya gunakan sendiri di blog saya :
.png "Membuat Blockquote dengan Fungsi Popup Copy Plain")
Jika anda tertarik Membuat Blockquote dengan Fungsi Popup Copy Plain silahkan ikuti cara-caranya yang akan saya bahas di bawah ini :
1. Loggin ke Blogger Anda
2. Klik Template > Edit HTML
3. Jika anda takut salah , silahkan anda download templatenya dulu
4. Letakkan kode CSS berikut di atas kode ]]></b:skin>blockquote{position:relative}
blockquote .c_b{display:block;position:absolute;top:0;right:0;z-index:99;padding:2px 5px;} 4. Selanjutnya Letakkan kode di bawah ini di atas kode </body>
<script type='text/javascript'>
//<![CDATA[
function copy_code(id) {
var ref = document.getElementById(id),
code = ref.getElementsByTagName('code')[0].innerHTML,
w_w = window.innerWidth,
w_h = window.innerHeight,
win = window.open('', '', 'left=' + ((w_w/2)-250) + ',top=' + ((w_h/2)-150) + ',width=500,height=300,scrollbars=0');
win.document.write('<!DOCTYPE html><html><head><title>Source Code</title><style type="text/css">*{margin:0;padding:0}body{padding:10px;text-aign:center}textarea{display:block;width:98%;height:270px;padding:1px 1px;margin:0 auto;text-align:left;overflow:auto}</style></head><body><textarea>' + code.replace(/<(.*?)>/g, "") + '</textarea><scr' + 'ipt type="text/javascript">var a=document.getElementsByTagName(\'textarea\')[0];a.focus();a.select();</scr' + 'ipt></body></html>');
}
function add_copy_button() {
var pre = document.getElementsByTagName('blockquote');
for (var i = 0; i < pre.length; i++) {
pre[i].id = 'code-' + i;
pre[i].className += ' quick-copy';
pre[i].innerHTML += '<a class="c_b" href="javascript:copy_code(\'code-' + i + '\');" title="Copy Text Click Here">Copy Text Click Here</a>';
}
} add_copy_button();
//]]>
</script>6. Untuk menambahkan Fungsi Popup Copy Plain ini , saat anda membuat postingananda harus tambahkan kode <code>...</code> di dalam blockquote. Sehingga tampilannya persis (sama) seperti di bawah ini
<blockquote>
<code>
...
Isi kode Blockquote
...
</code>
</blockquote>Saya rasa cukup demikanlah artikel Membuat Blockquote dengan Fungsi Popup Copy Plain penutup artikel saya hari ini , Semoga anda memahaminya.
Demikianlah artikel saya tentang Membuat Blockquote dengan Fungsi Popup Copy Plain. Semoga bisa bermanfaat dan berguna bagi kita semua , apabila ada kata yang kurang berkenan saya mohon maaf sebesar-besarnya , Wassalamuaikum
No comments:
Post a Comment