Inny wygląd listowania plików w Apache

Prosty artykuł pokazujący jak „upiększyć” biało – czarny wygląd listy plików generowanym przez serwer Apache. Artykuł nie prezentuje procesu samej instalacji modułu Module Index, lecz przedstawia sposób jego wykorzystania.

Sprawa zmiany domyślnego wyglądu listy plików generowanych przez mod_autoindex jest naprawdę prosta i nie wymaga wygórowanej wiedzy na temat administracji systemu. Opis modułu mod_autoindex dostępny jest również na Apache HTTP Server Version 1.3. W niniejszym artykule będę się jednak opierał o wersję z rodziny 2.x.

Na samym początku zajmiemy się sprawdzeniem, czy nasz serwer został odpowiednio skonfigurowany. Edytujemy więc plik: /etc/httpd/conf/httpd.conf (główny plik konfiguracyjny serwera). Otwieramy ten plik w dowolnym edytorze teksu i szukamy fragmentu LoadModule autoindex_module modules/mod_autoindex.so. Linia ta powinna być odkomentowana, a niżej w pliku powinnien znajdować się blok opisujący ten moduł”

[c]<IfModule mod_autoindex.c>
# FancyIndexing is whether you want fancy directory indexing or standard
IndexOptions FancyIndexing VersionSort NameWidth=*

# AddIcon* directives tell the server which icon to show for different
# files or filename extensions. These are only displayed for
# FancyIndexed directories.
AddIconByEncoding (CMP,/icons/compressed.png) x-compress x-gzip

AddIconByType (TXT,/icons/text.png) text/*
AddIconByType (IMG,/icons/image2.png) image/*
AddIconByType (SND,/icons/sound2.png) audio/*
AddIconByType (VID,/icons/movie.png) video/*

AddIcon /icons/binary.png .bin .exe
AddIcon /icons/binhex.png .hqx
AddIcon /icons/tar.png .tar
AddIcon /icons/world2.png .wrl .wrl.gz .vrml .vrm .iv
AddIcon /icons/compressed.png .Z .z .tgz .gz .zip
AddIcon /icons/a.png .ps .ai .eps
AddIcon /icons/layout.png .html .shtml .htm .pdf
AddIcon /icons/text.png .txt
AddIcon /icons/c.png .c
AddIcon /icons/p.png .pl .py
AddIcon /icons/f.png .for
AddIcon /icons/dvi.png .dvi
AddIcon /icons/uuencoded.png .uu
AddIcon /icons/script.png .conf .sh .shar .csh .ksh .tcl
AddIcon /icons/tex.png .tex
AddIcon /icons/bomb.png core

AddIcon /icons/back.png ..
AddIcon /icons/hand.right.png README
AddIcon /icons/folder.png ^^DIRECTORY^^
AddIcon /icons/blank.png ^^BLANKICON^^

# DefaultIcon is which icon to show for files which do not have an icon
# explicitly set.
DefaultIcon /icons/unknown.png

# AddDescription allows you to place a short description after a file in
# server-generated indexes. These are only displayed for FancyIndexed
# directories.
# Format: AddDescription "description" filename
AddDescription "GZIP compressed document" .gz
AddDescription "tar archive" .tar
AddDescription "GZIP compressed tar archive" .tgz

# ReadmeName is the name of the README file the server will look for by
# default, and append to directory listings.
# HeaderName is the name of a file which should be prepended to
# directory indexes.
ReadmeName /README.html
HeaderName /HEADER.html

# IndexIgnore is a set of filenames which directory indexing should ignore
# and not include in the listing. Shell-style wildcarding is permitted.
IndexIgnore .??* *~ *# HEADER* README* RCS CVS *,v *,t
</IfModule>[/c]

Najważniejsze, aby była odkomentowana opcja IndexOptions. Jeżeli wszystko jest zrobione poprawnie to wywołując adres naszego serwera z katalogiem, w którym nie ma pliku index.html powinniśmy zobaczyć listę plików i innych katalogów. Teraz czas na zmianę tego domyślnego wyglądu. Wszystko będzie się sprowadzało do stworzenia lub edycji dwóch plików: HEADER.html oraz FOOTER.html. Oczywiście nazwa tych plików może być inna, ale taka domyślnie figuruje w konfiguracji. Pierwszy plik będzie nam służył do stworzenia nagłówka listy plików. Umieszczamy tam style elementów HTMLa, definicję tła i kolory. W drugim pliku wpisujemy to co ma się pokazać w stopce.

Jeżeli wszystko przygotowaliśmy to kopiujemy pliki do głównego katalogu serwera (np. /var/www/html/). W pliku konfiguracyjnym serwera odnajdujemy sekcję:
[html] ReadmeName Filename
HeaderName Filename[/html]
W miejsce słowa Filename wpisujemy /FOOTER.html a w miejsce drugiego /HEADER.html. Oczywiście możemy podać inną scieżkę do tych plików. np.
ReadmeName /include/FOOTER.html.

Obie opcje HeaderName oraz ReadmeName traktują Filename jako względną ścieżkę w stosunku do folderu, do którego następuje prośba o wyświetlenie listy plików. Jeżeli wpiszemy a przeglądarce adres http://localhost/~marta/ to serwer będzie szukał w katalogu marta plików Filename do wygenerowania listingu. Jeżeli ich nie odnajdzie wyświetli domyślny styl. Przydaje się to, gdy chcemy każdy z folderów opisać innym stylem. Natomiast jeżeli zależy nam na globalnym ustawieniu stylu kopiujemy pliki do głównego katalogu serwera – DocumentRoot a w miejscu Filename wpisujemy / (slash) przed nazwą pliku. Teraz serwer będzie się odwoływał do obu plików względnie w stosunku do głównego katalogu serwera – DocumentRoot.

Zanim zobaczymy efekty naszej pracy musimy zrestartować serwer Apache. Jeżeli wszystko się udało powinniśmy zobaczyć ładnie stworzoną przez nas stronę.

W deklaracji stylów czcionek nie powinniśmy zmieniać ich typu, gdyż może to zepsuć formatowanie całej listy plików. Będzie to wyglądało nieestetycznie. Teraz czas na zabawę i fantazjowanie ze stylami CSS oraz HTMlem, aby stworzyć wymarzony wygląd listy plików naszego serwera. Więcej ciekawych opcji możemy wyszukać na stronie dokumentacji Apache Module mod_autoindex.