Selon les restrictions de votre site, lorsque vous arrivez dans un répertoire, Apache peut vous afficher tous les fichiers et dossiers contenus dans ce répertoire.
C’est mon objectif pour monter un petit partage rapide de fichiers…
Mais l’affichage de base est vraiment moche…
![]() |
L’affichage de base d’Apache |
![]() |
Affichage personnalisé |
Sécurité
Il est avant tout conseille d’interdire de lister les répertoires d’une manière générale, et de n’autoriser qu’au cas par cas le listing.
Pour interdire globalement sur tout le site, dans le httpd.conf, utiliser par exemple :
Options -Indexes
Et dans chaque répertoire que vous voulez autoriser à lister, créez un fichier .htaccess contenant uniquement :
Options +Indexes
Le mécanisme de base
A la racine du site, créez un fichier .htaccess contenant :
IndexOptions FancyIndexing FoldersFirst SuppressHTMLPreamble IndexOrderDefault Descending Name # # Fichiers header et footer (2 fichiers placés dans la racine du site) HeaderName /header.html ReadmeName /footer.html # # Fichiers à ignorer dans le listing IndexIgnore header.html footer.html favicon.ico .htaccess .ftpquota .DS_Store icons *.log *,v *,t .??* *~ *# # # Affichage avec des icones personnalisés (placés dans le répertoire /icons_perso à la racine du site) DefaultIcon /icons_perso/unknown.png # Répertoire AddIcon /icons_perso/folder.png ^^DIRECTORY^^ # Parent directory AddIcon /icons_perso/parent.png .. # Icones spécifiques aux types de fichiers AddIcon /icons_perso/text.png .txt AddIcon /icons_perso/image.png .jpg .jpeg .jpe .png .gif AddIcon /icons_perso/calendar.png .ics AddIcon /icons_perso/pdf.png .pdf AddIcon /icons_perso/zip.png .zip .rar AddIcon /icons_perso/video.png .mpg .avi AddIcon /icons_perso/audio.png .mp3 .wav AddIcon /icons_perso/word.png .doc .docx AddIcon /icons_perso/excel.png .xls .xlsx AddIcon /icons_perso/powerpoint.png .ppt .pps .ppsx
Les fichiers sources
À la racine du site, créez les deux fichiers header.html et footer.html, et le répertoire icons_perso avec les fichiers correspondants à l’intérieur.
En ce qui me concerne, voici mon header.html :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr" dir="ltr"> <head> <title>Répertoire</title> <style type="text/css"> body { background: #ffffff; margin: 33px; color: #333; font: Arial, Helvetica; font-size:0.9em; } h1 { font: 1.4em Verdana, Georgia, serif; background:url(/logo.png) top left no-repeat; line-height:35px; padding: 0 0 0 35px; } h1 a:hover, h1 a:active { text-decoration: none; } a:link { text-decoration: none; color: #333; } a:visited { text-decoration: none; color: #333; } a:hover, a:active { text-decoration: underline; color: #333; } pre { font: "Courier New", Courier; margin: 3px 0; color: #333; } pre img { display: inline; height:16px; width:16px; } </style> </head> <body> <h1>Contenu du répertoire</h1>
et mon footer.html :
<pre><em>© École La Mache</em></pre> <pre>Contenu réservé à l'usage des membres de l'École La Mache.</pre> <pre><a href="http://portail.ecolelamache.org/" title="Retour au portail de l'École La Mache">Retour au portail</a> </body> </html>