Insert date in a page ?

Discussion in 'Web Design & Coding' started by Howling Wolf, Nov 20, 2003.

  1. Howling Wolf

    Howling Wolf We did not deserve this !

    Messages:
    1,243
    Location:
    Amongst the Native Ones
    Hello all !

    I was wondering how I could add the date on my main pages (English & French) ?
    Indeed, I'd like to have the date appear on the upper right corner of the page, of course it will have to update automatically.
    With the right format in English and French, which are different.

    Any simple way to achieve this ?
    Any ideas are welcomed !
    Thank you !

    Ant -|- One
     
  2. Perris Calderon

    Perris Calderon Moderator Staff Member Political User

    Messages:
    12,333
    Location:
    new york
    haven't tried this, this is a cut and [paste;

    method of inserting the date and time (according to the Windows calendar) into a text document. As far as I know, this only works in Notepad, not in MS Word or Wordpad.

    Steps to insert date and time into a Notepad .txt file:

    1) Click Start > Run
    2) Type "notepad" without the quotes
    3) Push F5 on your keyboard
     
  3. Tabula Rasa

    Tabula Rasa Stranger Than Kindness Political User

    Messages:
    3,233
    Location:
    Israel
    Does your server allow PHP?
     
  4. Howling Wolf

    Howling Wolf We did not deserve this !

    Messages:
    1,243
    Location:
    Amongst the Native Ones
    Dealer, nice trick ;)

    Benny, yes, php4 is allowed :)
    php3 is on its way out, my isp tells everyone to move to php4...
    Thank you for your help !!! I'm waiting for your contribution ;)
     
  5. j79zlr

    j79zlr Glaanies script monkey Political User

    Messages:
    2,725
    Location:
    Chicago
    You can use the php date function, but this will give the server's date/time not the client. You can use fairly simple javascript to display a client date/time.
     
  6. Howling Wolf

    Howling Wolf We did not deserve this !

    Messages:
    1,243
    Location:
    Amongst the Native Ones
    I'm waiting for Benny's solution, but I accept your solution aswell. Indeed, I'd prefer to have the client date/time displayed, wherever she/he is :)
    I know nothing about javascript, do you have it already ? Could you tell me how precisely to install it also ?

    Thank you to both of you, I'd be more than happy to have this feature on my site ! :)
     
  7. gonaads

    gonaads Beware the G-Man Political User Folding Team

    try this...



    <script LANGUAGE="JavaScript" type="text/javascript">

    <!-- Begin
    var months=new Array(13);
    months[1]="January";
    months[2]="February";
    months[3]="March";
    months[4]="April";
    months[5]="May";
    months[6]="June";
    months[7]="July";
    months[8]="August";
    months[9]="September";
    months[10]="October";
    months[11]="November";
    months[12]="December";
    var time=new Date();
    var lmonth=months[time.getMonth() + 1];
    var date=time.getDate();
    var year=time.getYear();

    // Y2K Fix by Isaac Powell
    // http://onyx.idbsu.edu/~ipowell

    if ((navigator.appName == "Microsoft Internet Explorer") && (year < 2000))
    year="19" + year;
    if (navigator.appName == "Netscape")
    year=1900 + year;
    document.write(lmonth + " ");
    document.write(date + ", " + year);
    // End -->
    </script>


    You copy and paste it into the "BODY" section of your web page's HTML code where you will want it at. I have it at the top of the "BODY" section.

    If you want to center it use the <center> </center> tags. Or if you want it on one side or the other use the <align="right"> or <align="left"> tags.


    I have this on my job's web site. Been usin it for a couple of years now.
     
  8. j79zlr

    j79zlr Glaanies script monkey Political User

    Messages:
    2,725
    Location:
    Chicago
    Nothing you need to install, just put this code into the head of the document:

    Code:
    <script language="JavaScript">
    
    <!--
    
    var clockID = 0;
    
    function UpdateClock() {
       if(clockID) {
          clearTimeout(clockID);
          clockID  = 0;
       }
    
       var tDate = new Date();
    
       document.theClock.theTime.value = "" 
                                       + tDate.getHours() + ":" 
                                       + tDate.getMinutes() + ":" 
                                       + tDate.getSeconds();
       
       clockID = setTimeout("UpdateClock()", 1000);
    }
    function StartClock() {
       clockID = setTimeout("UpdateClock()", 500);
    }
    
    function KillClock() {
       if(clockID) {
          clearTimeout(clockID);
          clockID  = 0;
       }
    }
    
    //-->
    
    </script>
    then use this body tag, and insert the other code where you want the clock.

    Code:
    <body onload="StartClock()" onunload="KillClock()">
    
    <form name="theClock">
    <input type=text name="theTime" size=8>
    <form>
     
  9. Howling Wolf

    Howling Wolf We did not deserve this !

    Messages:
    1,243
    Location:
    Amongst the Native Ones
    Thank you !!

    Gonaads,

    your code works great, installed and running on my English main page. Could you please tell what code (and where) to add for the day, I mean, I'd like the date to appear in this format:
    Friday, November 21, 2003
    It would be just perfect :)

    j79zlr,

    just the same for your script, installed and running :)
    But do you know how to change the background color of the clock so that it's merged in the page background ?

    Also, is it possible to have 01-02-03... for seconds and minutes, and not 1-9, 10-59... ?

    And also, just in case, how to remove the border ? That's not very important if the background color of the clock can be changed...

    Again, thank you, both of you !!! :D
     
  10. gonaads

    gonaads Beware the G-Man Political User Folding Team

    I found this one. It may be more suitable.

    This script show the date in the traditional English format.


    STEP ONE: Copy/paste this code into the HEAD of your HTML document


    <HEAD>

    <SCRIPT LANGUAGE="JavaScript" type="text/javascript">


    <!-- Begin
    dayName = new Array("", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday")
    monName = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December")
    now = new Date
    // End -->
    </script>

    </HEAD>


    STEP TWO: Copy/paste this code into the BODY of your HTML document


    <BODY>

    <SCRIPT LANGUAGE="JavaScript" type="text/javascript">


    <!-- Begin
    var strDay;
    if ((now.getDate() == 1) || (now.getDate() != 11) && (now.getDate() % 10 == 1)) // Correction for 11th and 1st/21st/31st
    strDay = "st ";
    else if ((now.getDate() == 2) || (now.getDate() != 12) && (now.getDate() % 10 == 2)) // Correction for 12th and 2nd/22nd/32nd
    strDay = "nd ";
    else if ((now.getDate() == 3) || (now.getDate() != 13) && (now.getDate() % 10 == 3)) // Correction for 13th and 3rd/23rd/33rd
    strDay = "rd ";
    else
    strDay = "th ";
    document.write(
    dayName[now.getDay()]
    +
    " the "
    +
    now.getDate()
    +
    strDay
    +
    "of "
    +
    monName[now.getMonth()]
    +
    ", "
    +
    now.getFullYear()
    )
    // End -->
    </script>



    Hope this is more to what you wanted. :)
     
  11. Leevoy

    Leevoy Guest

    <BODY>

    <SCRIPT LANGUAGE='JavaScript'>
    function DigitalClock()
    {

    var newDate = new Date();
    var intDay = newDate.getDay();
    var intMonth = newDate.getMonth();
    var intWeekday = newDate.getDate();
    var intYear = newDate.getYear();
    var intHours = newDate.getHours();
    var intMinutes = newDate.getMinutes();
    var intSeconds = newDate.getSeconds();
    var strAMPM = 'AM';

    var aryDayName = new Array('Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday');
    var aryMonth = new Array('January','February','March','April','May','June','July','August','September','October','November','December');

    var int24Hours = intHours;

    if (intHours > 11)
    {
    strAMPM = 'PM';
    intHours = intHours - 12;
    }

    if (intHours == 0)
    intHours = 12;

    if (intMinutes <= 9)
    intMinutes = '0' + intMinutes;

    if (intSeconds <= 9)
    intSeconds = '0' + intSeconds;

    if (intWeekday <= 9)
    var strDayNumber = '0' + intWeekday;
    else
    var strDayNumber = intWeekday;

    if (intYear < 200)
    {
    intYear = intYear + 1900;
    }

    if (intMonth <= 9)
    var strMonthNumber = '0' + (intMonth + 1);
    else
    var strMonthNumber = intMonth + 1;

    var strDayName = new String(aryDayName[intDay]);
    var strDayNameShort = strDayName.substring(0, 3);

    var strMonthName = new String(aryMonth[intMonth]);
    var strMonthNameShort = strMonthName.substring(0, 3);

    var strYear = new String(intYear);
    var strYearShort = strYear.substring(2, 4);
    var strClock = '';

    strClock = int24Hours + ':' + intMinutes + ':' + intSeconds + ' ' + strAMPM + ' &nbsp; ' + strDayName + ', ' + strMonthName + ' ' + intWeekday + ', ' + intYear

    if (document.layers)
    {
    strClock = "<span style=';color:#702169;font-weight:bold;font-family:Arial;font-size:12pt;padding:0'>" + strClock + "</span>"
    document.layers.lyrClock.document.write(strClock);
    document.layers.lyrClock.document.close();
    }
    else if (document.all)
    spnClock.innerHTML = strClock;

    setTimeout('DigitalClock()',1000)
    }

    window.onload = DigitalClock;
    </SCRIPT>

    <LAYER ID='lyrClock' bgcolor=''></LAYER>
    <SPAN ID='spnClock' style=';color:#702169;font-weight:bold;font-family:Arial;font-size:12pt;padding:0'></SPAN>
    </BODY>
     
  12. Howling Wolf

    Howling Wolf We did not deserve this !

    Messages:
    1,243
    Location:
    Amongst the Native Ones
    Leevoy,

    thank you, it's a great all-in-one script !
    As you can see, I found the way to change the font color and size as I find it more suitable.
    Is this your script ?
    Why am I asking ? That's because I'd like the date to be completely on the 1st line, and time under without PM/AM.

    Could you tell me what part of the code to modify ? Thank you in advance ! :)

    And many thanx to Gonaads and j79zlr !
     
  13. gonaads

    gonaads Beware the G-Man Political User Folding Team

    hope ya got what ya needed. :)
     
  14. Howling Wolf

    Howling Wolf We did not deserve this !

    Messages:
    1,243
    Location:
    Amongst the Native Ones
    Yep, thank you very much Gonaads ! Sorry I won't use the scripts you kindly provided, they're good and they will surely be used by others ;)
    Leevoy's one has everything I need in it, just need to modify a little the way it displays. Me waiting for him to tell me how to modify the code, as I know really nothing abour javascript... :(
     
  15. Leevoy

    Leevoy Guest

    Do you want a.m. and p.m. displaying on page?
     
  16. Howling Wolf

    Howling Wolf We did not deserve this !

    Messages:
    1,243
    Location:
    Amongst the Native Ones
    Leevoy,
    no, I don't want am/pm to be displayed. Hours should display from 00 to 23 (leading 0 for hours from 1 to 9 in the morning) so that am/pm is not needed
    I'd like the date and time to be displayed this way/format:
    Sunday, November 23, 2003 <-- 1st line
    01:03:34 <-- 2nd line **if morning**
    13:05:26 **if afternoon**

    presently, only the 0 is missing from 0 to 9 hours in the morning
    then I'll center it on the right as it is now.

    Thank you, me waiting patiently ;)
     
  17. Howling Wolf

    Howling Wolf We did not deserve this !

    Messages:
    1,243
    Location:
    Amongst the Native Ones
    Leevoy, or some other javascript guru, do you know what to modify in the code (Leevoy's one above) so that it displays the way I mentionned just above ?
    Thank you all ;)
     
  18. Leevoy

    Leevoy Guest

    I usually just paste the script into a cell I created in frontpage.
    If I wanted date on one side then I would stick a cell on one side and paste that part there. I would create a cell on the otherside for time and put it there.

    I did give you a program that allows you to choose from various formats and hence post it where you want.

    I will look at your page and try and do it myself.
     
  19. Howling Wolf

    Howling Wolf We did not deserve this !

    Messages:
    1,243
    Location:
    Amongst the Native Ones
    Leevoy, ok, I've found, at last, how to set up the date and time as I want it, many thanx !!!
     
  20. Un4gIvEn1

    Un4gIvEn1 Moderator

    Messages:
    1,084
    I know that this is off topic of what he actually wanted... but on the lines of what dealer is saying...

    If you create a new text file (name it anything you want) and you place ".LOG" on the first line, followed by a carriage return and save it. Each time you open the document you will get the current date/time. This is great for creating log files where you enter a date and some information. All you do is open it, type, save and close. Next time you open it, it will display the new time/date below what you have previously entered, and so on. :)

    Later!