Cara Membuat Widget Donasi Via PayPal dengan Mudah

Cara Membuat Widget Donasi Via PayPal dengan Mudah
Daftar Isi Artikel
Membuat Widget Donasi PayPal

Membuat Widget Donasi Via PayPal - Selain melalui Adsense, anda juga bisa memperoleh penghasilan dari blog dengan memasang widget donasi. Dengan menggunakan widget donasi, para donatur ataupun pelanggan setia blog anda akan dengan mudah membantu memberikan donasi seikhlasnya untuk keperluan blog anda.

Nah, cara ini cocok untuk anda yang ingin menyediakan kotak donasi via paypal di blog anda. Sebelum kalian memasang widget ini, pastikan kalian sudah memiliki akun PayPal. Jika belum, kalian bisa pergi ke https://www.paypal.me untuk mendaftar, dan ikuti langkah-langkahnya. Setelah itu buat tautan menuju akun anda.

Memasang Widget Donasi PayPal

Membuat Kotak Donasi Via PayPal

Setelah berhasil mendaftar PayPal.Me lakukan langkah-langkah berikut ini untuk memasang widget donasi.
  • Pergi ke dashboard akun Blogger dan buka Pengaturan Template.
  • Simpan kode CSS berikut tepat DI ATAS </style> atau ]]></b:skin>.
    <style type="text/css">
    .roDonasi {background:#383838; /* warna background */
        color:#000; justify-content:left; margin:20px 0px; display:flex; padding:15px; overflow:hidden; border-radius:4px;}
    .roDonasi .ikon a {background-color:#008c5f; /* warna ikon */
           color:#fff; text-decoration:none; display:block; padding:5px; border-radius:7px; text-align:center;}
    .roDonasi svg {width:50px; height:50px}
    .roDonasi svg path {fill:#bde0b9}
    .roDonasi .ikon {margin-right:15px}
    .roDonasi .deskripsi {line-height:1.5em; color: white;} 
    .roDonasi .deskripsi .judul {font-size:17px; font-weight:bold; display:block; margin-bottom:7px; color: white;}
    </style>
    
  • Lalu simpan kode HTML ini di bagian Widget > HTML/JavaScript.
    <!--Kotak Donasi PayPal-->
    <div class='roDonasi'>
      <div class='ikon'>
        <a href='https://www.paypal.me/xxxx' onclick='window.open(this.href,"toolbar=0,status=0,width=800,height=600");return false;' title='Klik Untuk Donasi via Paypal'>
          <svg viewbox='0 0 24 24'><path d='M8.32,21.97C8.21,21.92 8.08,21.76 8.06,21.65C8.03,21.5 8,21.76 8.66,17.56C9.26,13.76 9.25,13.82 9.33,13.71C9.46,13.54 9.44,13.54 10.94,13.53C12.26,13.5 12.54,13.5 13.13,13.41C16.38,12.96 18.39,11.05 19.09,7.75C19.13,7.53 19.17,7.34 19.18,7.34C19.18,7.33 19.25,7.38 19.33,7.44C20.36,8.22 20.71,9.66 20.32,11.58C19.86,13.87 18.64,15.39 16.74,16.04C15.93,16.32 15.25,16.43 14.05,16.46C13.25,16.5 13.23,16.5 13,16.65C12.83,16.82 12.84,16.79 12.45,19.2C12.18,20.9 12.08,21.45 12.04,21.55C11.97,21.71 11.83,21.85 11.67,21.93L11.56,22H10C8.71,22 8.38,22 8.32,21.97V21.97M3.82,19.74C3.63,19.64 3.5,19.47 3.5,19.27C3.5,19 6.11,2.68 6.18,2.5C6.27,2.32 6.5,2.13 6.68,2.06L6.83,2H10.36C14.27,2 14.12,2 15,2.2C17.62,2.75 18.82,4.5 18.37,7.13C17.87,10.06 16.39,11.8 13.87,12.43C13,12.64 12.39,12.7 10.73,12.7C9.42,12.7 9.32,12.71 9.06,12.85C8.8,13 8.59,13.27 8.5,13.6C8.46,13.67 8.23,15.07 7.97,16.7C7.71,18.33 7.5,19.69 7.5,19.72L7.47,19.78H5.69C4.11,19.78 3.89,19.78 3.82,19.74V19.74Z'/></svg>
        </a>
      </div>
      <div class='deskripsi'>
        <span class='judul'>DONASI VIA PAYPAL</span>
        Tulis Deskripsi disini.
      </div>
    </div>
    
  • Langkah terakhir, simpan template
NOTE: Jika kalian ingin memasang di bagian bawah postingan simpan kode HTML di atas tepat DI BAWAH <data:post.body/>.
Kotak donasi ini sangat ringan karena menggunakan gambar SVG. Jika anda menginginkan Donasi via lain anda bisa mengganti gambar dan link dengan Bitcoin, OVO, Pulsa, dll.
Referensi: https://www.igniel.com

  1. Untuk membuat judul komentar, gunakan <i rel="h2">Judul Komentar</i>
  2. Untuk membuat kotak catatan, <i rel="quote">catatan</i>
  3. Untuk membuat teks stabilo, <i rel="mark">mark</i>
  4. Untuk membuat teks mono, <i rel="kbd">kbd</i>
  5. Untuk membuat kode singkat, <i rel="code">shorcode</i>
  6. Untuk membuat kode panjang, <i rel="pre"><i rel="code">potongan kode</i></i>
  7. Untuk membuat teks tebal, <strong>tebal</strong> atau <b>tebal</b>
  8. Untuk membuat teks miring, <em>miring</em> atau <i>miring</i>

Konten Unggulan