Membuat Blockquote dengan Fungsi Popup Copy Plain

Tutorial Blogger, Kesehatan, Islami

  • HOME
  • DAFTAR ISI
  • BLOGGER
  • TEMPLATE
  • TIPS TRIK
  • SEO
  • DESAIN BLOG
  • WIDGET
  • KESEHATAN
Home Blogger Desain Blog Tips And Trik Membuat Blockquote dengan Fungsi Popup Copy Plain

Membuat Blockquote dengan Fungsi Popup Copy Plain

Ketemu lagi bersama saya di blog ini dan Alhamdulillah nya saya masih diberi kesempatan oleh Allah SWT untuk membagikan postingan kepada anda semua. Postingan kali ini yaitu berjudul Membuat Blockquote Dengan Fungsi Popup Copy Plain yang merupakan artikel kedua saya pada hari ini. Setelah sebelumnya saya juga pernah membagikan suatu template yaitu 3 Template Blog SEO Terkeren 2013 yang merupakan template seo yang saya kumpulkan dan saya bagikan  kepada anda semua , dan tidak ada salahnya anda juga mencoba template tersebut.

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 :

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>
5, Simpan template anda
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
Tweet

10 Responses to " Membuat Blockquote dengan Fungsi Popup Copy Plain "

  1. Unknown7 Juni 2013 pukul 21.30

    Mantapp gan :) visit back

    http://bloggerjava.net

    BalasHapus
    Balasan
    1. Anonim7 Juni 2013 pukul 21.31

      ya makasih gan..

      Hapus
      Balasan
        Balas
    2. Balas
  2. Unknown7 Juni 2013 pukul 21.41

    Nice info (Y)
    lumayan nambah2 ilmu :D

    BalasHapus
    Balasan
    1. Anonim8 Juni 2013 pukul 06.52

      hehe iya mas

      Hapus
      Balasan
        Balas
    2. Balas
  3. Hach Smith7 Juni 2013 pukul 22.47

    menarik ,sob.... ane juga baru tau nih :)

    http://fineblogge.blogspot.com

    BalasHapus
    Balasan
    1. Anonim8 Juni 2013 pukul 06.53

      dicoba juga sob..hehe

      Hapus
      Balasan
        Balas
    2. Balas
  4. Unknown8 Juni 2013 pukul 02.26

    Wah agan fans kompiajaib toh...

    BalasHapus
    Balasan
    1. Anonim8 Juni 2013 pukul 06.53

      ya

      Hapus
      Balasan
        Balas
    2. Balas
  5. Unknown1 Juli 2013 pukul 14.58

    Keren gan banyak ya ide2 nya Mas Adi sehingga membuat Blockquote seperti ini kompiajaib.com memang oke

    BalasHapus
    Balasan
      Balas
  6. BrayenL25 Agustus 2013 pukul 12.21

    Ini kan punya mas kompi yang http://www.kompiajaib.com/2013/05/menambahkan-fungsi-popup-copy-plain.html kan ?

    BalasHapus
    Balasan
      Balas
Tambahkan komentar
Muat yang lain...

Posting Lebih Baru
Posting Lama
Beranda
Langganan: Posting Komentar ( Atom )

Sering Dibaca

  • planet ajaib

    Cara Membedakan Raket Yonex Asli Dengan Yonex Palsu

  • planet ajaib

    Inilah 4 Alasan Suami Ceraikan Istrinya

  • planet ajaib

    Langkah-Langkah Cara Membuat Blog SEO

  • planet ajaib

    Fenomena Mangkung Anggur Dinasti Ming Terjual 409 Miliar

  • planet ajaib

    Download Template Responsive Zikazev Blue

  • planet ajaib

    Hitung Mundur Google Pagerank Bulan Juni 2013 Dimulai

  • planet ajaib

    Khasiat dan Manfaat Sayur Pare

  • planet ajaib

    5 Pembalap GP Paling Legendaris di Dunia

Site Info

Blogroll

  • Harga Motor Yamaha Honda
  • Cek Resi JNE
  • Katalog Carrefour
  • Kata Kata Mutiara

Sahabat

Label

Aneh (13) Badminton (1) Bisnis (3) Blogger (67) Cerita (3) Cinta (3) Desain Blog (14) Directory (1) Fakta Menarik (2) Fenomena (2) gadget (1) Hewan (1) Hoby (2) Information (8) Internet (1) Iseng (12) Kata Kata Mutiara (1) Kecantika (1) Kecantikan (1) Kesehatan (45) Komputer (2) Manfaat (5) Olahraga (1) Pengetahuan (6) Resep (3) SEO (26) Software (1) Teknologi (3) Template (12) Tips And Trik (57) Tool Blog (3) Widget (18)
Privacy Police | Contact| About Me
Support : sertifikasi crane
isnpeksi dan sertifikasi
Copyright © 2013 Planet Ajaib - All Rights Reserved
Design by jasa sertifikasi crane
Powered by Blogger