
Features of Page Loading Effects
- It will don't ruin your blog's SEO. Because! This is a SEO friendly plugin with no first time appearing.
- It comes with easy editing. Means no encrypted coding so you can change loader image etc.
- It is a cross-browser plugin. It means this will work on all internet browsers.
- It will make your bounce rate at low rate. Because your visitor will visit your blog again and again "Surely"
- It will detect devices, so you don't have to worry about mobiles visitors.
How to Add Loading Effects in Blogger?
Here's my fastest tutorial for adding laziest page loader in blogger blogs. Do the following steps accordingly and get a boost of pro-vines on your blog.1. Go to your Blogger dashboard select your desired blog
2. Navigate to Template and than click on Edit HTML button
3. Click anywhere in coding and press Ctrl + F a search bar will appear
4. Now search </head> tag in your template and just above it paste below line of coding
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>5. Now search for </body> tag and above/before it paste below coding.
<style>
#ABT-Page-Loding-Effect {
position: fixed!important;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
background:#000000 url('http://4.bp.blogspot.com/-ikwt7NU4_RM/VWmmN3PTwJI/AAAAAAAAFiQ/ripWVV-afL4/s1600/Custom-loader-ABT.gif') no-repeat 51% 31%;
color: #FFFFFF;
display: none;
font: 0/0 a;
text-shadow: none;
padding: 1.0em 1.3em;
opacity: 0.5;}
</style>Customizations: You can customize it as any way you want. You can change loader image by replacing Bold link from above coding. If your loading effect not appears on your blog than try to avoid 4th step.
<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="ABT-Page-Loding-Effect">Loading...</div>');
$(window).on("beforeunload", function() {
// ... Show the Animation `.fadeIn()`
$('#ABT-Page-Loding-Effect').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>
- Freebie: Get 10+ Page loading effect Images and try them on your blog free of cost. Download Now
This comment has been removed by a blog administrator.
ReplyDeletenice widget.. i love to try it
ReplyDeleteGlad you like it :)
DeleteThanks for commenting!