Pamula merupakan tema personal yang saya desain dengan beberapa referensi, Tema ini dibuat clean dan elegant untuk membuat lebeih fresh serta memaksimalkan fitur dari fungsi blogger agar dapat meminimalisir penggunaan javascript atau json blogger. Tema ini memiliki kecepatan super cepat seperti tema-tema yang saya share sebelumnya, tapi pada tema yang saya buat sekarang terus menggunakan fungsi javascript dan tidak ada jQuery di dalamnya. Kemungkinan kalian tidak akan paham karena terbiasa dengan jQuery. Pada tema ini kalian akan mendapatkan beberapa fitur menarik seperti : Kecepatan Loading Super Ngebut Dengan memiliki loading yang cepat pasti dapat membuat pengunjung menjadi lebih betah sebab tidak perlu cari Artikel serupa meskipun yang disebabkan oleh loading lambat. Saya sudah mencoba untuk mengetest kecepatan dengan bantuan dari GTmetrix dan Pagespeed. Untuk melihat hasilnya bisa cek gambar berikut: Kecepatan loading ini sudah saya test sendiri menggunak
Tombol donasi ini sangat diperlukan apalagi kalian ingin mendapatkan suatu donasi dari pengunjung atau viewer tentu dari segi tampilan juga harus disesuaikan pada kali ini saya hanya meniru tampilan situs igniel untuk tombol donasinya menggunakan Fontawesome dan animated css.
Copy kode css di bawah dan paste tepat di dalam <style> atau <b:skin>
Tombol donasi diatas merupakan hasil redesain saja dari tombol Igniel.com jadi bila ingin yang sama kalian bisa cek artikel dari blog igniel.
Sumber : https://www.igniel.com/2019/06/kotak-donasi-paypal.html
Membuat Tombol Donasi
Copy kode css di bawah dan paste tepat di dalam <style> atau <b:skin>
#donasi{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;align-items:center;flex-wrap:nowrap;justify-content:center;margin-top:20px;background:lightblue;color:#666666;padding:15px;overflow:hidden;transition:all .3s ease;border-radius:10px;}
.logo{margin-right:15px;}
.logo i{font-size:50px;color: lightblue}
.bounce{display:block;background:#4d90fe;border:1px solid #3079ed;color:#fff!important;font-weight:500;font-size:16px;margin:0;padding:5px;text-align:center;border-radius:3px;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
.bounce{-webkit-animation:bounce 1s linear 1s infinite normal;animation:bounce 1s linear 1s infinite normal;}
.kata{line-height:24px;}
.kata span{font-size:18px;font-weight:500;display:block;}
@keyframes bounce{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 bounce{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);}}
Copy kode html di bawah dan taruh seterah kalian <div id="donasi">
<div class="logo">
<a class='bounce' href="http://">
<i class="fa fa-heart"></i><br>
<span>Klik</span>
</a>
</div>
<div class="kata">
<span class="judul">Donasi Via Paypal</span>
Bantu berikan donasi jika artikelnya dirasa bermanfaat. Donasi akan digunakan untuk memperpanjang domain
<b>Pintarsaurus</b>. Terimakasih.
</div>
</div>
Tombol donasi diatas merupakan hasil redesain saja dari tombol Igniel.com jadi bila ingin yang sama kalian bisa cek artikel dari blog igniel.
Sumber : https://www.igniel.com/2019/06/kotak-donasi-paypal.html
Comments
Post a Comment
To insert a code use <i rel="pre">code_here</i>To insert a quote use <b rel="quote">your_qoute</b>To insert a picture use <i rel="image">url_image_here</i>To insert a video use <i rel="video">video</i>Tinggalkan komentar sesuai topik tulisan, komentar dengan link aktif tidak akan ditampilkan. Admin dan penulis blog mempunyai hak untuk menampilkan, menghapus, menandai spam, pada komentar yang dikirim.