psst.. this blog is on hiatus.

Apache Directory Indexes 201

After composing a cute little entry roughly 10 days ago describing how to sex up your Apache directory indexes, I came across some additional information this morning that doesn’t exactly invalidate my previous post but makes it seem amateurish. So I’ve renamed my previous guide to Apache indexes “101″ and called this new and improved primer (it slices, it dices!) the “201″ (advanced) version.

The big advantages of 201 over 101 include:

  • Ability to set the <title>,
  • Flexibility to have code in the <head>, and
  • Most importantly: the ability to integrate indexes quickly with your existing template system.

So with a bit of luck and a bit of resolve, here’s what your directory listings can eventually look like: Indexes 201 example listing

First, before attempting this, I suggest you read Apache Directory Indexes 101. It provides some necessary background.

Done? Excellent. I am truly too lazy to recreate the introduction of that post. So let’s dive right in. Here’s what we’ll need in .htaccess to improve on 101:

  • SuppressHTMLPreample directive
    • This prevents Apache from generating that troublesome HTML code at the top of the index that includes <html>, the <head>, and the open <body> tag.
  • IgnoreCase directive
    • Lists files in alphabetical order, regardless of case. Desirable.
  • SuppressDescription directive
    • Wipes out the (mostly useless) description column.
  • NameWidth directive
    • Forces the name column to be as wide as the longest filename in the list.

So that brings me to my fancy new .htaccess, in sum:

Options Indexes
IndexOptions +IgnoreCase +SuppressDescription NameWidth=* +SuppressHTMLPreamble
HeaderName /path/to/header.shtml
ReadmeName /path/to/footer.shtml

Note that I didn’t turn off FancyIndexing as I did in 101. That’s because I got a clue and decided to use the <pre>-based layout but to rip out the description and last modified columns.

Where does this get us? Well, not very far if you don’t make a Header and Readme (i.e. footer) file. By using SSI craftily, you can create a meaningful page title. That is, if your header and footer use the .shtml extension, Apache will process them and give your directory indexes a bit of a dynamic flavor.

How you integrate the index into your overall content management scheme depends on your individual setup, but here’s a sample to get the creative juices flowing:

—Sample Header—
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
“http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head><title>index of <!–#echo var=”REQUEST_URI” –></title>

<style type=”text/css”><!–
HR { display: none; }
–></style>

</head><body>

[include template via SSI, PHP, or whatever you use]

<h1>index of <!–#echo var=”REQUEST_URI” –></h1>

Note the use of the echo’d SSI variable. This list of environmental variables that can be used in your index may be of use.

—Sample Readme—
</body></html>

Hopefully I’ve provided enough direction for you to go forth and do amazing things with your own Apache indexes. If you discover anything great, gimme a holler.

«
»