Free Webmasters Resource
 

Free Graphics, Tutorials, Scripts, Webmaster Forums, Web Templates, SEO Tools, & Much More!!

Home Scripts Tutorials Free Downloads Articles SEO Play Free Games Web Templates

Server Side Includes (SSI)

SSI can save you a lot of time and code.

SSI (Server Side Includes) is an affective way to include dynamic content thoughout a web site. This is accomplished by putting one line of code on various web pages which references and outputs code from one location. SSI can is often used for web site headers, footers, and for elements like news scripts. SSI is makes us of CGI which it a feature provided by almost all hosting providers nowadays. Similar results can also be had by uses PHP, ASP, or other server languages. But, anywho, let's get started.

The basic syntax for SSI is:

<!--#command="file that is being included"-->


The most widely used SSI's are CGI execution, Include File, and Time and Date inclusion. Here is the syntax, for example, if you execute a cgi script called file.cgi:

<!--#exec cgi="file.cgi"-->


If you wanted to include an HTML fragment saved as the file, "file.html," you would use the following code:

<!--#include file="file.html"-->


Lastly, to include the date, you would use:

<!--#echo var="DATE_LOCAL"-->


In the first version of Spoono, we once included a footer using SSI at the bottom of every page which looked like this:

<!--#exec cgi="footer.cgi"-->


This linked to the footer.cgi file which contained the following:

#!/usr/bin/perl

print "Content-type: text/html\n\n";
print <<EOF ;

<BR><DIV ALIGN=CENTER CLASS="footer"><A HREF="/">Home</A> | <A href="/webmaster-info/tutorials/index.asp">Tutorials</A> | <A
HREF="/webmaster-resources/">Webmaster Resources</A> | <A HREF="/Sitemap/">Site Map</A> | <A
HREF="/support/forum/">Support Forum</A></DIV><BR><DIV ALIGN=CENTER CLASS="copy">Copyright ©2006. All Rights Reserved.<BR>
Please view our <A HREF="/about/terms.asp">Terms of Service</A>.</DIV><BR>

EOF

exit;


You might not understand the CGI portion, but you get the idea that the HTML is what is inserted. Similarly, I could use the include file command and create a footer.html file (note: use include file with HTML files and exec cgi for CGI files). For example, here is what footer.html would look like:

<BR><DIV ALIGN=CENTER CLASS="footer"><A HREF="/">Home</A> | <A href="/webmaster-info/tutorials/index.asp">Tutorials</A> | <A
HREF="/webmaster-resources/">Webmaster Resources</A> | <A HREF="/Sitemap/">Site Map</A> | <A
HREF="/support/forum/">Support Forum</A></DIV><BR><DIV ALIGN=CENTER CLASS="copy">Copyright © 2006. All Rights Reserved.<BR>
Please view our <A HREF="/about/terms.asp">Terms of Service</A>.</DIV><BR>


And to insert this HTML using the include file command, input this code:

<!--#include file="footer.html"-->



For a quick review, the general form for making an a exec cgi file like our footer example is like the following:

#!/usr/bin/perl

print "Content-type: text/html\n\n";
print <<EOF ;

YOUR HTML GOES HERE

EOF
exit;


Remember #!/usr/bin/perl is the path to PERL for Spoono, contact your server administrator for your PERL path. Also, save this as a cgi file, and upload it to your server (CHMOD: 755), and call it, as described, in the file where you want to include the HTML.

 

Tutorials: HTML

Title/Description

Level

Backgrounds: Tutorial
Learn how to effectively add backgrounds to your page that make your page look professional or amateur.

Beginner

Imagemaps: Tutorial
Make one image into various clickable regions using only HTML

Intermediate

Embedding Fonts: Tutorial
Learn how to use uncommon fonts in web pages by embedding them.

Advanced

Images: Tutorial
Positioning images can make your images look just right when inserted into text.

Intermediate

Form Effects: Tutorial
Learn how to create trendy forms with simple style commands as well as with CSS classes.

Intermediate

Layers: Tutorial
Layers can make complicated image placement possible.

Advanced

Forms: Tutorial
Use forms to gather information from your users.

Advanced

Links: Tutorial
Making links in HTML is the easiest thing you will ever do.

Beginner

Frames: Tutorial
Learn how to create frames that enable you to create navigation systems on your site.

Advanced

Scrollbars: Tutorial
Learn how to add effects to your scrollbars and add flavor to your page.

Advanced

Hide From Print: Tutorial
Learn how to only allow a visitor to print part of your page using CSS.

Intermediate

SSI: Tutorial
Learning how to do SSI will save you a lot of authoring time.

Advanced

Horizontal Line: Tutorial
The horizontal line serves as a great separator tool.

Beginner

Table Styles: Tutorial
Learn how to add various table styles such as dash or dot borders, and many other things.

Intermediate

Iframes: Tutorial
Iframes can organize your website into clean sections.

Advanced

Tables: Tutorial
Organize your web page layouts with tables.

Intermediate

216 Web Safe Color Chart: Tutorial
The 216-color color-safe palette refers to colors (RGB values) that will appear the same on either IE or Netscape and Windows or Mac platforms.

Beginner

Pantone RGB/Hex/HTML Colors: Tutorial
This table contains all pantone colors converted to RGB and Hex. It displays them all in HTML colors.

Intermediate

 


Home Contact Credits Flash Templates Webmaster Forums Site Map Webmaster Resources Advertise

Templates Resource Hosting
Domain Names · Templates Resource · Myspace Layouts