Cara Membuat Tombol Donasi Keren di Blog
Arsipbiru.com - Mendapatkan penghasilan dari ngeblog memang membutuhkan perjuangan yang hebat. Mengorbankan banyak waktu, pikiran dan tenaga, agar blog kita tampil bagus dan nyaman untuk dikunjungi. Selain itu, kita juga harus mengisi blog kita dengan berbagai artikel yang menarik, bukan hasil copy paste blog lain. Sebab hal tersebut akan berpengaruh pada saat kita mendaftarkan AdSense untuk dimonetisasi.
Namun, hal tersebut tentu masih membutuhkan perjuangan lagi. Karena blog yang kita daftarkan AdSense belum tentu bisa dimonetisasi pada hari itu juga. Pihak Google AdSense akan mereview blog kita, apakah sudah layak dimonetisasi atau belum. Tentunya dalam mereview suatu blog, pihak Google AdSense membutuhkan waktu yang cukup lama. Ketika selesai, pihak Google AdSense akan mengirimkan surat pemberitahuan melalui email, baik pemberitahuan siap dimonetisasi maupun belum.
Bagi Anda yang blognya belum bisa dimonetisasi atau ingin menambah penghasilan, Anda dapat memasang tombol donasi di blog. Fungsi tombol donasi tidak lain adalah agar Anda mendapatkan penghasilan tambahan guna membiayai operasional blogging Anda. Anda dapat memasang tombol donasi via Paypal, Saweria, atau platform lainnya.
Untuk dapat memasang tombol donasi di blog, Anda harus memiliki akun Paypal atau Saweria atau platform lainnya terlebih dahulu. Karena jika belum, Anda belum bisa mengikuti tutorial dengan baik kali ini. Adapun fungsi akun Paypal dan kawan-kawan adalah untuk menampung dana dari donasi yang diberikan oleh pengunjung.
Paypal dan kawan-kawan merupakan suatu situs yang memiliki sistem pembayaran dalam bentuk elektronik yang menggantikan transaksi konvensional. Dengan memiliki akun tersebut, Anda sudah memiliki rekening online yang dapat Anda gunakan sesuai dengan keinginan Anda.
Pada kesempatan kali ini, saya akan membagikan tutorial mengenai bagaimana cara membuat tombol donasi keren di blog. Tutorial yang saya bagikan kali ini, saya dapatkan setelah blogwalking ke blognya Mas Subhan. Jadi, jika Anda tertarik, silahkan ikuti langkah-langkah berikut ini.
Cara Membuat Tombol Donasi Keren di Blog
1. Pertama, masuk ke akun Blogger masing-masing.
2. Selanjutnya, pilih Tata Letak > klik Tambahkan Gadget (letakkan di bawah postingan atau lainnya sesuai selera) > klik HTML/Javascript.
3. Salin dan tempelkan kode berikut ini ke kolom HTML/Javascript.
<style>
.pscom{
background: linear-gradient(45deg, #f22613, #f89406, #26a65b, #5868ec, #f54e80, #f7ca18, #d2527f);
background-size: 500% 500%;
-webkit-animation: pscom 12s ease infinite;
-moz-animation: pscom 12s ease infinite;
animation: pscom 12s ease infinite;
}
@-webkit-keyframes pscom {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
@-moz-keyframes pscom {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
@keyframes pscom {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
</style>
<style>
.penasharingDonasi { /* Warna Background */
color:#ffffff;
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;}
.penasharingDonasi .ikon a {background-color:#ffffff; /* Warna Ikon */
color:#c10e0e;
text-decoration:none; display:block; padding:5px; border-radius:7px; text-align:center; -webkit-animation:penasharingBounce 1s linear 1s infinite normal; animation:penasharingBounce 1s linear 1s infinite normal}
.penasharingDonasi svg {width:50px; height:50px}
.penasharingDonasi svg path {fill:#c10e0e}
.penasharingDonasi .ikon {margin-right:15px}
.penasharingDonasi .deskripsi {line-height:1.5em;}
.penasharingDonasi .deskripsi .judul {font-size:18px; font-weight:bold; display:block; margin-bottom:10px;}
@keyframes penasharingBounce{0%,100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}
40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}
50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}
65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}
75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}
}
@-webkit-keyframes penasharingBounce{0%,100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}
40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}
50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}
65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}
75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}
}
</style>
<!-- Paypal Donation Box Bounce-->
<div class='penasharingDonasi pscom'>
<div class='ikon'>
<a href='########?locale.x=id_ID' 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='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'/></path></svg>
<span>KLIK</span>
</a>
</div>
<div class='deskripsi'>
<span class='judul'>DONASI VIA PAYPAL</span>
Yuk Donasi ke Blog ini, Bantu berikan donasi jika dirasa blog ini bermanfaat. Donasi akan kita gunakan untuk membiayai seluruh kebutuhan blog ini, salah satunya adalah untuk menggaji penulis kita. Terima kasih telah mempercayakan <b><i>www.Your Blog.com </i></b>. Terima kasih :)
</div>
</div>Ganti tanda pagar dengan URL Paypal Anda atau URL Saweria atau URL donasi lainnya.
Jika Anda menggunakan Paypal, abaikan tulisan "DONASI VIA PAYPAL". Namun, jika Anda menggunakan platform lain, Anda dapat mengubahnya sesuai dengan platform yang Anda gunakan.
Untuk deskripsi, dapat Anda ganti sesuai dengan keinginan Anda.
Posting Komentar