Cara Membuat Efek Loading Rubik Pada Blog

Pada kesempatan kali ini, akan saya share sebuah tutorial bagaimana cara membuat efek loading blog yang menarik dengan efek rubik. Membuat loading blog dengan efek rubrik ini, akan membuat tampilan blog semakin menarik dan tentunya para pengunjung yang datang ke blog sobat akan betah berlama lama.

jika sobat tertarik untuk memberikan efek rubrik yang mengacak pada blog, berikut tutorialnya:

1.Sobat masuk terlebih dahulu pada blog sobat.
2. Pada dasbor blogger, klik menu Template.

3. Selanjutnya di dalam menu Template, klik Edit HTML.

4. Carilah kode </head> untuk mempermudah pencarian, klik CTRL + F pada keyboard
5. Setelah kode </head> di temukan, letakkan kode di bawah ini tepat berada di atas kode </head>

<style>
/* loader http://dherma-technology.blogspot.com/*/
#SEO BLOG-load {
position: fixed;
z-index: 50;
top: 0; left: 0;
opacity: 0.9;
width: 100%; height: 100%;
background: #FDFEF8 url(http://3.bp.blogspot.com/-WqA4mLrQVsw/U4COhzzQi2I/AAAAAAAABrw/57-G3Pw25ek/s128-no/Loading.gif) no-repeat center;
line-height: 350px;
text-align: center;
font-size: 36px;
color: #353231;
text-indent: -9999px;
}
.MD #SEO BLOG-load { display: none; }
@media only screen and (device-width: 768px) {
#loading {
position:absolute;
width:1040px;
min-height:768px;
}
}
#SEO BLOG-progbar {
position: absolute;
top: 0; left: 0;
background: #ED0000;
opacity: 0.8;
width: 0;
height: 5px;
}
#md-loader {
height: 100%;
display: none;
}
</style>
<script>
(function($){
$("html").removeClass("MD");
$("#header").ready(function(){ $("#bingangbingung-progbar").stop().animate({ width: "25%" },1500) });
$("#footer").ready(function(){ $("#bingangbingung-progbar").stop().animate({ width: "75%" },1500) });
$(window).load(function(){
$("#bingangbingung-progbar").stop().animate({ width: "100%" },600,function(){
$("#bingangbingung-load").fadeOut("fast",function(){ $(this).remove(); });
});
});
})(jQuery);
</script>

6. Selanjutnya, masih di dalam Edit HTML, carilah kode <head>
7. Setelah kode <head> ditemukan, masukkan kode di bawah ini tepat di bawah kode <head>