Personnaliser l’affichage de son FTP

Personnaliser le listing des fichiers apache

Dans ce tutoriel vidéo vous allez apprendre comment changer l’apparence de votre FTP. Quand je parle de FTP je veux parler de l’arborescence lorsque nous naviguons dans les dossiers de nos sites avec un navigateur. Pour vous faire une idée concrète du tutoriel, voici une image avant/après (ou cliquez ici pour voir un exemple) :

 

Le principe pour personnaliser son FTP est très simple et il se fait en 2 grandes étapes :

  1. On crée ces fichiers header et footer qui contiennent le design de l’entête et du pied de page
  2. On affecte à chaque type de fichier (.pdf, .avi et j’en passe) une image plus jolie que celle par défaut mais aussi une description.

Voici la vidéo qui détaille principalement la seconde étapes.

Comme vous avez pu le constater dans la vidéo ce n’est pas bien compliqué, c’est surtout très répétitif. Néanmoins voici un petit résumé sur le fichier htaccess avec quelques précisions :

# On précise le chemin de l'entete et footer
HeaderName /tutoriel/ftp/header.htm
ReadmeName /tutoriel/ftp/footer.htm

# On cache certains fichier et le dossier Images
IndexIgnore .htaccess footer.htm header.htm /tutoriel/ftp/Images
# On donne quelques options : taille automatique, dimensions des icones
# mettre les dossiers en premier et ne pas tenir compte de la casse
IndexOptions SuppressHTMLPreamble FancyIndexing NameWidth=* DescriptionWidth=* IconWidth=32 IconHeight=32 FoldersFirst IgnoreCase
IndexOrderDefault Ascending Description

# On personnalise l'icone et la description pour les fichiers pdf
AddIcon (IMG,/tutoriel/ftp/Images/pdf.png) .pdf .PDF
AddDescription "Document Adobe PDF" *.pdf *.PDF

# Cas particulier du dossier parent (revenir en arrière)
AddIcon (PAR,/tutoriel/ftp/Images/back.png) ..
AddDescription "Revenir en arrière" ..

# Cas particulier des dossiers
AddIcon (DIR,/tutoriel/ftp/Images/folder.png) ^^DIRECTORY^^
AddDescription "Répertoire" */

# Pour les extensions inconnus, une image par défaut
DefaultIcon /tutoriel/ftp/Images/unknow.png

Comme promis voici les fichiers utilisés lors de cette vidéo ainsi qu’un lien pour télécharger le tutoriel : Télécharger les fichiers.

J’espère que vous avez apprécié le tutoriel, n’hésitez pas à poser des questions et faites un tour sur la page facebook ça me fera plaisir !