TextClock

Server Side Include Date & Time Display Script

TextClock is a Perl CGI script designed to work with Server Side Includes (SSI), providing dynamic date and time display on your web pages. With multiple formatting options, you can show the current time, date, or both in various styles to match your site's design.

Free Download
Version 1.0
Perl CGI

Overview

TextClock is one of the simplest yet most useful CGI scripts from the early web era. It works through Server Side Includes, allowing webmasters to display dynamic date and time information on otherwise static HTML pages.

Package Contents
File Description
textclock.pl Main Perl script that displays the current time and date
README Installation instructions and configuration guide
Live Demo

Loading...

JavaScript recreation of TextClock output

Features

Multiple Date Formats

Display dates in various formats including full month names, abbreviated formats, numeric dates, and custom combinations.

Flexible Time Display

Show time in 12-hour or 24-hour format, with or without seconds, and include timezone information.

Easy Configuration

Configure output format through URL parameters, making it easy to use different formats on different pages.

SSI Compatible

Works well with Server Side Includes on Apache and other SSI-enabled web servers.

Lightweight

Minimal server resources required. The script is small and executes quickly with negligible overhead.

Link Wrapping

Optionally wrap the output in a hyperlink to any URL, creating clickable date/time stamps.

Format Options

TextClock supports numerous display formats controlled by the format parameter:

Format Code Description Example Output
%a Abbreviated weekday name Sun, Mon, Tue
%A Full weekday name Sunday, Monday, Tuesday
%b Abbreviated month name Jan, Feb, Mar
%B Full month name January, February, March
%d Day of month (01-31) 01, 15, 28
%e Day of month (1-31, no padding) 1, 15, 28
%H Hour (00-23) 00, 13, 23
%I Hour (01-12) 01, 06, 12
%M Minute (00-59) 00, 30, 59
%S Second (00-59) 00, 45, 59
%m Month (01-12) 01, 06, 12
%p AM/PM indicator AM, PM
%y Year (2-digit) 99, 00, 25
%Y Year (4-digit) 1999, 2000, 2025
%Z Timezone name EST, PST, UTC

Installation

  1. Enable SSI on Your Server
    Ensure Server Side Includes are enabled in your Apache configuration. Add Options +Includes to your .htaccess or httpd.conf.
  2. Upload the Script
    Upload textclock.pl to your cgi-bin directory.
  3. Set Perl Path
    Edit the first line of the script to point to your Perl interpreter (usually #!/usr/bin/perl).
  4. Set Permissions
    Set the script permissions to 755: chmod 755 textclock.pl
  5. Add SSI to Your Pages
    Add the SSI include directive to your .shtml pages where you want the time displayed.

Code Examples

Basic SSI Include
<!-- Display full date and time -->
<!--#exec cgi="/cgi-bin/textclock.pl"-->

<!-- Display with custom format -->
<!--#exec cgi="/cgi-bin/textclock.pl?format=%A,+%B+%d,+%Y+-+%I:%M:%S+%p+%Z"-->

<!-- Display date only -->
<!--#exec cgi="/cgi-bin/textclock.pl?format=%B+%d,+%Y"-->

<!-- Display time only (24-hour format) -->
<!--#exec cgi="/cgi-bin/textclock.pl?format=%H:%M:%S"-->

<!-- Display time only (12-hour format) -->
<!--#exec cgi="/cgi-bin/textclock.pl?format=%I:%M+%p"-->

<!-- Display with link -->
<!--#exec cgi="/cgi-bin/textclock.pl?format=%A,+%B+%d,+%Y&link=http://example.com/"-->
Modern Perl Implementation
#!/usr/bin/perl
use strict;
use warnings;
use POSIX qw(strftime);
use CGI;

my $cgi = CGI->new;
my $format = $cgi->param('format') || '%A, %B %d, %Y - %I:%M:%S %p %Z';
my $link = $cgi->param('link') || '';

# Security: sanitize format string
$format =~ s/[^\w\s%:,\-\/\.]//g;

# Generate the time string
my $time_string = strftime($format, localtime);

# Output
print $cgi->header('text/html');

if ($link) {
    # Sanitize link
    $link =~ s/[<>"']//g;
    print qq{$time_string};
} else {
    print $time_string;
}

exit 0;
PHP Equivalent
<?php
/**
 * TextClock - PHP Version
 * Display current date and time with customizable format
 */

// Default format
$format = $_GET['format'] ?? 'l, F j, Y - h:i:s A T';
$link = $_GET['link'] ?? '';

// Security: convert strftime-style format to PHP date format
// This is a simplified conversion - full implementation would need more mappings
$format_map = [
    '%A' => 'l',      // Full weekday
    '%a' => 'D',      // Abbreviated weekday
    '%B' => 'F',      // Full month
    '%b' => 'M',      // Abbreviated month
    '%d' => 'd',      // Day (01-31)
    '%e' => 'j',      // Day (1-31)
    '%H' => 'H',      // Hour (00-23)
    '%I' => 'h',      // Hour (01-12)
    '%M' => 'i',      // Minute
    '%S' => 's',      // Second
    '%m' => 'm',      // Month (01-12)
    '%p' => 'A',      // AM/PM
    '%Y' => 'Y',      // Year (4-digit)
    '%y' => 'y',      // Year (2-digit)
    '%Z' => 'T',      // Timezone
    '+' => ' ',       // Plus signs to spaces
];

$php_format = strtr($format, $format_map);
$time_string = date($php_format);

// Output
if (!empty($link)) {
    $link = htmlspecialchars($link, ENT_QUOTES, 'UTF-8');
    echo "<a href=\"{$link}\">{$time_string}</a>";
} else {
    echo $time_string;
}
?>
JavaScript Implementation
/**
 * TextClock - JavaScript Version
 * Display current date and time with customizable format
 */

class TextClock {
    constructor(element, options = {}) {
        this.element = typeof element === 'string'
            ? document.querySelector(element)
            : element;
        this.options = {
            format: 'full',
            link: null,
            updateInterval: 1000,
            locale: 'en-US',
            ...options
        };
        this.init();
    }

    init() {
        this.update();
        if (this.options.updateInterval > 0) {
            setInterval(() => this.update(), this.options.updateInterval);
        }
    }

    getFormatOptions() {
        const formats = {
            'full': {
                weekday: 'long',
                year: 'numeric',
                month: 'long',
                day: 'numeric',
                hour: '2-digit',
                minute: '2-digit',
                second: '2-digit',
                timeZoneName: 'short'
            },
            'date': {
                weekday: 'long',
                year: 'numeric',
                month: 'long',
                day: 'numeric'
            },
            'time': {
                hour: '2-digit',
                minute: '2-digit',
                second: '2-digit'
            },
            'short': {
                year: 'numeric',
                month: 'short',
                day: 'numeric'
            },
            'iso': {
                year: 'numeric',
                month: '2-digit',
                day: '2-digit'
            }
        };
        return formats[this.options.format] || formats['full'];
    }

    update() {
        const now = new Date();
        let timeString;

        if (this.options.format === 'iso') {
            timeString = now.toISOString().split('T')[0];
        } else {
            timeString = now.toLocaleDateString(
                this.options.locale,
                this.getFormatOptions()
            );
        }

        if (this.options.link) {
            this.element.innerHTML = `<a href="${this.options.link}">${timeString}</a>`;
        } else {
            this.element.textContent = timeString;
        }
    }
}

// Usage examples:
// Basic usage
new TextClock('#clock');

// With options
new TextClock('#clock', {
    format: 'full',
    link: 'https://example.com/',
    locale: 'en-US',
    updateInterval: 1000
});

// Date only (no live update)
new TextClock('#date', {
    format: 'date',
    updateInterval: 0
});

// Time only
new TextClock('#time', {
    format: 'time'
});

Download

Compressed Archives
  • textclock.tar.gz 3.3 KB
  • textclock.zip 4.0 KB
  • textclock.tar.Z 5.2 KB
  • textclock.tar 20.5 KB
Individual Files
  • textclock.pl

    Main Perl script that displays the current time

  • README

    Installation instructions and detailed setup guide

Frequently Asked Questions

Server Side Includes are directives placed in HTML pages that are evaluated on the server when a page is served. They allow you to include dynamic content in otherwise static pages. SSI directives look like HTML comments: <!--#command parameter="value"-->. Common uses include displaying the current date, including other files, or showing the last modification time of a document.

For Apache, you need to enable the mod_include module and add the appropriate configuration. Add Options +Includes to your .htaccess file or virtual host configuration. You also need to tell Apache which files to parse for SSI, typically with: AddHandler server-parsed .shtml or AddOutputFilter INCLUDES .html to parse all HTML files.

The C++ version of TextClock is compiled into a binary executable, which means it runs faster than the Perl version because there's no interpreter startup overhead. For high-traffic websites, the C++ version can significantly reduce server load. However, the Perl version is easier to modify and customize if you need specific functionality.

TextClock uses the server's system time and timezone by default. To display a different timezone, you would need to modify the script to set the TZ environment variable before generating the time string. Example: $ENV{TZ} = 'America/New_York'; at the beginning of the script. Note that available timezone names depend on your server's operating system.

SSI content is generated once when the page loads - it doesn't automatically update like JavaScript. If you need a continuously updating clock, you should use JavaScript instead (see the code examples above). SSI is best suited for showing the time when the page was loaded, not for a live updating display.

The original TextClock script displays dates in English. To display dates in other languages, you would need to modify the script to use locale settings. In Perl, you can use the POSIX module's setlocale function: use POSIX qw(locale_h strftime); setlocale(LC_TIME, "de_DE"); This would display German day and month names. The locale must be installed on your server.

Yes, for modern websites you have several better options: JavaScript's Date object with Intl.DateTimeFormat for client-side display with automatic localization, PHP's date() and DateTime classes for server-side rendering, or template engine functions in frameworks like Laravel, Django, or Rails. These modern approaches offer better internationalization, timezone handling, and don't require SSI to be enabled.

SSI-generated content is included at the time the page is served. If your page is cached by a CDN, proxy, or browser, the time shown will be the cached time, not the current time. To use TextClock with caching, you'd need to either disable caching for those pages or use Edge Side Includes (ESI) if your CDN supports them. For most use cases with caching, JavaScript-based time display is a better solution.

Resources