A very common effect in jQuery is the fade effect that hides or shows an element by fading it, and we can use it in many ways as for example in the blog's navigation. The following script does just that, by loading the page with a fading effect when we browse on internal links that are in the blog, such as post titles, labels links, archive, navigation links, etc..
You can see an example in this
demo blog, click on the title of any post and see the fading effect when the page is loading.
How To Implement the Fade In Loading Effect
1) To put this fading effect on your blog, go to your
Template >
Edit HTML :
2) Click anywhere inside the code area and search for the
</head> tag using CTRL + F keys:
3) Then, just above
</head> add the following code:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
$("body").css("z-index", "-10");
$("body").fadeIn(0);
$("a").click(function(event){
event.preventDefault();
linkLocation = this.href;
$("body").fadeOut(500, redirectPage); });
function redirectPage() {
window.location = linkLocation;
}
});
//]]>
</script>
<style>
html {
background-color: #F2F2F2; /* Color fading */
}
</style>
4) Save the changes and that's it. In green you can see where to change the color that fades on a loading page.
The original script hides the body of the page while loading, I prefer to change that property with a negative z-index to avoid problems with the search engine robots that may effect the positioning.
Problems?Consider that such effects could increase the blog loading time, so I recommend using it only when your blog loads fast and does not have too many scripts.
If you already use another version of jQuery remove the other, leaving only this which will be readed first.
If you are using Mootools or Scriptaculous, then you have to make some modifications to the code in order to be compatible.
If you have another script with a fade effect, then it could interfere with this and you might not see anything on the page except the color fading, in such cases it is better without this script.
You can also use this effect only on some links, for example, if you want to appear only when you click on the post titles in the navigation links (older posts and newer posts), and on the top tabs, then replace this line:
$("a").click(function(event){
With this:
$(".post-title a, .blog-pager-older-link, .blog-pager-newer-link, .tabs").click(function(event){
In some cases, the page can load for a second and then load with the fade effect, this may be "normal" because the browser is slow to read the script on page load.
Apart from these drawbacks, I think it's a very elegant way to load blog pages while browsing them, don't you think?
Recently in Feb 2013 Blogger integrated Zemanta with Blogspot blogs. Zemanta is indeed a great editorial plugin that helps you to write blog posts easily but unfortunately all such automated blogging tools does not help you to write well Optimized Blog posts that could protect you from the latest Google Penguin 2.0 Penalty! Penguin 2.0 is written especially to kill spam and unnatural links. Zemanta blogging Plugin as you will discover later in this post could badly impact the inbound and outbound link balance of your entire blog, if you are not well versed with SEO link attributes. 
Its 25th of June and the right time to unveil a new hatched egg in front of you all. The third successful blog of 
After an interesting Hangout with AdSense Folks on 18th June at Google+, Susan Wojcicki announced about an interesting new feature called 
The task of Designing a responsive blogger template starts with the Header and the most important part of Header is the top navigation menu that provides useful links to your inner pages. Responsive drop down menus are viral now and can be seen widely implemented on all wordpress blogs and even mashable.com. Today we are releasing the first ever tutorial on designing a flexible Drop down navigation menu for BlogSpot blogs without using a single script or image! The best part is that it is not just a flat menu but with a 
Blogger threaded comments are everywhere now and its time you redesign the style and format of your comments. A good blog commenting system helps to build a strong readership and help readers to engage more into discussion. Since 2009 we have been introducing various ways of customizing comment forms on blogger blogs. We introduced 
Update: The Script has been updated and it will work just perfect!
