How to Install a new and Awesome Page loading effect on Blogspot blog - Hey guys I'm back with a new tutorial, and today with the help of this article you will learn. How you can easily Install a New and dynamic page loading effect with "Loading.." text & ".GIF" Image. This loading effect is newly designed by me and the actual work of this plugin is that, When you reload your web pages, then it will comes up on your screen and show the loading logo while the page is not loaded.
You can also read this one - "Css page loading effect for blogger". Now before you add this plugin on your own blog, make sure to take a look of this widget by clicking on the below demo button.
For those who want to install this plugin on your blog, please follow the below simple steps.
How to install On Screen Page Loading Effect?
At the first, visit to your blogger dashboard - Visit.
Go to the "Template" section and then click on the "Edit Html" button.
In template editor, add these below codes one by one.
Copy the below Css code and paste it just before ]]></b:skin> or </style>.
#cssload {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFpaILqe6xXpRNXoDK66dZYFQZmNAs8WZh7l-aTXOzJT0RaIUadfu4wtWCGx5ViYW5AcpEVsHnU-OtCg8PJ-7TdeZi_93vtIZp8snRVEfoQ7Sc4Bqi-Zi6aUomw-HU-zjUPwTEmuucifg/s1600/loading.gif) no-repeat center;background-color:rgba(0,0,0,0.16);width:100%;height:100%;position:fixed;left:0;top:0;z-index:1000;}
Copy the below JavaScript code and paste it just before </body>
<script type='text/javascript'>
//<![CDATA[
// Loader
$(window).bind("load",function(){$("#cssload").fadeOut(1e3)});
//]]>
</script>
Now add the below HTML code just after </head> or anywhere you want in your template editor :)
<div id='cssload'></div>
After that, save your template and see the magic.
That's it! I hope you like this page loading effect! Stay tuned for more cool plugins! Thanks for reading +Prince Chaudhri
0 Comment to "New (On Screen) Page Loading Effect For Blogger"
Post a Comment