home > notes > SSI Banners [ printer-friendly version ]
Animal Crossing
AOL Images
baked beans
Bass Guitar
AOL main.idx
Crash IE
Disk Hog
Dual Heads
FireFox prefetch
Highway Hacking
ISO images
Chip's Challenge
sims cheats
Sim Tower hack
Solaris USB
spray cans
SSI Banners
HTML Symbols
ToolTalk error
CDE Wallpaper
Windows 7 Password

Rotating Text And Banners with SSI


If your Web server supports SSI (Server-Side Include) processing, you can use that functionality to produce pseudo-random rotation of banner images and/or page text. This article explains how to use a standard SSI template to provide varying page content without resorting to complex CGI programming.

What is SSI?

In simplest terms, SSI is a set of extra directives you can embed in your HTML content. The directives look like HTML comments, but they are interpreted as Web server directives by servers that are SSI-compatible and have the SSI function enabled. The SSI operations specified are processed by the Web server before the page content is rendered to the browser, letting you define logical operations and file includes that will be done in real time as pages are accessed. SSI directives are often used to simplify site architecture and maintenance; for example, you might define page headers and footers in one file and then use SSI to include that information in every page on your site. Should you need to update the footer information, you would only have to change one file - after that point, the SSI include processing done on all your pages would pick up the new information automatically.

An exhaustive treatment of SSI is beyond the scope of this article. If you are altogether unfamiliar with SSI processing, you need to do a little research on it (perhaps referencing the O'Reilly manual for the Apache web server).

How do you enable SSI processing?

On an Apache web server, I always put this line in the config or .htaccess file to enable SSI processing:

    AddHandler server-parsed .html
This is a departure from the usually suggested method for using SSI to dynamically assemble page content; most reference material suggests only doing SSI processing on files named with the .shtml extension (or some other naming convention designed to make it obvious which pages undergo SSI processing). By turning on SSI for regular HTML files, you can be sneaky and dynamically assemble pages that appear to be plain old static content.

Varying Page Display via SSI

SSI directives are not terribly powerful, but it is possible to combine some very simple functions to produce a pseudo-random variation in page content. The variation is actually not the slightest bit random, but it can impress the casual site visitor - just don't expect too much. Here's the key to the whole thing: SSI can do a simple pattern match on the time of day, and you can code simple if/elseif blocks that serve varying content (or contain SSI include directives that point to varying content) based on the results of the pattern match.

The most impressive use of this technique involves sixty different variations of the 'random' content. That's right, sixty. In that application, the SSI code picks one of the sixty unique choices based on the 'seconds' value of the current time. As your guest bounces around various links, minor variations in network latency and page load time will have the effect of pseudo-randomly rolling a 60-sided die, resulting in enough variation in page content to stimulate more interest than a static display might do.

In cases where you don't have sixty distinct pieces of content, you can 'wrap the content around the clock' by specifying the same content to be displayed at equal intervals. Let's say, for example, you have six image files that you'd like to rotate as banner images. You could map these six images evenly onto sixty seconds as follows:

  • 1.jpg : second 00, 06, 12, 18, 24, 30, 36, 42, 48, 54
  • 2.jpg : second 01, 07, 13, 19, 25, 31, 37, 43, 49, 55
  • 3.jpg : second 02, 08, 14, 20, 26, 32, 38, 44, 50, 56
  • 4.jpg : second 03, 09, 15, 21, 27, 33, 39, 45, 51, 57
  • 5.jpg : second 04, 10, 16, 22, 28, 34, 40, 46, 52, 58
  • 6.jpg : second 05, 11, 17, 23, 29, 35, 41, 47, 53, 59

With this 'wrapping around the clock' technique, you can see that the selection of which image file to display is spread evenly across the 60 seconds in a minute, adding to the apparent randomness of the choice. You could also work in the other direction, calling for some images (or text) on more second values than others, thus 'weighting' some choices more than others.

SSI Template

Here's the SSI code you could use to check the system clock and include any one of sixty witticisms on a Web page (if these look familiar, it's because this is exactly the code used to embed the little phrases in the page footers on the okbanlon.com web site):

<!--#if expr="$DATE_LOCAL = /:00 /" -->
I say we nuke it from orbit. It's the only way to be sure.
<!--#elif expr="$DATE_LOCAL = /:01 /" -->
Never build a temple when all you need is an outhouse.
<!--#elif expr="$DATE_LOCAL = /:02 /" -->
Chance is irrelevant. We WILL succeed!
<!--#elif expr="$DATE_LOCAL = /:03 /" -->
Meddle ye not in the affairs of dragons, for thou art crunchy and good with ketchup!
<!--#elif expr="$DATE_LOCAL = /:04 /" -->
Time flies like an arrow. Fruit flies like a banana.
<!--#elif expr="$DATE_LOCAL = /:05 /" -->
Master of Time and Space since 1963!
<!--#elif expr="$DATE_LOCAL = /:06 /" -->
Void where prohibited.
<!--#elif expr="$DATE_LOCAL = /:07 /" -->
Keep away from children.
<!--#elif expr="$DATE_LOCAL = /:08 /" -->
For external use only. If rash develops, discontinue use.
<!--#elif expr="$DATE_LOCAL = /:09 /" -->
Your dog secretly thinks you're an idiot, but will never admit it.
<!--#elif expr="$DATE_LOCAL = /:10 /" -->
Beware the Pogonip.
<!--#elif expr="$DATE_LOCAL = /:11 /" -->
Eat more beans - America needs the gas.
<!--#elif expr="$DATE_LOCAL = /:12 /" -->
You will tread the night soil of many countries.
<!--#elif expr="$DATE_LOCAL = /:13 /" -->
All battles are fought uphill, in the rain.
<!--#elif expr="$DATE_LOCAL = /:14 /" -->
Your equipment was made by the lowest bidder.
<!--#elif expr="$DATE_LOCAL = /:15 /" -->
The most dangerous thing on the battlefield is an officer with a map.
<!--#elif expr="$DATE_LOCAL = /:16 /" -->
No battle plan survives contact with the enemy.
<!--#elif expr="$DATE_LOCAL = /:17 /" -->
If it's stupid but it works, it ain't stupid.
<!--#elif expr="$DATE_LOCAL = /:18 /" -->
The easy way is always mined.
<!--#elif expr="$DATE_LOCAL = /:19 /" -->
If your advance is going well, you are walking into an ambush.
<!--#elif expr="$DATE_LOCAL = /:20 /" -->
A good plan today is better than a perfect plan tomorrow.
<!--#elif expr="$DATE_LOCAL = /:21 /" -->
Always know when it's time to get out of Dodge.
<!--#elif expr="$DATE_LOCAL = /:22 /" -->
Always know how to get out of Dodge.
<!--#elif expr="$DATE_LOCAL = /:23 /" -->
The enemy diversion you are ignoring is the main attack.
<!--#elif expr="$DATE_LOCAL = /:24 /" -->
Perfect is the enemy of good enough.
<!--#elif expr="$DATE_LOCAL = /:25 /" -->
If at first you don't succeed, call for artillery. When that doesn't work, call for an air strike.
<!--#elif expr="$DATE_LOCAL = /:26 /" -->
Learn from the mistakes of others. You won't live long enough to make all of them yourself.
<!--#elif expr="$DATE_LOCAL = /:27 /" -->
Keep looking around. There's always something you've missed.
<!--#elif expr="$DATE_LOCAL = /:28 /" -->
Professional soldiers are predictable, but the world is full of amateurs.
<!--#elif expr="$DATE_LOCAL = /:29 /" -->
Settle down, people - this ain't rocket science.
<!--#elif expr="$DATE_LOCAL = /:30 /" -->
Great Googly-Moogly!
<!--#elif expr="$DATE_LOCAL = /:31 /" -->
Life is a tale told by an idiot, full of sound and fury, signifying nothing.
<!--#elif expr="$DATE_LOCAL = /:32 /" -->
Black Cat is the Best you can Get.
<!--#elif expr="$DATE_LOCAL = /:33 /" -->
Don't you pee on my leg and tell me it's raining!
<!--#elif expr="$DATE_LOCAL = /:34 /" -->
Colonel Flagg: No one sees him come, no one sees him go.
<!--#elif expr="$DATE_LOCAL = /:35 /" -->
Never try to teach a pig to sing. It wastes your time and annoys the pig.
<!--#elif expr="$DATE_LOCAL = /:36 /" -->
If you can't dazzle 'em with brilliance, baffle 'em with bullshit.
<!--#elif expr="$DATE_LOCAL = /:37 /" -->
Reality 2.0: Score counter, extra men, and hints!
<!--#elif expr="$DATE_LOCAL = /:38 /" -->
Cry havoc, and let slip the dogs of war!
<!--#elif expr="$DATE_LOCAL = /:39 /" -->
In the South, quality entertainment consists of a six-pack and a bug zapper.
<!--#elif expr="$DATE_LOCAL = /:40 /" -->
All will be revealed in time.
<!--#elif expr="$DATE_LOCAL = /:41 /" -->
Flee at once! All is discovered!
<!--#elif expr="$DATE_LOCAL = /:42 /" -->
Are we having fun yet?
<!--#elif expr="$DATE_LOCAL = /:43 /" -->
I know life isn't fair, but does it always have to suck?
<!--#elif expr="$DATE_LOCAL = /:44 /" -->
No electrons were harmed during the creation of this page.
<!--#elif expr="$DATE_LOCAL = /:45 /" -->
This page constructed entirely of 100% recycled electrons.
<!--#elif expr="$DATE_LOCAL = /:46 /" -->
Post No Bills
<!--#elif expr="$DATE_LOCAL = /:47 /" -->
<!--#elif expr="$DATE_LOCAL = /:48 /" -->
<!--#elif expr="$DATE_LOCAL = /:49 /" -->
Notary Sojac
<!--#elif expr="$DATE_LOCAL = /:50 /" -->
Welcome to the Black Mesa Research Facility. Have a safe and productive day!
<!--#elif expr="$DATE_LOCAL = /:51 /" -->
I love animals - they're delicious!
<!--#elif expr="$DATE_LOCAL = /:52 /" -->
Earth First! We'll strip-mine the other planets later!
<!--#elif expr="$DATE_LOCAL = /:53 /" -->
Beware of the Leopard
<!--#elif expr="$DATE_LOCAL = /:54 /" -->
Alcohol, Tobacco, and Firearms - who's bringing the chips?
<!--#elif expr="$DATE_LOCAL = /:55 /" -->
Is your church BATF-approved?
<!--#elif expr="$DATE_LOCAL = /:56 /" -->
May you live in interesting times!
<!--#elif expr="$DATE_LOCAL = /:57 /" -->
A lone amateur built the Ark. A team of experts built the Titanic.
<!--#elif expr="$DATE_LOCAL = /:58 /" -->
Toto, I don't think we're in Kansas any more.
<!--#elif expr="$DATE_LOCAL = /:59 /" -->
Resistance is futile.
<!--#else -->
I say we nuke it from orbit. It's the only way to be sure.
<!--#endif -->

It's ugly, it's inefficient, it's definitely a brute-force approach - but it works, and it can let you rotate banner graphics and/or other page components in a manner that's 'random enough' to spark the interest of your site's visitors.

Obviously, banner graphic rotation would just involve editing the above template and replacing the lines of text with <img> tags. You could also use SSI include directives for the various choices; in fact, this trick could be used on hugely complex constructions of text, graphics, lower-level SSI includes, style sheet references, and so on. If you were sufficiently warped, you could abstract style elements and page components such that the entire look and feel of your Web site varies dramatically second by second as visitors change pages. Your visitors would soon be screaming for your head on a platter, but it could be done.


This approach to pseudo-random page content generation is really nothing more than a parlor trick, but you may find it handy. If you can enable SSI processing on your web server but don't want to bother with an elaborate banner rotation scheme, this might just be the approach you're looking for.

home Don't you pee on my leg and tell me it's raining! privacy