Cara Membuat Animasi Login Di Blog

Jumat, 06 September 2013

Cara Membuat Animasi Login Di Blog - Kembali lagi untuk memberikan sedikit artikel tetapi artikel ini masih membahas tentang dunia blogger yaitu cara membuat animasi login di blog. Mempunyai / membuat login di blog efeknya sangat indah dan lebih minimalis dilihatnya, website-website yang mempunyai login / sigin ini sangat banyak salah satunya yaitu facebook. Pemasangan animasi login ini tidak susah-susah untuk membuka atau membuat data base lagi tapi bisa kita buat lewat animasi serta tidak membutuhkan waktu yang lama dan tidak terlalu besar kapasitasnya. Widget login ini hanya tampil ketika halaman website atau blog anda di buka (diakses) serta tidak terlalu lama mungkin hanya 20 detik saja. Langsung ke titik pembicaraan, berikut tur-tur atau cara-cara memasang widget animasi login di blog.

1. Masuk ke blogger.
2. Dari dasbor, langsung pilih ke template.
3. Pilih edit html.
4. Cari kode </body>
5. Setelah dicari, copy kode dibawah ini dan tempelkan diatas kode tadi.

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<div id='animasi-loginSM' style='position:fixed;z-index:9001;background:transparent;height:100%;width:100%;left:0;top:0;'>
<script type='text/javascript'>
// ----- Gambar Ukuran 28 x 28 Pixel -----
var Gambar_Login_Anda ='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp3f1y9Ie5BthsHAHI0we8vQUVpSUfg1-bIZBc7oUk-fT3JlIvwx_bNuLEUHRL6-TuyXzf5XlDRR2Ny7iNshSJkR-nOYVB2vcPhmxOtmdVrT9YFnkLBu4KCTdUMXPBjvdBYCvGuCvT-mI/s28/Shutdown.png',
Nama_Login_Anda = 'Laba-Laba Blog';
</script>
<script src='http://not-remove-admin-3.googlecode.com/files/animasi-login3.js' type='text/javascript'></script>
</div>
<div id='animasi-munyer1' style='position:fixed;z-index:9000;background:black;height:55%;width:100%;left:0;top:0;'></div>
<div id='animasi-munyer2' style='position:fixed;z-index:9000;background:black;height:55%;width:100%;left:0;bottom:0;'></div>
<div id='animasi-munyer3' style='position:fixed;z-index:9000;background:black;height:100%;width:55%;left:0;top:0;'></div>
<div id='animasi-munyer4' style='position:fixed;z-index:9000;background:black;height:100%;width:55%;right:0;bottom:0;'></div>

<b:else/>
</b:if>

6. Simpan dan lihat hasilnya.

Catatan: tulisan yang berwarna merah bisa anda ganti dengan nama website anda masing-masing