Friday, 24 August 2012

Show Page Loading Time On Blogger

Important: All scripts hosted on widcraft.googlecode.com don't work anymore because Google has blocked that SVN repository.

It's time to show visitors how fast or slow your blog page loads with this script as you can see this widget will show your blog's loading time in each page which is a very important for every blog to load fast and this is so easy to add so here we go :
  • Go To Blogger > Template > Edit HTML > Mark 'Expand Widget Templates'
  • Paste below script just below <head>
<!-- page load timer -->
<script type='text/javascript'>
var d = new Date();
var starttime = d.getTime();  //Get the start time
</script>
  •  Now just above </body> paste following script :
<!-- page load timer start -->
<script type='text/javascript'>
var d2 = new Date();
var endtime = d2.getTime(); //Get the end time
//Find the difference between the start and end times
var totaltime = (endtime - starttime)/1000;
//Round 2 decimal places
var result = Math.round(totaltime*100)/100;
//Output results to a &quot;P&quot; element
document.getElementById(&quot;loadtime&quot;).innerHTML = &quot;Page loaded in: &quot;+ result +&quot; seconds&quot;;
</script>
<!-- page load timer end -->
  • Save your template
Now we have added all script now it's time to place this widget in your template
  • Go To Blogger > Layout > Add A Gadget > > HTML/Javascript
  • Paste following script and save it: 
<p id="loadtime">Write your custom message here</p>
All done now just go to your blog and see this working and you can also use some CSS in this widget to make it look better.....Don't forget to leave a comment
Important: Check our new website TricksPanda.com for WordPress tutorials, plugins and more.
 
Powered by Blogger.