What are Server Side Includes?

Server Side Includes (SSI) are directives in HTML pages that are evaluated on the server. They look like HTML comments and allow dynamic content inclusion in static pages. The #exec cgi directive runs a CGI script and includes its output.

Do I need Server Side Includes to run this?

Yes, this script requires SSI. Alternatives include the basic Random Image Displayer, JavaScript for client-side selection, or PHP's include() function.

How do I enable SSI on Apache?

Add Options +Includes to enable SSI, and AddHandler server-parsed .shtml to specify which files to process. Ensure mod_include is enabled.

Can I track click-through rates?

Yes, use a redirect script that logs clicks, add JavaScript click handlers, or use UTM parameters for Google Analytics tracking.

How do I use different image sets on different pages?

Modify the script to accept a query parameter specifying the set, then load the appropriate image configuration based on that parameter.

Why do I see an error occurred while processing this directive?

This usually means SSI is not enabled, the CGI script has incorrect permissions, the Perl path is wrong, there's a syntax error, or the path in the SSI directive is incorrect.

SSI Random Image Displayer

Advanced Rotating Banner with Links and Alt Text

SSI Random Image Displayer is an extended version of the basic Random Image Displayer. This version outputs a complete IMG tag with corresponding random link, alt text, width, height, and other configurable attributes using Server Side Includes.

Free Download
Version 1.0
Perl CGI + SSI

Download Documentation Basic Version

Server Side Includes Required: This script requires SSI to be enabled on your web server. If you don't have SSI available, use the basic Random Image Displayer instead.

Fan Archive: This is a preservation of classic CGI scripts from the early web era. For modern banner rotation with full control, JavaScript provides better solutions with animations, analytics integration, and no server configuration requirements.

Overview

SSI Random Image Displayer extends the basic random image script by outputting a complete HTML snippet rather than just image data. This allows each random image to have its own associated link, alt text, width, height, and other attributes.

How It Works

The script is called via SSI directive in your .shtml page. It randomly selects an entry from its configuration and outputs the complete HTML (image tag wrapped in anchor tag if a link is specified). The browser receives ready-to-render HTML as part of the page.

Package Contents

File	Description
`ssi_rand_image.pl`	Main Perl script that outputs random image HTML tags
`README`	Installation instructions and configuration guide

Advantages over Basic Version

Clickable images with links
Alt text for accessibility
Width/height attributes
Border control
Custom CSS classes
Target window control

Features

Associated Links

Each image can have its own destination URL. Perfect for clickable banner ads with tracking.

Alt Text Support

Specify alt text for each image for better accessibility and SEO.

Dimensions

Set width and height attributes to prevent layout shift during image loading.

Target Control

Open links in new windows or specific frames using the target attribute.

True Randomness

Each page load selects a truly random image from your configured set.

Easy Configuration

Simple data structure to configure multiple images with all their attributes.

Configuration Options

Option	Description	Example
`image`	URL path to the image file	`/images/banners/sponsor1.gif`
`link`	Destination URL when image is clicked	`https://sponsor.com/`
`alt`	Alternative text for accessibility	`Visit Our Sponsor`
`width`	Image width in pixels	`468`
`height`	Image height in pixels	`60`
`border`	Border width (0 for no border)	`0`
`target`	Link target window/frame	`_blank`

Installation

Enable Server Side Includes
Ensure SSI is enabled in your Apache configuration with Options +Includes and AddHandler server-parsed .shtml.
Upload the Script
Upload ssi_rand_image.pl to your cgi-bin directory.
Configure Perl Path
Edit the first line to point to your Perl interpreter (usually #!/usr/bin/perl).
Configure Image Data
Edit the script to add your images with their links, alt text, and dimensions.
Set Permissions
Set the script permissions to 755: chmod 755 ssi_rand_image.pl
Add SSI Directive
Add  to your .shtml page.

Code Examples

SSI Usage in .shtml Files

<!-- Basic SSI include -->
<!--#exec cgi="/cgi-bin/ssi_rand_image.pl"-->

<!-- In context of a page -->
<!DOCTYPE html>
<html>
<head>
    <title>My Page</title>
</head>
<body>
    <h1>Welcome to My Site</h1>

    <!-- Random banner will appear here -->
    <div class="banner-container">
        <!--#exec cgi="/cgi-bin/ssi_rand_image.pl"-->
    </div>

    <p>Main content goes here...</p>

    <!-- Another random banner in footer -->
    <footer>
        <!--#exec cgi="/cgi-bin/ssi_rand_image.pl?set=footer"-->
    </footer>
</body>
</html>

<!-- Example output from script -->
<a href="https://sponsor.com/" target="_blank">
    <img src="/images/banners/sponsor1.gif"
         alt="Visit Our Sponsor"
         width="468" height="60" border="0">
</a>

Perl Implementation

#!/usr/bin/perl
use strict;
use warnings;

# Configuration - array of image data
my @images = (
    {
        image  => '/images/banners/sponsor1.gif',
        link   => 'https://sponsor1.com/',
        alt    => 'Sponsor 1 - Premium Hosting',
        width  => 468,
        height => 60,
        target => '_blank',
    },
    {
        image  => '/images/banners/sponsor2.gif',
        link   => 'https://sponsor2.com/',
        alt    => 'Sponsor 2 - Web Design',
        width  => 468,
        height => 60,
        target => '_blank',
    },
    {
        image  => '/images/banners/sponsor3.png',
        link   => 'https://sponsor3.com/',
        alt    => 'Sponsor 3 - Domain Names',
        width  => 468,
        height => 60,
        target => '_blank',
    },
);

# Select random image
my $img = $images[int(rand(@images))];

# Build HTML output
my $html = '';

# Start with link if present
if ($img->{link}) {
    $html .= qq{{target};
    $html .= qq{ rel="noopener noreferrer"} if $img->{target} eq '_blank';
    $html .= '>';
}

# Add image tag
$html .= qq{{alt};
$html .= qq{ width="$img->{width}"} if $img->{width};
$html .= qq{ height="$img->{height}"} if $img->{height};
$html .= qq{ border="0"};
$html .= '>';

# Close link if present
if ($img->{link}) {
    $html .= '';
}

# Output
print "Content-type: text/html\n\n";
print $html;

exit 0;

PHP Implementation

<?php
/**
 * SSI Random Image Displayer - PHP Version
 * Can be included directly in PHP pages
 */

$images = [
    [
        'image'  => '/images/banners/sponsor1.gif',
        'link'   => 'https://sponsor1.com/',
        'alt'    => 'Sponsor 1 - Premium Hosting',
        'width'  => 468,
        'height' => 60,
        'target' => '_blank',
    ],
    [
        'image'  => '/images/banners/sponsor2.gif',
        'link'   => 'https://sponsor2.com/',
        'alt'    => 'Sponsor 2 - Web Design',
        'width'  => 468,
        'height' => 60,
        'target' => '_blank',
    ],
    [
        'image'  => '/images/banners/sponsor3.png',
        'link'   => 'https://sponsor3.com/',
        'alt'    => 'Sponsor 3 - Domain Names',
        'width'  => 468,
        'height' => 60,
        'target' => '_blank',
    ],
];

// Select random image
$img = $images[array_rand($images)];

// Build HTML
function buildRandomImage($img) {
    $html = '';

    // Start link if present
    if (!empty($img['link'])) {
        $html .= '


        
            JavaScript Implementation (Recommended)
            /**
 * SSI Random Image Displayer - JavaScript Version
 * Full-featured client-side banner rotation
 */

class BannerRotator {
    constructor(element, banners, options = {}) {
        this.element = typeof element === 'string'
            ? document.querySelector(element)
            : element;

        this.banners = banners;
        this.options = {
            interval: 0,           // 0 = no auto-rotation
            fadeTransition: true,
            transitionDuration: 300,
            trackClicks: false,
            trackImpressions: false,
            ...options
        };

        this.currentIndex = -1;
        this.init();
    }

    init() {
        this.showRandom();

        if (this.options.interval > 0) {
            setInterval(() => this.showRandom(), this.options.interval);
        }
    }

    showRandom() {
        // Avoid showing same banner twice in a row
        let newIndex;
        do {
            newIndex = Math.floor(Math.random() * this.banners.length);
        } while (newIndex === this.currentIndex && this.banners.length > 1);

        this.currentIndex = newIndex;
        const banner = this.banners[newIndex];

        if (this.options.fadeTransition) {
            this.fadeTransition(banner);
        } else {
            this.renderBanner(banner);
        }

        if (this.options.trackImpressions) {
            this.trackImpression(banner);
        }
    }

    fadeTransition(banner) {
        this.element.style.transition = `opacity ${this.options.transitionDuration}ms`;
        this.element.style.opacity = '0';

        setTimeout(() => {
            this.renderBanner(banner);
            this.element.style.opacity = '1';
        }, this.options.transitionDuration);
    }

    renderBanner(banner) {
        let html = '';

        // Start link if present
        if (banner.link) {
            const target = banner.target ? ` target="${banner.target}"` : '';
            const rel = banner.target === '_blank' ? ' rel="noopener noreferrer"' : '';
            const clickHandler = this.options.trackClicks
                ? ` onclick="return bannerClick('${banner.id || banner.image}')"` : '';
            html += ``;
        }

        // Image tag
        html += `





     Download

    
        
            
                
                     Compressed Archives
                
                
                    
                        
                             ssi_image.tar.gz
                            3.9 KB
                        
                        
                             ssi_image.zip
                            4.7 KB
                        
                        
                             ssi_image.tar.Z
                            5.8 KB
                        
                        
                             ssi_image.tar
                            20.5 KB
                        
                    
                
            
        
        
            
                
                     Individual Files
                
                
                    
                        
                             ssi_rand_image.pl
                            Main Perl script that outputs random image HTML
                        
                        
                             README
                            Installation instructions and configuration guide
                        
                    
                
            
        
    

    
         Go to Downloads
         Basic Version
    




     Frequently Asked Questions

    
        
            
                
            
            
                
                    Server Side Includes (SSI) are directives placed in HTML pages that are evaluated on the server when a page is served. They look like HTML comments: <!--#command parameter="value"-->. SSI allows you to include dynamic content in otherwise static HTML pages without a full server-side language like PHP. The #exec cgi directive runs a CGI script and includes its output.
                
            
        
        
            
                
            
            
                
                    Yes, this script requires SSI to work as intended. If your server doesn't support SSI, you have alternatives: (1) Use the basic Random Image Displayer which works with standard IMG tags, (2) Use JavaScript for client-side random image selection, or (3) Use PHP's include() if you have PHP available.
                
            
        
        
            
                
            
            
                
                    Add these directives to your Apache configuration or .htaccess file: Options +Includes to enable SSI, and AddHandler server-parsed .shtml to tell Apache which files to process. You can also use AddOutputFilter INCLUDES .html to process all HTML files. Ensure mod_include is enabled: a2enmod include on Debian-based systems.
                
            
        
        
            
                
            
            
                
                    Yes, you can track clicks by: (1) Using a redirect script that logs clicks before forwarding to the destination, (2) Adding JavaScript click handlers that beacon to your tracking endpoint, or (3) Using UTM parameters in your destination URLs for Google Analytics tracking. For impressions, log each script execution with timestamp and image served.
                
            
        
        
            
                
            
            
                
                    Modify the script to accept a query parameter: <!--#exec cgi="/cgi-bin/ssi_rand_image.pl?set=sponsors"-->. The script reads $ENV{QUERY_STRING} and loads the appropriate image configuration based on the set parameter. You can store different sets in separate config files or in a hash within the script.
                
            
        
        
            
                
            
            
                
                    This error usually means: (1) SSI is not enabled on your server, (2) The CGI script has incorrect permissions (should be 755), (3) The Perl path in the script is wrong, (4) The script has a syntax error, or (5) The path to the CGI script in the SSI directive is incorrect. Check your Apache error logs for specific details.
                
            
        
        
            
                
            
            
                
                    Yes, JavaScript is the modern standard for banner rotation. It doesn't require server configuration, allows smooth transitions, supports click tracking, and can preload images. For ad serving specifically, consider Google AdSense, dedicated ad networks, or platforms like RevContent that provide full tracking, targeting, and optimization.
                
            
        
        
            
                
            
            
                
                    Yes, add a weight field to each image configuration and implement weighted random selection. Instead of simple random selection, calculate cumulative weights and select based on a random number within the total weight range. Premium sponsors would have higher weights and appear more frequently.
                
            
        
    




     Related Scripts

    
        
            
                
                     Random Image Displayer
                    Basic random image display without SSI requirements.
                    View Script
                
            
        
        
            
                
                     Random Link
                    Randomly redirect visitors to different URLs.
                    View Script
                
            
        
        
            
                
                     TextClock
                    Display date/time using Server Side Includes.
                    View Script

SSI Random Image Displayer

Overview

How It Works

Package Contents

Features

Associated Links

Alt Text Support

Dimensions

Target Control

True Randomness

Easy Configuration

Configuration Options

Installation

Code Examples

SSI Usage in .shtml Files

Perl Implementation

PHP Implementation

JavaScript Implementation (Recommended)

Download

Frequently Asked Questions

What are Server Side Includes?

Do I need Server Side Includes to run this?

How do I enable SSI on Apache?

Can I track click-through rates?

How do I use different image sets on different pages?

Why do I see [an error occurred while processing this directive]?

Is there a modern alternative?

Can I use weighted rotation for premium sponsors?

Related Scripts

Random Image Displayer

Random Link

TextClock