Christmas tree, Santa Claus Loading and other Christmas widgets for Blogger

HaiSob apa kabar? 🙋 semoga semuanya dalam keadaan baik. Baiklah sobat pada saat postingan ini di publish adalah suasana menjelang natal dan tahun baru, dan untuk menyesuaikan dengan suasana saat ini maka saya bagikan widget dan efek loading yang bisa kamu pasang di Blog Blogger.

Berikut ini adalah widget pohon natal sederhana, efek loading blog santa claus dll, yang bisa di pasang di Blogspot Blogger. Pada demonya juga kamu bisa melihat efek salju berjatuhan dan Animasi Pure Css Merry Cristmas.

Christmas widgets for Blogger


Berikut ini adalah widget pohon natal sederhana, dan efek loading blog santa claus, Marry Christmas sound effect dan snow effect yang bisa di pasang di Blogspot Blogger. Pada demonya juga kamu bisa melihat Animasi Pure Css Merry Cristmas. Ok tertarik? Cekidot 😀  ...

Christmas tree widget for Blogger

Christmas tree widget for Blogger

Baca juga: Cara memasang video Youtube Resposnsive di 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="http://www.haisob.com" ><img src="http://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

Santa Claus Loading Blog

Baca juga: Cara membuat headline News di Blogger

Untuk membuatnya, letakan kode dibawah ini diatas </head>
<script src="http://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 </script> di kode diatas. Selanjutnya letakan kode dibawah ini dibawah <body>
<div id="load-page-seocips">
<div class="seocips">
  <img src="http://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)

Pure Css Merry Christmas

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://cdn.rawgit.com/Brando07/haisob/59f9d042/HaiSob-Jingle-Bells.mp3" />
</audio>
</div>
Save widget.

Baca juga: 2 cara memasang efek salju di Blogger

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.