How to setup fade out effect into blogger - As you guys already know there is too many effects and widgets are available on the web to make your blog stylish, And at this present time every blogger wants to make his blog cool with the help of some effects and widgets. So today we are going to learn how we can easily set up a fade out page loading effect into blogger. (Remember - The fade out effect will work only on the main index/home page and static pages.) If you want to add this effect into your own blog then follow the below simple steps.
How To Install Fade Out Page Loading Effect?
First go to your blogger dashboard with the help of this link - Visit
Now go to "Template" section and then click on "EDIT HTML" button.
After that, In the template editor find the below code by pressing the "Ctrl + F" key at the same time.
</body>
Now copy the below jQuery script and paste it just before </body>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
//<![CDATA[
// Fade Out Effect
$(document).ready(function(){function n(){window.location=linkLocation}$("body").css("z-index","-10"),$("body").fadeIn(5e3),$("a").click(function(o){o.preventDefault(),linkLocation=this.href,$("body").fadeOut(1e3,n)})});
//]]>
</script>
</b:if>
</b:if>
After that hit on orange save template button to apply this effect.
If you are facing any kind of problem, then ask me via the comment section.
That's it! I hope you are enjoying this effect on your blog! Stay tuned for more blogger widgets! Thanks for reading @Prince.
0 Comment to "Add Fade Out Effect In Blogger"
Post a Comment