Skip to content Skip to sidebar Skip to footer

Cara Membuat Kotak Donasi Dana di Blog


Cara Membuat Kotak Donasi Dana di Blog
AmbyarBlog - Apa kabar? Dalam kesempatan kali kini saya akan berbagi tutorial Cara Membuat Kotak Donasi Dana di Blog. Tampilannya seperti kotak donasi yang saya pakai.


Sebelum pembuatannya, terlebih dahulu anda harus mempunyai akun dana, supaya kotak ini berfungsi dengan semestinya.

Cara Membuat Kotak Donasi Dana di Blog

  • Setelah membuat akun dana, buka dashboard akun Blogger dan buka pengaturan Tema atau Template.
  • Simpan kode CSS berikut, Di Atas kode ]]></b:skin> atau </style>.

.ambyarDonasi {background:#b9cee0; /* warna background */
  color:#000;
  display:-webkit-box; display:-webkit-flex; display:-moz-box; display:-ms-flexbox; display:flex; align-items:flex-start; flex-wrap:nowrap; justify-content:center; margin:20px 0px; display:flex; padding:15px; overflow:hidden; transition:all .3s ease; border-radius:7px;}
.ambyarDonasi .ikon a {background-color:#0066a6; /* warna ikon */
  color:#fff;
  text-decoration:none; display:block; padding:5px; border-radius:7px; text-align:center; -webkit-animation:ignielBounce 1s linear 1s infinite normal; animation:ignielBounce 1s linear 1s infinite normal}
.ambyarDonasi svg {width:50px; height:50px}
.ambyarDonasi svg path {fill:#b9cee0}
.ambyarDonasi .ikon {margin-right:15px}
.ambyarDonasi .deskripsi {line-height:1.5em;} 
.ambyarDonasi .deskripsi .judul {font-size:18px; font-weight:bold; display:block; margin-bottom:10px;}
  • Simpan kode HTML berikut tepat dibawah <data:post.body/>.

<div class='ambyarDonasi'>
  <div class='ikon'>
    <a href='https://link.dana.id/' onclick='window.open(this.href,&quot;toolbar=0,status=0,width=800,height=600&quot;);return false;' title='Klik Untuk Donasi via Dana'>
      <svg viewbox='0 0 24 24'><path d='M12,21.35L10.55,20.03C5.4,15.36 2,12.27 2,8.5C2,5.41 4.42,3 7.5,3C9.24,3 10.91,3.81 12,5.08C13.09,3.81 14.76,3 16.5,3C19.58,3 22,5.41 22,8.5C22,12.27 18.6,15.36 13.45,20.03L12,21.35Z'/></svg>
      <span>KLIK</span>
    </a>
  </div>
  <div class='deskripsi'>
    <span class='judul'>DONASI VIA DANA</span>
    Bantu berikan donasi jika artikelnya dirasa bermanfaat. Donasi akan digunakan untuk mengembangkan blog ini. Terima kasih.
  </div>
</div>
Keterangan:
Jangan lupa untuk mengganti URL link dan ubah tulisan berwarna merah sesuai kenginan anda.
Kotak donasi ini sangat ringan, tidak akan mengurangi kecepatan blog anda.

Penutup

Itulah Cara Membuat Kotak Donasi Dana di Blog. Anda bisa mengganti link donasinya dengan Pulsa, Paypel, Bitcoin atau lainnya.

Sampai disini dulu, bila ada yang ingin ditanyakan silahkan komen dan jangan lupa share ke teman anda. Selamat mencoba, sekian dan terima kasih.

Post a Comment for "Cara Membuat Kotak Donasi Dana di Blog"

close