Users familiar with Gmail, may have seen the yellowish ‘Loading’ text that appears on top of the page when your Gmail interface is loading. Ever wondered how it would look if you could implement that very same in your own blogger blog? Well look no further, read on. Well to get right down to work:
- Login to your Blogger Dashboard.
- Now search for the following tag:
<body>
- Now replace this with the following code:
<body onLoad=’init()’>
<span id=’loading’ style=’font-weight:bold;position:absolute;font-size:13px; text-align: center; margin-left:auto;top:1px; background-color:#FFD363;’>Loading Page…</span>
<script>
var ld=(document.all);var ns4=document.layers;
var ns6=document.getElementById&&!document.all;
var ie4=document.all;if (ns4) ld=document.loading;
else if (ns6)
ld=document.getElementById("loading").style;
else if (ie4)
ld=document.all.loading.style;function init() {
if(ns4){ld.visibility="hidden";}
else if (ns6||ie4) ld.display="none";
}
</script>
This would give the following effect:
For further customization you could replace the line in the red with the url of an image (eg. Inserting the link ‘http://media.techwithric.com/img/ajax-loader.gif’ would replace the yellowish loading text with the following image) 
Have further queries? Please do comment!
More From richiesajan
- How to open “Internet Explorer” with “RUN”
- Easily Create 'Loading..' Images | Tech With Ric
- Get $50 Off on Any Plans at Lunarpages
richiesajan Recommends
- What Can You Do With Craigslist? (Chad Nicely)
- Paint on HTML5 with Muro by deviantArt (PBJ Breaktime)
Your template could not be parsed as it is not well-formed. Please make sure that all XML elements are closed properly. XML error message: Open quote is expected for attribute “{1}” associated with an element type “onLoad”.
Error 500
Twitter: techwithric
says:
You must’ve missed out something please try again
Thanks Richie Sajan for such a useful post. Its working nicely.
I’ve implemented this in my website http://itswadesh.wordpress.com
Infact i was looking for such a script.
This small twick can do wonders in user experience
Hi, for some reason I get an error claims that some tags are open,
please advise,
Thanks!
Twitter: techwithric
says:
Hi Gal,
did you follow the procedure exactly as given here? If your still not getting it right, could you provide more details like the exact error your getting?
Hi Ric,
Actually I’ve tried several times, error is the following:
Your template could not be parsed as it is not well-formed. Please make sure that all XML elements are closed properly. XML error message: Open quote is expected for attribute “{1}” associated with an element type “onLoad”.
Error 500
Body tags gets approved, the script itself blogger is complaining about.
Thanks for replying so quickly (:
Twitter: techwithric
says:
The error is rather silly, sorry I didn’t get it the first time. After pasting the code in blogger, just replace the single quotes (‘) for the onLoad parameter in the body tag with apostrophe (unicode: U+0027). For this just type it out using your keyboard, nothing much.
The problem is that as you copy paste the apostrophe gets parsed into quotes (U+2018 and U+2019.)
Just try it out and let me know.
Works like a charm.
Pro as usual!
(you should get that copy code feature)
Thanks (: