Today, I'm going to guide you to create a simple widget that measures the time loading your blog using JavaScript.
1. Login to your account --> Design --> Edit HTML
2. Click on "Download Full Template" to backup your template.
3. Check "Expand Widget Templates"
4. Search for
<head>
5. Add the following code after it
<!--Start loading timmer -->
<script type='text/javascript'>
var myTime = new Date();
var startTime = myTime.getTime();
</script>
<!-- End loading timer -->
6. Find </body> and add the following code above it
<!-- start loading timer -->
<script type='text/javascript'>
var myTime2 = new Date();
var endTime = myTime2.getTime();
var totalTime = (endTime - startTime)/1000;
document.getElementById("loadingTime").innerHTML = "Page loaded in: "+ totalTime +" seconds";
</script>
<!-- end start loading timer -->
7. Save your template and go to "Page Elements" --> Add a Gadget --> HTML/JavaScript. Copy the following code and paste.
<div id="loadingTime"></div>
<div style="clear:both"></div>
<div style="float:right">Widget by <a href="http://www.blogsmonetize.com/" title="WebTechGuide">WebTechGuide</a></div>
8. Save your widget, now you have a page loading counter widget.
9. You can check out a demo here.
0 comments:
Why not leave a comment? No matter what, I'd love to hear from you!
Post a Comment