Langkah pertama backup template untuk jaga-jaga kalau ada kesalahan. Buka Blogger > login > Dasbor > Template > Edit HTML > centang Expand Template Widget, letakkan code dibawah ini dibawah <body>
<div id='loading-overlay'>Loading...</div>Temukan kode ]]></b:skin> letakkan kode berikut diatasnya
#loading-overlay { width:100%; height:100%; position:fixed !important; position:absolute; /* IE6 Fallback */ top:0; right:0; bottom:0; left:0; z-index:999999; background:#3A3A3A url('http://3.bp.blogspot.com/-_ONDmjNBMJs/TwPCL3AdlII/AAAAAAAAB4c/02MboPkAHGg/s1600/layer_loading.gif') no-repeat 50% 50%; font:normal normal 0/0 a; color:transparent; text-shadow:none; }Anda bisa mengubah gambar loading yang berwarna merah dengan gambar loading lain.
Sebelum penutup </head> tambahkan kode berikut
<script type="text/javascript">$(window).bind("load", function() { $('#loading-overlay').fadeOut(); });</script><noscript> <style type='text/css'> #loading-overlay {display:none} </style> </noscript><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script>Kode berwarna biru bisa dihapus jika didalam template telah ada.
Klik pratinjau, bila sudah berhasil maka simpan template Anda.
Sekian artikel Membuat Tampilan Loading Sebelum Blog Terbuka semoga bermanfaat.
Tidak ada komentar:
Posting Komentar