Christmas tree, Santa Claus Loading and other Christmas widgets for Blogger
Ditulis oleh: Ditulis pada: April 15, 2022
Berikut ini adalah widget pohon natal sederhana dan efek loading blog santa claus yang bisa di pasang di Blogspot Blogger. Pada demonya juga kamu bisa melihat efek salju berjatuhan dan Animasi Pure Css Merry Cristmas. Ok tertarik? Cekidot…
Christmas tree widget for Blogger
Untuk membuatnya kamu cukup memasukan kode dibawah ini ke dalama widget HTML/JavaScript di Blog Blogger kamu.
<style>
.pohon-natal {margin:0;padding:0;text-align:center;position:fixed;bottom:3px;left:3px;z-index:9999;}
</style>
<div class=”pohon-natal”>
<a href=”https://www.anisuka.com/2022/04/christmas-tree-widget-and-santa-claus-loader-widget-for-Blogger.html” ><img src=”https://4.bp.blogspot.com/-f-514olpdUk/Vl6QWdw99ZI/AAAAAAAAFwE/Zi2CW4eAPBs/s230/animated-christmas-tree-seocips.gif” title=”animated christmas tree seocips” alt=”animated christmas tree seocips” /></a>
</div>
Save Widget
Santa Claus Loading Blog
Untuk membuatnya, letakan kode dibawah ini diatas
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js” type=”text/javascript”></script>
<script src=”https://cdn.rawgit.com/Brando07/share/newbe/new-seocips-LP.js” type=”text/javascript”></script>
<style>
#load-page-seocips { width:100%; height:100%; position:fixed; left:0; top:0; z-index:+100000; overflow:hidden; text-align:center; background:#fff; }
.seocips { position:absolute; width:100%; margin:0 auto; text-align:center; padding:200px 0; color:#de2f32; font-family:Verdana; font-size:1.5em; }
.seocips span { animation:crecer 3s infinite; }
.seocips span:nth-child(2) { animation-delay:0.37s; }
.seocips span:nth-child(3) { animation-delay:0.74s; }
.seocips span:nth-child(4) { animation-delay:1.11s; }
.seocips span:nth-child(5) { animation-delay:1.48s; }
.seocips span:nth-child(6) { animation-delay:1.85s; }
.seocips span:nth-child(7) { animation-delay:2.22s; }
.seocips span:nth-child(8) { animation-delay:2.59s; }
.seocips img { border-radius:20px; padding:5px; }
@keyframes crecer {
0% { font-size:1em; } 50% { font-size:1.8em; } 100% { font-size:1em; }}
</style>
Jika pada template sudah terpasang Jquery (warna merah) diatas, maka kode itu tidak usah dipasang lagi, atau ganti dengan Jquery versi terbaru. Jika tidak bisa di save, hapus kode penutup
<div id=”load-page-seocips”>
<div class=”seocips”>
<img src=”https://1.bp.blogspot.com/-qP1QWr9YNFc/Vl6b7G4ml4I/AAAAAAAAFwU/pzbqgG4N9Ls/s1600/santaclaus-loading-animation.GIF”><br>
<span>L</span>
<span>O</span>
<span>A</span>
<span>D</span>
<span>I</span>
<span>N</span>
<span>G</span>
</div>
</div>
Save template
Pure Css Merry Christmas (ComingSoon)
Merry Christmas Sound Effect
Untuk membuat efek suara “Merry Christmas” kamu cukup memasukan kode dibawah ini ke dalam widget HTML/JavaScript di Blog Blogger kamu.
<div style=”display:none;”>
<audio controls autoplay>
<source src=”https://sites.google.com/site/socipshotmusic/musicdjseocips/Anisuka-Merry-Christmas.mp3″ />
</audio>
</div>
Save widget.
Snow Effect
Untuk menambahkan efek salju tambahkan/masukan kode dibawah kedalam template blog atau bisa juga kedalam widget HTML/JavaScript.
<script src=”https://cdn.rawgit.com/Brando07/share/newbe/efek-salju-seocips.js” type=”text/javascript”></script>
Save widget.
Nah sekian selamat menggunakan bagi kamu yang ingin menggunakannya. Semoga bermanfaat.
