Friday, March 28, 2014

Add calender gadget to your blog



Add this beautiful calender gadget to your blog :







1) Go to Blogger Dashboard > Design > Page/Edit Layout.

2) Add a Gadget > HTML/JavaScript.

3) Copy the code below and paste it into the window.





<html>
<!--This gadget is created by kiran manchekar
If you want to use this gadget you should keep this notice
in the code-->
<style>
canvas{background-color:#F06000;height:200;width:200;border-radius:30px;}
</style>
<body>
<canvas id="myCanvas"></canvas>
<script>
var today=new Date();
var dd=today.getDate();
var mm=today.getMonth();
var dy=today.getDay();
var x,y;
if(mm==0)
{
y="January";
}
if(mm==1)
{
y="February";
}
if(mm==2)
{
y="March";
}
if(mm==3)
{
y="April";
}
if(mm==4)
{
y="May";
}
if(mm==5)
{
y="June";
}
if(mm==6)
{
y="July";
}
if(mm==7)
{
y="August";
}
if(mm==8)
{
y="Septemeber";
}
if(mm==9)
{
y="Octomber";
}
if(mm==10)
{
y="November";
}
if(mm==11)
{
y="December";
}
if(dy==1)
{
x="Monday";
}
if(dy==2)
{
x="Tuesday";
}
if(dy==3)
{
x="Wednesday";
}
if(dy==4)
{
x="Thursday";
}
if(dy==5)
{
x="Friday";
}
if(dy==6)
{x="Saturday";
}
if(dy==0)
{
x="Sunday";
}
var b=document.getElementById("myCanvas");
var context=b.getContext("2d");
context.fillStyle=white;
context.font = "bold 100px Calibri";
context.fillText( dd, 100, 105);
context.font = "bold 20px Calibri";
context.fillText( x, 115, 135);
context.fillText( y, 135, 25);
context.stroke();
</script>
</body>
</html>



4) Save it and you have done it.

Related Posts by Categories

0 comments:

Post a Comment