Welcome To "Softway RKO" !

What You Can Get in Softway RKO?

We provide the tutorials, guides, articles, tricks and tips about Blogger, Blogging, SEO Tips, Basic Tips For New Bloggers, Making Money Online, Widgets, Templates and many more resources. All this is just for free! You can Sign Up to get updated for Latest Posts.

Saturday, May 31, 2014

Filled Under:
,

Animated Page Loading Screen for Blogger


HTML tutorial

Click Below Ad for Leaning Blogging Tricks.

Next Blogger Tricks


Every Bloggers wants his look best other than his competitor blogs we add more professionals things n your blog like me today i will a script for lading screen in blog and i can activate this in my blog tou can click any link of my blog then you have seen loading screen. Click this below given link and you have seen this plugin's demo.
Also Read:-Blogger Yard Style Blogger Template Download

This script like a microsoft powerpoint presentaion animation {PPT} once you can this script in your blog then your blog are fully changed than old boring blog if you want to add this loading screen in your blog follow my instructions
How To Animated Page Loading Screen for Blogger:-

  • Go to Blogger Dashboard>>Template>>Edit HTML:
  • Find this tag </body>
  • Paste the below given code before  </body>

<!--code by  http://softwayrko.blogspot.com -->
<style>
#abt-page-loader {
        position: fixed!important;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9999;
        background:#000 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQw3qJ-Exs1c5m73WhwNxiWrHZnTMe8dS8lVd8_NKIGrbjaB6k_QkAnVRmA9CSnvTsM17-okTgLlReXCO3zSw6tIQxdeJjmIwefVmk__-X-tanLdi24aEe2RDHbABrIv53lN6R42CelrY/s200/load6.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'>
//<![CDATA[
$(document.body).append('<div id="abt-page-loader">Loading...</div>');
$(window).on("beforeunload", function() {
    // ... Show the Animation `.fadeIn()`
    $('#abt-page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>
  • And Click on Save Template
  • Finish Enjoy!
Note: before editing your template make a backup of your template.
Final Words
I Hope you add this new animated loading screen page in your blog if you are getting error during this process write your problems in comments box and don't forget like our Facebook Page thaks.


0 blogger-facebook:

Comment here

 
  • Home
  • About Us
  • Contact Us
  • Sitemap
  • Privacy Policy
  • Back To Top