Cara Memasang Loading Santa Claus Di Blog

Masih tentang tema natal. Berikut ini saya akan memberi tau cara membuat loading santa claus di blog. Agar membuat suasana blog anda terasa suasana Natalnya. Jadi loading ini cukup simpel dan tidak mempengaruhi kecepatan loading blog anda, jadi jangan ragu untuk memasangnya di blog anda masing-masing. Simak cara masang loadingnya.

1. Masuk ke akun Blogger anda

2. Pilih Template > Edit HTML

3. Cari kode </head>, lalu letakkan kode di bawah ini tepat di atas kode </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>

Nb: Jika template sudah terpasang Jquery, maka kode berwarna merah tidak perlu di pasang lagi atau anda hapus saja. Dan Jika tidak bisa di save, hapus kode penutup </script> di kode bagian atas.

4. Selanjutnya letakkan kode di bawah ini tepat di bagian bawah </body>

<div id="load-page-seocips"><div class="seocips">  <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOqhQKBHChyphenhyphenjZYqpgw7ocFjXnoQbmtdMOQsQhNuFFDEFJ457gudWh6HDJsa8va55ckNzT4UMaXiXc1SU3cDxsiSWpNCPmElqZ-RIScPmHjRucI_R9WbfVL_wiGwzLR6qesLLbwZFmmnfY/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>

5. Lalu Save Template

Sumber : www.pacetips.com

Tweet