How to add a counter to your web pages

How to Add a Counter and/or Clock to Your Web Pages

Excerpted From WWW Homepage
Access Counter and Clock!

Table of Contents

Introduction
Digit styles
How to call the program from a web page
Counter options
Examples
Copyright
Acknowledgment
Authors

1. Introduction

This CGI program keeps track of the raw hits on a web page. It generates a GIF image of the number of hits and returns the image to the browser as an in-line image. The program also has a run-time option not to show the digit images, this way the hits can be kept without displaying it. Almost all of the features are run-time options. Some caveats: The hits are no way accurate. Someone can reload the page again and again to increase the hits. However, people like to see how many times someone visited their page. The program can be used to display time and/or date as well as hits. The time or date of any place in the word can be displayed by specifying a timezone string for that location. The date can be formatted in any combination of MMDDYY (Month-Day-Year).

2. Digit Styles

Here are the digit styles. vailable for use. All the styles of digits are supplied as a single image strip.

Style A designed by the author

Style B Borrowed from HTML-access counter.

Style C designed by benjamin@pop3.oro.net

Style D designed by the author

Style E designed by the author

A suggested use of style E is to make the white color transparent (you will know about transparency later).

Style A		designed by the author
Style B		Borrowed from HTML-access counter.
Style C		designed by benjamin@pop3.oro.net
Style D		designed by the author
Style E		designed by the author

3. How to call the program?

You can refer to the program from web page like this:

<img src="/cgi-bin/Count.cgi?df=yourdomain.page.dat" align=absmiddle>

The string between ? and " is called the QUERY_STRING. Make sure there are no newlines in the <img src= line and no space in the QUERY_STRING. In df=yourdomain.page.dat, df means datafile and yourdomain.page.dat is the counter datafile. Important: Be sure to include your domain and page names in the datafile name. Otherwise your count may be overwritten with count hits from other web sites. The counter stores the hits in this file. You can specify a datafile with df like df=yourdomain.page.dat. The file yourdomain.page.dat will be created for you. If you want to reset your counter simply assign a new file name and use the options below to start with the number you want.

The counter program has lots of options, you can make it work and look the way you desire. In the query string, you can use the options described in the table below. The options are separated by a &. Here is an example:
<img src="/cgi-bin/Count.cgi?ft=T&frgb=gold&df=yourdomain.page.dat" align=absmiddle>
The options can be in any order and not case sensitive.

Anyway, look at this Example Page and you'll get the picture.

4. Counter options

Parameter Name Description Default

display=X
Specifies what to display. A valid string can be specified with display= parameter to display counter, clock or date. The valid value for the string parameter X is counter,clock or date For counter, this parameter is not need as counter is the default display type.
display=counter

timezone=X
Display time/date of the specified timezone. The parameter timezone= is only significant with display=clock or display=date. Use this parameter if you want to display time or date of another timezone. The timezone must be specified with a negative or positive four digit offset from GMT, for example: timezone=GMT-0500 or timezone=GMT+0000 or timezone=GMT+0530. The routine to display time of various timezones are written in a generic way. Therefore, the unix machines will not be aware of daylight saving time because of the way the routine is written. For example, if daylight saving time is on, to display time of NY, the timezone will be timezone=GMT-0500 instead of timezone=GMT-0400.

If the clock displays your local time wrong, specify your timezone with that parameter in order to display the correct time.
None.

tformat=X
Time format in 12 or 24 hour. This parameter can be used to display time in 12 or 24 hour format. The valid values for the parameter X is 12 or 24.
tformat=12

dformat=X
Specifies date format. This parameter is only significant with display=date. The valid value for the string parameter X is any combination of MMDDYY (Month-Day-Year). For example, dformat=ddmmyy, dformat=YYMMDD. dformat=MMDDYY

ft=X
Frame Thickness You can wrap the counter in an ornamental frame of X pixels thick. Use 0 for no frame. Values over 5 make a nice 3-D effect.
ft=6

frgb=R;G;B
Frame Color Specifies the color of the frame in RGB (red/green/blue) format. Each color component, R, G, and B is specified as a value between 0 and 256. If you use ft= without a frgb= param, the default color is used.

If you specify a frgb= without a ft=, then the frame thickness defaults to 5. All the examples show ft=5. The color can be specified as hex string or a name. Do not use a # before the hex string as Netscape. For example, if you want to specify white in hex, use frgb=ffffff.
frgb=100;139;216 or
frgb=648bd8

tr=B
Transparency On/Off You can specify if your counter image will have a transparent color with the Boolean B. So tr=Y means there will be a transparent color. It does not matter if the GIF files used for the digits are "transparent"; you must specify explicitly which color to make transparent. If you specify a trgb=, then you do not need to specify tr=Y. If you specify tr=Y and do not specify trgb=, then the default color black will be transparent. The valid values for B are Y, N, T, F, 1, or 0.
tr=F
No Transparency

md=X
Max Digits Defines maximum number of digits to display. Any value between 5 and 10 inclusive are permitted. Padding with leading zeros is automatically done for you; longer counts are truncated to the given X.
md=6
Without padding

pad=B
Padding with 0's Turn padding on/off in conjunction with md= setting. Valid values for the Boolean parameter B are Y, N, T, F, 1, or 0.
pad=N
Without specification of a md=value

pad=Y
With specification of a md=value

dd=A
Digit Directory Denotes directory of a specific styles of digits. Four styles of digits are supplied. They are kept at the directories A,B,C and D respectively.
dd=A
My green led digits

image=gif_file
Display this GIF file You can display any GIF image specified with this parameter. The location of this file is determined by the dd= parameter. All attributes of the counter apply to the image.
None

comma=B
Display comma after every 3rd digit from right. The boolean value of parameter comma specifies whether to display comma after every 3rd digit from right. If you use this parameter as true, the left padding with zeros will be turned off.
comma=F

srgb=R;G;B
prgb=R;G;B
Change a color of the image to a target color on the fly. Any one color of the image can be changed to a different color on the fly. srgb stands for source color, that is the color to change. prgb stands for pen color, that is the target color. The values for srgb and prgb can be colon separated color components (e.g, srgb=255;0;0), a hex value (e.g. srgb=ff0000).
srgb=00ff00
(0;255;0 green)

prgb=00ffff
(0;255;255 cyan)

With chcolor=T

chcolor=B
Change a color of the image. This parameter is usually used to change the default green color to cyan. That is if you specify chcolor=T, and you want to change green to cyan, then you do not need to specify srgb and prgb parameters. 1x1 GIF is displayed. The valid values for the Boolean parameter B are Y, N, T, F, 1, or 0
chcolor=F

st=X
Start Count This parameter is used to set the initial value of the counter to some number X. Note that this parameter has no effect if the datafile already exists. If you want to change the counter value in a existing datafile, hand edit the file. The minimum value for st is 1. You can also reset your counter by simply assigning a new datafile name.
st=1
Count starts at 1

sh=B
Show digits Used to turn display of digits on or off according to the Boolean B. When sh=T, counter will be displayed and incremented, this is the default behavior.

If sh=F no digits will show, but the counter will still increment; instead of digits a transparent 1x1 GIF is displayed. The valid values for the Boolean parameter B are Y, N, T, F, 1, or 0
sh=Y

df=data_file
Datafile to store count Specifies the name of the file for storing the count in. Make sure you use the format 'domain.page.dat'. Where 'domain' is your domain name and 'page' is the name of the html file you want to have a count for. You can use df=random to display a random number.

One special use of the parameter is df=RANDOM. This returns a random number using the fractional portion of the host's time of day clock as a seed for the generator. Unlike all other WWWcounter parameters, the file name provided is case-sensitive, except for the value random.
df=random
if no datafile is specified

incr=B
Increment Count Makes it possible to display the current count without incrementing the count. This can be used to examine the count for reporting or other purposes without adding to the count. Valid values for the Boolean parameter B are Y, N, T, F, 1, or 0.
incr=T
Increment the counter on each invocation

lit=X
Display literal Makes it possible to display a given, predetermined string. The valid values for the string X are digits, a,p,: and -
None

negate=B
Negate the color Makes it possible to negate the color of the counter digits. Note that the Frame is exempted from negating. Valid values for the Boolean parameter B are Y, N, T, F, 1, or 0.
negate=F
Do not negate

degrees=X
Rotate X degrees Makes it possible to rotate the counter image X degree. The possible values of X is 90, 180, 270 and 360. Note 360 is meaningless as the counter will come back to the original 0 degree.
degrees=270
With rotate=Y and without degrees=X
rotate 270 degrees clockwise

rotate=B
Rotate On/Off The Boolean value B turns on or off rotating. If you use degrees= setting, rotate is not needed. Valid values for the Boolean parameter B are Y, N, T, F, 1, or 0.
rotate=F
Do not rotate

5. Examples

Parameter	Name	Description	Default
display=X	Specifies what to display.	A valid string can be specified with display= parameter to display counter, clock or date. The valid value for the string parameter X is counter,clock or date For counter, this parameter is not need as counter is the default display type.	display=counter
timezone=X	Display time/date of the specified timezone.	The parameter timezone= is only significant with display=clock or display=date. Use this parameter if you want to display time or date of another timezone. The timezone must be specified with a negative or positive four digit offset from GMT, for example: timezone=GMT-0500 or timezone=GMT+0000 or timezone=GMT+0530. The routine to display time of various timezones are written in a generic way. Therefore, the unix machines will not be aware of daylight saving time because of the way the routine is written. For example, if daylight saving time is on, to display time of NY, the timezone will be timezone=GMT-0500 instead of timezone=GMT-0400. If the clock displays your local time wrong, specify your timezone with that parameter in order to display the correct time.	None.
tformat=X	Time format in 12 or 24 hour.	This parameter can be used to display time in 12 or 24 hour format. The valid values for the parameter X is 12 or 24.	tformat=12
dformat=X	Specifies date format.	This parameter is only significant with display=date. The valid value for the string parameter X is any combination of MMDDYY (Month-Day-Year). For example, dformat=ddmmyy, dformat=YYMMDD.	dformat=MMDDYY
ft=X	Frame Thickness	You can wrap the counter in an ornamental frame of X pixels thick. Use 0 for no frame. Values over 5 make a nice 3-D effect.	ft=6
frgb=R;G;B	Frame Color	Specifies the color of the frame in RGB (red/green/blue) format. Each color component, R, G, and B is specified as a value between 0 and 256. If you use ft= without a frgb= param, the default color is used. If you specify a frgb= without a ft=, then the frame thickness defaults to 5. All the examples show ft=5. The color can be specified as hex string or a name. Do not use a # before the hex string as Netscape. For example, if you want to specify white in hex, use frgb=ffffff.	frgb=100;139;216 or frgb=648bd8
tr=B	Transparency On/Off	You can specify if your counter image will have a transparent color with the Boolean B. So tr=Y means there will be a transparent color. It does not matter if the GIF files used for the digits are "transparent"; you must specify explicitly which color to make transparent. If you specify a trgb=, then you do not need to specify tr=Y. If you specify tr=Y and do not specify trgb=, then the default color black will be transparent. The valid values for B are Y, N, T, F, 1, or 0.	tr=F No Transparency
md=X	Max Digits	Defines maximum number of digits to display. Any value between 5 and 10 inclusive are permitted. Padding with leading zeros is automatically done for you; longer counts are truncated to the given X.	md=6 Without padding
pad=B	Padding with 0's	Turn padding on/off in conjunction with md= setting. Valid values for the Boolean parameter B are Y, N, T, F, 1, or 0.	pad=N Without specification of a md=value pad=Y With specification of a md=value
dd=A	Digit Directory	Denotes directory of a specific styles of digits. Four styles of digits are supplied. They are kept at the directories A,B,C and D respectively.	dd=A My green led digits
image=gif_file	Display this GIF file	You can display any GIF image specified with this parameter. The location of this file is determined by the dd= parameter. All attributes of the counter apply to the image.	None
comma=B	Display comma after every 3rd digit from right.	The boolean value of parameter comma specifies whether to display comma after every 3rd digit from right. If you use this parameter as true, the left padding with zeros will be turned off.	comma=F
srgb=R;G;B prgb=R;G;B	Change a color of the image to a target color on the fly.	Any one color of the image can be changed to a different color on the fly. srgb stands for source color, that is the color to change. prgb stands for pen color, that is the target color. The values for srgb and prgb can be colon separated color components (e.g, srgb=255;0;0), a hex value (e.g. srgb=ff0000).	srgb=00ff00 (0;255;0 green) prgb=00ffff (0;255;255 cyan) With chcolor=T
chcolor=B	Change a color of the image.	This parameter is usually used to change the default green color to cyan. That is if you specify chcolor=T, and you want to change green to cyan, then you do not need to specify srgb and prgb parameters. 1x1 GIF is displayed. The valid values for the Boolean parameter B are Y, N, T, F, 1, or 0	chcolor=F
st=X	Start Count	This parameter is used to set the initial value of the counter to some number X. Note that this parameter has no effect if the datafile already exists. If you want to change the counter value in a existing datafile, hand edit the file. The minimum value for st is 1. You can also reset your counter by simply assigning a new datafile name.	st=1 Count starts at 1
sh=B	Show digits	Used to turn display of digits on or off according to the Boolean B. When sh=T, counter will be displayed and incremented, this is the default behavior. If sh=F no digits will show, but the counter will still increment; instead of digits a transparent 1x1 GIF is displayed. The valid values for the Boolean parameter B are Y, N, T, F, 1, or 0	sh=Y
df=data_file	Datafile to store count	Specifies the name of the file for storing the count in. Make sure you use the format 'domain.page.dat'. Where 'domain' is your domain name and 'page' is the name of the html file you want to have a count for. You can use df=random to display a random number. One special use of the parameter is df=RANDOM. This returns a random number using the fractional portion of the host's time of day clock as a seed for the generator. Unlike all other WWWcounter parameters, the file name provided is case-sensitive, except for the value random.	df=random if no datafile is specified
incr=B	Increment Count	Makes it possible to display the current count without incrementing the count. This can be used to examine the count for reporting or other purposes without adding to the count. Valid values for the Boolean parameter B are Y, N, T, F, 1, or 0.	incr=T Increment the counter on each invocation
lit=X	Display literal	Makes it possible to display a given, predetermined string. The valid values for the string X are digits, a,p,: and -	None
negate=B	Negate the color	Makes it possible to negate the color of the counter digits. Note that the Frame is exempted from negating. Valid values for the Boolean parameter B are Y, N, T, F, 1, or 0.	negate=F Do not negate
degrees=X	Rotate X degrees	Makes it possible to rotate the counter image X degree. The possible values of X is 90, 180, 270 and 360. Note 360 is meaningless as the counter will come back to the original 0 degree.	degrees=270 With rotate=Y and without degrees=X rotate 270 degrees clockwise
rotate=B	Rotate On/Off	The Boolean value B turns on or off rotating. If you use degrees= setting, rotate is not needed. Valid values for the Boolean parameter B are Y, N, T, F, 1, or 0.	rotate=F Do not rotate

Check this link for a few examples of the code for various types of counters and clocks.

6. Copyright (all platforms)

Copyright 1995-1996 by Muhammad A Muquit. Permission to use, copy, modify and sell this program for any purpose is hereby granted without fee, provided that this copyright notice appear in all copies and that both that copyright notice and this permission notice appear in supporting documentation. If the program is included in a book, publication or in a software distribution media for sale, the author must be notified about it. No binary only distribution is allowed. All distributions must include the source and this copyright notice.

THIS PROGRAM IS PROVIDED "AS IS" WITHOUT EXPRESS OR IMPLIED WARRANTY. THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE, INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS, IN NO EVENT SHALL THE AUTHOR Muhammad A. Muquit BE LIABLE FOR ANY SPECIAL, INDIRECT OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

Note: This program is developed in my own time. My employer has nothing to do with it.

7. Acknowledgment

Thanks to John Cristy for ImageMagick. I took many routines from ImageMagick for the GIF image combining library. I borrowed the font array and some code from gd library. Thanks to Tom Boutell. Thanks to all of you who showed interest in the counter program. I had fun writing it.

8. Authors

Muhammad A Muquit and
Kevin J. Walsh

ma_muquit@fccc.edu