Bedah Website #14: Auto copy paste kode di postingan blog - MZAINI30

Senin, 04 Mei 2020

Bedah Website #14: Auto copy paste kode di postingan blog

Thanks banget kepada Bang Andrie yang tiba-tiba ngomong gini:

Kayaknya bagus ya kalau misalnya kode yang di postingan blog itu langsung auto copas; nggak perlu blok lagi terus Ctrl + C.

Habis tu langsung, "Oh iya ya. Coba deh aku cari kodenya."

Akhirnya, aku mencari-cari kodenya dan ketemu deh caranya.

Oh iya, sebelumnya harus sudah ada jQuery ya terinstall di blogmu. Soalnya di tutorial ini, nggak kucantumkan cara pasang jQuery. Soalnya kan rata-rata developer website pakai jQuery sehingga template-template Blogspot pun biasanya sudah pakai.

Pertama, buka edit HTML di bagian tema.

Lalu, di atasnya </body>, letakkan kode ini:

<!-- clipboard -->
<script src='https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js'/>
<script src='https://mzaini30.js.org/prism/notify.js'/>
<style>
  /*<![CDATA[*/
  pre {
    cursor: pointer;
  }
  /*]]>*/
</style>
<script type="text/javascript">
  //<![CDATA[
  $("pre").each(function() {
    $(this).attr("data-clipboard-text", $(this).find("code").text());
    return new ClipboardJS("pre");
  });
  $("pre").click(function() {
    return $.notify("Kode sudah disalin", "success");
  });
  //]]>
</script>
<!-- /clipboard -->

Nah, sekarang, tinggal klik aja kode yang ada di postingan blog, dia otomatis tersalin.

Untuk contohnya, coba aja klik kode di atas.

Untuk versi 2, ini linknya: https://www.mzaini30.com/2020/05/auto-copy-paste-kode-versi-2.html

Share with your friends

8 komentar

  1. aku semakin pusing kalau baca blognya mas zen nih hehee.. harus butuh waktu khusus biar bisa sekalian praktek gt :)
    kereeenn

    BalasHapus
    Balasan
    1. Kalau aku lebih suka yang versi 2.

      Hapus
  2. Aku jadi penasaran mau belajar juga. Kayaknya seru belajat coding ya..

    BalasHapus
  3. Salut sama bang Zen yg bisa utak utik program..apalah aq yg lihat aja pusing kayak lihat tagihan bulanan 🙊🙊

    BalasHapus
    Balasan
    1. Jangan sebut kata horor itu. Hahahaha...

      Hapus
  4. Dan aku auto pusing ahahahaha

    BalasHapus
  5. Aku udah nyoba buat memahami tapi kenapa ngga paham2 ya Allaah😭

    BalasHapus

Maskot Pelarang Adblock

Hallo Kak, Perkenalkan saya Zen. Untuk bisa mengakses situs kami, terlebih dahulu matikan atau non-aktifkan ekstensi AdBlock nya yaaa...

Ok , Saya Mengerti