Site Web 2001 – 2018

Cette version de site web est maintenant révolue après 17 ans de bons services de 2001 à 2018 (avec enrichissements progressif de look en 2002 et 2003, l’ajout d’une gallery en 2004 et d’un wiki et d’un blog en 2005). Voici une petite galerie de à quoi ce site ressemblait, et un descriptif technique ci-dessous. Une version archivée à peu près fonctionnelle est également disponible sur mon site free remi.peyronnet.free.fr (quelques adaptations ont été faites pour correspondre aux fortes contraintes de l’hébergement free, supprimer toute possibilité d’édition ou commentaire, supprimer quelques contenus et supprimer les versions grandes des photos, seules les vignettes ont été conservées)

• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 

Informations techniques à propos de ce site

Le but de ce site était d’apprendre à se servir de PHP.

Apparences / Navigation

L’organisation de ce site lui permet d’avoir plusieurs apparences possibles. Il s’agit d’un gadget plutôt que de quelque chose d’utile, mais cela permet de garder les anciennes présentations lorsque l’on décide de changer.

Voici la liste des apparences possibles :

• une version sans menus.
• la première version, la plus moche.
• une présentation se voulant un peu plus moderne.
• une troisième, profitant des nouveautés XHTML/CSS1.

Parallèlement à cela, pour l’apparence la plus récente, la visualisation du menu, jusqu’ici commun, à été revue. Il en découle sept mode de navigation possible :

• Top : tous les menus sont affichés dans une barre de navigation horizontale.
• Arbo : une arborescence est affichée dans un menu aligné à droite
• Sep : l’arborescence est affichée sous forme de plusieurs menus successifs, alignés à droite.
• Mixed : un mélange de ‘top’ et ‘sep’. Le premier niveau de menu est affiché horizontalement, et les suivants à droite, séparément.
• Arbo.Left : idem que Arbo mais aligné à gauche.
• Sep.Left : idem que Sep mais aligné à gauche.
• Mixed.Left : idem que Mixed mais aligné à gauche.

Etant donné la mauvaise mise en page résultant des barres de navigation à gauche, et quelques avis d’utilisateurs, les navigations mises en avant sont ‘top’ et ‘mixed’.

Le principe

Le principe est simple, et s’articule autour de quatre fichiers :

• La page contenant le texte.
• La page produisant un en-tête, en particulier générant le menu.
• La page produisant la fin du document, pour refermer le tableau ouvert par la page d’en-tête par exemple, ou pour afficher un copyright.
• Un fichier de configuration, regroupant les fichiers en menu, et contenant d’autres informations.

En pratique, la page vide contient au début :

<? 
// Template Top definitions
$docRoot="";  
while (!file_exists($docRoot . "ROOT")) { $docRoot = $docRoot . "../"; }
include ($docRoot . "config.php3");
include ($docRoot . "header.php3");
// ------------------------------------------------------------------------
?>

La difficulté de cette façon de procéder, est que le fichier appelé peut être dans n’importe quel sous répertoire, et il ne sais pas ou se situe les fichiers de configuration, et de les fichiers header, footer.
La première ligne se propose de trouver justement ces fichiers. Tout est basé sur le fait que la “racine” du site ouaibe contiendra le fichier ROOT (vide). On remonte donc jusqu’à trouver ce fichier, ce qui nous donne le $docRoot, qui nous servira ensuite à referencer toutes les pages.
Nous incluons ensuite le fichier de configuration et le fichier header.

La fin est plus simple :

<? 
// ------------------------------------------------------------------------
// Template Bottom definitions
include ($docRoot . "footer.php3")
?>

dont la seule fonction est d’inclure le texte HTML qui sera ajouté à la fin du document.

Le fichier de configuration contient principalement un énorme tableau recensant toutes les pages à gérer et quelques paramètres, comme le nom des fichiers images,… Pour ajouter une page, il suffit de modifier uniquement ce fichier.

Un petit plus

Pour montrer que ce système était très modulable, j’ai voulu créer différentes façons d’afficher le texte, un peu comme les “skins” (ou “peaux”) à la mode actuellement. J’ai donc séparé les différents fichiers header et footer en plusieurs parties :

• Une partie de fonctions globales, comme celles d’identification de la page
• Une partie de génération du menu.
• Une partie gerant la sélection des thèmes.
• Et enfin, une dernière série de fichiers, qui comprend les informations pour la mise en page.

Pour accéder à ces différents looks, j’utilise en premier lieu ?menu=[nom du look], puis je demande à stocker un cookie, d’une validité de 30 minutes. Trois “looks” sont actuellement disponibles :

• Standart (std)
• Moderne (mod), qui souffre encore de quelques défauts
• Pas de menu (no), qui ne fait que rajouter les en-têtes HTML, mais ne mets pas en page. Ceci est pratique pour enregistrer les pages sans avoir le menu. (Merci à sam et yoda pour cette idée)

Vous pouvez y accéder avec les petits liens situés en dessous du mot Index, lui même en dessous de l’image RP.
Le timer du cookie est la pour le cas ou le ?menu=no est demandé, pour ensuite retrouver le menu lors de la prochaine connexion.

Une sélection “intelligente” des pages français / anglais est aussi faite.