capturadepantalla

Show nicer file listings with Apache autoindex module

Recently I have working on “mabishu-apache-autoindex”, a set of html, css, icons and image files designed to work together with the mod_autoindex module to make the default Apache file listings look a little nicer.  Try this screenshot demo and If you like it, grab the source files at my Github repository, now I’ll explain how to set it up.

Installation

First, get a copy of the “include” folder – the easiest way is to change to the document root of the domain you want to style, and check it out from git:

$ cd /var/www/YOUR.VHOST.LOCAL
$ git clone http://github.com/frandieguez/mabishu-apache-autoindex.git

This should create an ‘include’ folder in the parent of your document root. Next, you need to configure Apache to use the “includes” files to style your directory listings.

I use the following config, which you’ll need to adjust to match your particular setup – the ‘icons’ and ‘includes’ alias and the ‘mod_autoindex’ section are the main areas to pay attention to:

# Virtualhost example configuration file with autoindex theme support
 <VirtualHost *:80>
  ServerName your.vhost.local

  DocumentRoot /var/www/your.vhost.local/public_html

  # Define where is the theme and icons directory
  Alias /icons/ /var/www/your.vhost.local/include/icons/
  Alias /include/ /var/www/your.vhost.local/include/

  <Directory "/var/www/your.vhost.local/public_html">
    AllowOverride All
    Order allow,deny
    Allow from all

    # Tell Apache to add theme support to autoindex
    <IfModule mod_autoindex.c>
      Options Indexes FollowSymLinks
      IndexOptions +FancyIndexing
      IndexOptions +VersionSort
      IndexOptions +HTMLTable
      IndexOptions +FoldersFirst
      IndexOptions +IconsAreLinks
      IndexOptions +IgnoreCase
      IndexOptions +SuppressDescription
      IndexOptions +SuppressHTMLPreamble
      IndexOptions +XHTML
      IndexOptions +IconWidth=16
      IndexOptions +IconHeight=16
      IndexOptions +NameWidth=*
      IndexOrderDefault Descending Name
      HeaderName /include/header.html
      ReadmeName /include/footer.html
    </ifModule>

  </Directory>
 </VirtualHost>

You’ll need mod_autoindex for any of this to work – it should be installed by default with Apache in most linux distributions.

Disclaimer

The formatting relies on a few javascript hacks which may or may not work exactly as intended if the output of your apache directory listings differs a lot from what is expected. If the output appears strange, try playing around with the javascript formatting in header.html, or drop me a line if you need a hand.

5 Comments

  1. MagoNicola

    Hi,

    first of all, GREAT JOB!

    I used your htaccess template in my website http://unina.stidue.net but I have a problem: how to use .php files instead of .html as header and footer? I followed so many guides in internet but no one works.
    If it’s impossible, is there a way to change the head html title and keywords BEFORE page is loaded and not after via js – because Google Spider doesen’t see these changes?
    Thank you!

  2. MagoNicola

    PS: Change html title dinamically, depending on folder the user is browsing in…

  3. MagoNicola

    PS2: not only your .htaccess system doesen’t work. You can see an example here: http://summer.stidue.net/
    The php file is foud but is not parsed by PHP preprocessor…
    Thank you!

  4. Fran Diéguez

    @all Remember that this is only for folder listing. As soon as you use PHP Apache folter listing doesn’t take in place cause the output is handled by mod_php.

  5. Some Random Keyboard Skater

    it’s not working for me ..

Leave a Reply