[an error occurred while processing this directive]
The WebCom Graphic Hit Counter

On this page you will find all of the information necessary to use a real-time graphical hit counter on your WebCom Web pages. The WebCom counter is much more sophisticated than the many counter services on the Internet. When anyone views your web page, your hit counter will increment. This is true even for text mode browsers and people who have images turned off. Thus, your hit counters will reflect the complete and true accesses to your page, even cached hits!

(Note to users of Microsoft FrontPage, Netscape Communicator and other WYSIWYG HTML editors: In order to use WebCom's Graphical Access Counter on your web pages, you will have to edit the HTML code that constitutes your web page. If you do not know how to access or change the HTML code of your page, please refer to the documentation that came with your HTML editing software, or contact the technical support of the company that produced the software that you are using.)



The Basic Counter

Putting an access counter on a Web page is as simple as adding a single HTML tag where you want the number to appear. There is a basic syntax to implementing a counter, which includes options that allow you to change the colors, border, character set, etc.

The most basic counter is this:

<IMG SRC="/counter">

This tag will produce this image:

The above HTML tag is all you will need to insert on any of your WebCom Web pages to display a counter. If you want to dress up your counter or change its look, then you can add any of the following options to this tag.

 


Options The options are set using a query string, the information that is contained after a question mark in a URL, as in:

<IMG SRC="/counter?this_is_a_query_string">

Setting options for your counter is done using the general syntax:

<IMG SRC="/counter?option1=value,option2=value">

There are several options that you have for your counter. Here is a list of each, along with a description of how they are used.

 


Colors

Notice that the counter above has a red border with a highlight and shadow. The following illustrates how these colors can be changed.

The codes for specifying particular colors are in Hex, very similar to those used in the BODY tag of an HTML document. The codes range from 00 to FF, representing all the possible shades of a particular color. Colors are specified with this format:

RRGGBB

RR is the Red component of the color, GG is the Green component, and BB is the Blue component.


highlight To set the highlight color, you would insert the option highlight=RRGGBB where RRGGBB is the Hex value for the color. Here's an example of setting the highlight to Green:

<IMG SRC="/counter?highlight=00FF00">


matte The area of the counter that isn't part of the edge is called the matte. The matte color is set using the same method, the syntax is matte=RRGGBB where RRGGBB is the color. Let's do another example:

<IMG SRC="/counter?matte=007F00">


shadow The bottom and right edge are the shadow. You can alter the highlight and shadow together to simulate the counter being indented or raised. Setting the shadow is the same as setting other values. The syntax is shadow=RRGGBB where RRGGBB is the color. Here's another example:

<IMG SRC="/counter?shadow=FFFFFF">

Here is a last example that uses all of the above together, notice that you can use an ampersand or comma as a separator:

<IMG SRC="/counter?highlight=FFFFFF,matte=C0C0C0&shadow=7F7F7F">


Transparency

If you wish to have part of your counter transparent so that any background colors or graphics show through, you can use the transparent option. This option turns any color of your choosing "transparent", so any counter element set to this color will display as transparent. For example, the following tag displays a transparent matte by turning the color C0C0C0 transparent, then setting the matte to this color:

<IMG SRC="/counter?transparent=C0C0C0,matte=C0C0C0">

 


Border You can adjust the width of the border that you see on your counter. This is fairly easy and allows you to customize the look.

The border option is set like this: border=N where N is the width of the border in dots.

Here are some examples:

Border of 20 pixels:
<IMG SRC="/counter?border=20">


Counter without a border:
<IMG SRC="/counter?border=0">

Counter "indented" into the page:

<IMG SRC="/counter?highlight=7F7F7F,matte=C0C0C0,shadow=FFFFFF,border=2">

 


Character Sets To further customize the look of your counter, we provide a choice of Character Sets which can be easily applied. Below is an illustration of each Character Set which can be used.

You change the character set using the same "option/value" syntax as other parameters, as in charset=marsil. Here is an example:

<IMG SRC="/counter?charset=marsil">

There are several styles to choose from, representing a good cross section of usable styles.


Dummy Variables

The counter syntax allows for the inclusion of "dummy" variables, meaningless options in the query string, as in:

<IMG SRC="/counter?any_name=any_value">

Using dummy variables is useful if you have two counters on separate pages with the exact same settings. When the tags are the same for two separate counters, the browser will cache the counter and may display the wrong number on a subsequent page.

When you insert a dummy variable into one or both of the tags, then the browser will consider them distinct (as the tags for them will be different), and will not display a cached version of a counter on the wrong page.

 


Syntax Summary The general syntax for adding a WebCom counter to your page is as follows:

<IMG SRC="/counter?highlight=RRGGBB, matte=RRGGBB,shadow=RRGGBB,border=N,charset=SSSSSS">

Note: the above is split up on multiple lines for clarity, do not split up the actual HTML tag.

highlight - This is the upper and left edges of the border, RRGGBB should be a color code.

matte - This is the fill color of the border area, RRGGBB should be a color code.

shadow - This is the lower and right edges of the border, RRGGBB should be a color code.

border - This is the thickness of the border in pixels, N is the number of pixels.

charset - This is the character set to use for the digits, SSSSSS should be one of these:

xfiles, marsil, odometer, caligraphy, stencil, neon, xfiles-white, clean, whirl, japanese, led, green-led, nextgen, ocr

 


Character Sets Illustration
Hex
Background 		Name Example
000000 xfiles
DDDDDD stencil
000000 neon
E0E0E0 caligraphy
F0F0F0 xfiles-white
000000 clean
000000 marsil
000000 whirl
000000 japanese
000000 green-led
000000 led
000000 odometer
000000 nextgen
000000 ocr
[an error occurred while processing this directive]