Learn More

Sunday, September 16, 2012

Current Date Widget

demo example of current date widget
This time we discuss the current date widget. This is not a calendar widget, but displays current date. If your blog about the news, then the current date widget is for you. This widget uses jquery as core, extremely accurate and lightweight. You can also change the style of the current date via CSS.

The beginning of this idea we get when we surfing on some news sites and blogs about the news. They have a display current date. Then when we did the surfing blogs of our friends who have a news topic, not all of our blog friends have a display current date.

How to use this widget is very simple, you just put the following code before the </body>. So you can put it through the Edit HTML or Layout (using HTML / Javascript Gadget).

                  <div id='datepart'>
<script type='text/javascript'>
//<![CDATA[
                     var getdate= new Date();
      var getyear = getdate.getYear(mydate);
      if(getyear < 1000){
        getyear += 1900;
      }
      var getday = getdate.getDay();
      var getmonth = getdate.getMonth();
      var getdaym = getdate.getDate();
      if(getdaym<10){
        getdaym = "0" + getdaym;
      }
     var getdayarray=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");
        var getmontharray=new Array("January","February","March","April","May","June","July","August","September","October","November","December"); 
      document.getElementById('datepart').innerHTML = ""+getdayarray[day]+", "+getmontharray[month]+" "+getdaym+", "+getyear+"";
//]]>
      </script> 
                  </div>

page layout


Maybe not just this tutorial that you need, there are a lot of threelas.com tutorials that you can use on your blog. Among others

  1. Selected recent posts, this tutorial is perfect for those of you who have a news topic. Because you can show recent posts by categories.
  2. Basic Blogger JSON feed. If you want to learn about the blogger JSON feed, so can create a widget with its own style, then this tutorial is very useful.

Post a Comment