Animated Loading Blog

Animated loading blog page is loading icon when you open a blog page. How to put it in the template.
1. Go to template > Edit html> place the following code above the </body>

<style>
#ash-page-loader{position:fixed!important; top:0; right:0; bottom:0; left:0; z-index:9999; background:#fff url('http://sl.glitter-graphics.net/pub/677/677182xv7ft7yu0d.gif') no-repeat 50% 30%; color:#FFF; display:none; font:0/0 a; text-shadow:none; padding:1em 1.2em}
</style>
<script type='text/javascript'>
$(document.body).append('<div id="ash-page-loader">Loading...</div>');$(window).on("beforeunload",function(){$("#ash-page-loader").fadeIn(1e3).delay(6e3).fadeOut(1e3)})
</script>

Loading animated images that you can use: