Shining Multi Color page loading effect for Blogger

Many blog using page loading effect to makeup the loading time of blog pages. This effect generally hide the page loading delay. If your blog is slower to load then visitors often feel annoy and may leave your site. Eventually they would not return in future. There are many tricks to making your blog faster but beside of this you can adopt this trick to display a loading effect of your blog or website thus your visitors don't feel upset. Previously I has released a simple page loading animation effect for blogger. But I have brought revolutionary changes in this version. You would see the loading effect with multiple shining color effect on this widget. It will definitely change the visitors impression towards your blog. More importantly this widget made with pure CSS and only one loading image has used but it load faster. And I have used same beforeunload trick in this loading effect. To install this just follow the below simple steps.

Step 1 Log in to your Blogger Account and Click on Template  ->

Step 2 Now click on Edit HTML-> Unfold code  ►

Step 3 Now find ]]></b:skin> by Pressing  Ctrl + F

Step 4 And Paste the below code above ]]></b:skin> 

#BloggerSpiceloader{  position:fixed !important;   position:absolute;   top:0;   right:0;   bottom:0;   left:0;   z-index:9999;   background:#000 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCHAQXDVrvZTrztI3p_d6HrjdKhn2CAmr4ofZICqeUMBVMQwtwlCsPXUwgGQlyPD1PXlzXHlinjuTVq1b2xiAdW1wh2k0YHHapKYkaEvAk1EaDg8ora6J0Oln9yilD29dt7KEa-_f3-Bbr/s1600/BS+loading.gif') no-repeat 50% 50%;  color:white;  padding:1em 1.2em;  display:none}

<script type='text/javascript'>
//<![CDATA[
// Trick by www.bloggerspice.com
$(document.body).append('<div id="BloggerSpiceloader"></div>');
$(window).on("beforeunload", function() {
    $('#BloggerSpiceloader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>