Création du système de gestion de contenu chrono-site

L’adresse des sites utilisés et décrits dans ce document se trouve en annexe 5 à la fin

A- Définition du problème :

C'est en enseignant l'option informatique aux lycée que l'idée m'est venue de créer une application permettant de construire en ligne et en quelques clics un site de qualité. Il faut dire que, après avoir simplifié la construction d'un site au maximum j'avais encore (depuis plusieurs années) des réflexions du genre "il y a beaucoup trop d'étapes, on ne sait jamais  où on en est rendu !". Et pourtant il suffisait d'enregistrer avec Openoffice ou un autre traitement de texte en opensource (il en existe un certain nombre) ses pages dans son dossier personnel  (sur le réseau) puis d'aller chez l'hébergeur pour les aspirer... point d'adresse ftp à utiliser ! Malgré ces simplifications c'était encore trop lourd pour certains ! J'avais depuis longtemps abandonné l'utilisation de Dreamweaver 2.0 sur le réseau.... les élèves n'ayant pas très bien compris l'histoire des comptes écrasaient sans s'en apercevoir le compte de leur prédécesseur réseau !
Dans le même temps les élèves de CM2 de mon épouse lui font part de leur envie de mettre les photos du dernier voyage de classe sur le site de l'école...! C'était alors l'arrivée de SPIP en France. Les premiers essais avec ce système de gestion de contenu ce sont montrés  décevants : les profs qui ont participé aux essais avaient plutôt envie d'insérer des photos sur leur site alors que SPIP ayant été créé pour des journalistes ne proposait pas de façon simple et directe l'insertion d'images !

B- Premiers jets

Je me suis alors mis au travail avec les CM2 de mon épouse... Ils ont  justement un compte-rendu d'activité à placer sur internet ! Parfait, je vais profiter de cette occasion pour me lancer dans la création d'un système auteur simple permettant de placer des informations (avec images surtout) sur un site avec le moins de manipulations possibles ! Il me faut disposer d'une base de données dans laquelle les informations et textes seront mémorisées et d'un dossier de téléchargement dans lequel les images seront stockées ! Je connais bien le langage php et les requêtes sur les bases de données de type mysql, c'est décidé je pars sur un système en php !

Dans un premier temps je créé simplement une feuille de saisie dans laquelle les élèves peuvent insérer des textes ou des images : les images sont toujours assorties d'une légende (qui peut être vide !) .... Bien entendu un système de liens hypertexte est possible et chaque élément (texte ou image peut être lié soit à une autre feuille su site soit à une adresse  http ou bien une boîte aux lettres) .

C'est parti : les élèves de CM2 commencent à placer les images de leur voyage  sur le site de la classe (c'était un site sur free.fr qui est donc lié à une base de données)

C- Premiers problèmes et leurs solutions

Très vite des problèmes se posent : les pages sont créées mais il faut structurer l'ensemble de cette activité : menu et sous-menus ! Je rajoute alors deux modules : création de nouveaux thèmes et organisation des thèmes ! La partie organisation permet de déplacer les pages créées ou les thèmes pour structurer le site ! Ca fonctionne déjà beaucoup mieux et nous pouvons terminer ce premier essai d'activité sur le site. En effet un groupe de jeunes a visité le château de la Chabotterie en Vendée, donc de nombreuses photos sont à notre disposition car pour cette sortie pas de nuit à l'hôtel mais dans des grands dortoirs du château qui est un monument du patrimoine historique de la Bretagne. !

D- Dans le même temps au lycée   (février 2001)

Depuis plusieurs mois déjà au lycée fonctionne un système d'informations que j'ai développé pour montrer au conseil de direction que le système d’informations (à cette époque en intranet et peu efficace) peut être automatisé et allégé ! L’idée était bonne et ce système  a du succès. Il s'agit d'un Feuillet Internet de Liaison (FIL) qui est distribué aux enseignants tous les vendredi soir et qui est écrit directement par les membres du conseil de direction à partir d'un système de back-office sur Internet ! En clair chacun des membres du conseil de direction peut saisir des informations à partir de n'importe quel poste équipé d'internet .

Ce système laisse de suite les enseignants du lycée rêveurs quand à mes possibilités de développement internet et me font part de leur envie d'avoir un site d'établissement permettant à chacun d'eux de fabriquer des pages relatives à leur matière !

E- Naissance de chrono-site

Je décide alors de structurer le système créé pour les élèves de CM2, de lui donner un nom et de l'utiliser sur le site du Lycée pour que les enseignants puissent y déposer leurs activités et documents ! Le nom choisi est chrono-site car mon objectif est vraiment de donner aux enseignants (et élèves) la possibilité de créer des pages très rapidement (et de les modifier tout aussi facilement). Il est déjà bien clair pour moi qu'un webmestre d'établissement scolaire n'était pas là pour déposer des informations sur le site mais plutôt pour structurer et fédérer un système de création de site ! En fait, mettre en place une gestion de contenu pour que le maximum d'enseignants puissent alimenter le site !

Il me manque alors un élément très important pour les enseignants : la possibilité  d'insérer des documents !   Je décide d’utiliser la même fonction d'upload de fichier que pour les images et ajoute un nouveau module dans la barrette de mise en forme : téléchargement de documents ! Pour permettre aux enseignants de mettre leurs documents sur le site je leur créé un espace particulier avec toutes les disciplines...

Chrono-site est tout proche alors de sa version finale !

F- Mise à disposition de chrono-site

Le site de notre Lycée avec son système de gestion de contenu commence à faire des envieux ! En effet, beaucoup d'établissements scolaires ont commencé un site sous la responsabilité d'un seul et unique webmestre ! Ca fait très lourd ! Si ce dernier quitte l'établissement le site est difficile à reprendre ! Et souvent les mises à jour ne se font que lorsque celui-ci a un peu de temps .. le site périclite et s’éteint !

On me fait comprendre alors de façon assez insistante qu'il serait bien que le système utilisé à NDBN soit à disposition d'autres établissements ! Certains établissements ayant déjà fait des essais avec le CMS SPIP qui les a déçu par la difficulté de prise en main et surtout la difficulté d'insérer des images !

Je me décide donc à structurer l'ensemble de mes travaux pour en faire un module php utilisable sur n'importe quel serveur avec base de données (free par exemple, ou bien serveur académique dédié)

J’en profite pour utiliser chrono-site sur le site des « Ateliers de géométrie » que je viens de mettre en licence GNU/GPL

Cela me prend quelques semaines et j'arrive à la structure suivante :

Système chrono-site développé en php et fonctionnant sur une base de données mysql.

Les unités sont décrites en Annexe 1

Fonctionnement de chrono-site... Il faut d'abord se souvenir que tout a été pensé (et repensé) pour que les pages soient d'une construction totalement évidente pour les non spécialistes en informatique ! Et surtout que l'on puisse y insérer images et documents d'une façon directe et très simple !!

1* Pour construire  une page (unité chrono/chrono_saisie_02.php) il suffit  de superposer  des modules (textes, images, tableaux, documents) qui sont formatés à l'aide de styles pour pouvoir obtenir un formatage visible en direct ! Il suffit donc de cliquer sur un bouton pour changer le style (en direct) du paragraphe ! Par contre pour formater un seul groupe de mot du paragraphe il faut utiliser les classiques balises html ! Cela ne sera fait qu'après une première approche classique ! C'est exactement ce qui se passe au lycée ! Après un premier temps de découverte du fonctionnement du système auteur de chrono-site les auteurs (enseignants et élèves) ont des envies et veulent aller plus loin ! Ils sont alors tout prêts à utiliser les balises html qui leurs sont proposées dans la documentation  officielle de chrono-site ! Des sites de démonstrations sont à disposition sur le site officiel de chrono-site pour faire des essais !

2* En cliquant sur enregistrer  le module chrono_enr_01.php  va enregistrer le titre de la page dans la table de la base nommée chrono_titre  (voir annexe 3) ainsi que la date et un numéro d'ordre; Puis il va enregistrer tous les modules un par un dans la table chrono_contenu en mettant pour chacun un ordre (lequel en haut ?) et un parent (le numéro du titre)... Les éléments de tableaux sont enregistrés dans la table chrono_tablo avec comme parent le chrono_contenu auquel ils sont reliés... La structure ainsi créée permet de déplacer, modifier ou détruire n'importe quel élément de page ou n'importe quelle page ! De plus l'index ordre peut d'être modifié pour déplacer les pages dans la structure ! Aussi un système permet de faire passer une page d'un thème dans l'autre ! Ainsi la page qui se trouve tout en haut peut monter dans le thème du dessus ! Chacune des tables de la base a un champ numero qui est en auto-incrément et donne donc la sécurité du champ unique à la table !

3* Les éléments sont enregistrés dans chrono_contenu avec leur styles. Par exemple :

Accéder à la démo 2 chez free&#FFFFFF&# FF0000&normal && center & 216&130&12px

En fait la chaîne est constituée du texte suivi de son format (un peu suivant le principe des codes de contrôle utilisés sur les traitements de textes !) ...Dans l'exemple ci-dessus la chaîne sera éclatée avant d'être affichée (fonction split du php) et découpée suivant les caractères & ...on trouvera donc ceci :

En fait, chaque paragraphe est enregistré dans la table chrono_contenu avec son formatage !

4* Par contre les images et documents ne sont pas stockés dans la base de données ! Dans la  table chrono_contenu ne sont enregistrées que les adresses serveur des images, documents etc ! Ces derniers sont  enregistrés dans le dossier chrono_upload (leur nom est construit par chrono_site dans chrono_enr_01.php )… Il est calculé de façon à éviter le piège des écrasements (enregistrer une image avec un nom déjà utilisé !) …de la façon suivante :

Le mot chrono suivi du numéro de la fiche dans chrono_titre (unique) suivi du numéro de paragraphe dans chrono_contenu auquel est rajoutée l’extension ! Ce qui peut donner des noms du genre chrono65_5.jpg (image) ou chrono128_1.pdf (document)…

5* Affichage sur le site lui-même :  lorsque le visiteur appelle une page c'est toujours la page index.php qui intervient avec en paramètre le numéro de titre qui a été cliqué... Index va donc chercher dans la table chrono_titre (voir annexe 3) le titre appelé puis relève tous les éléments de chrono_contenu dont le champ parent correspond au numéro de titre puis éventuellement les éléments de tableaux associés à chaque élément de contenu...
Si besoin est,  documents et images sont chargés du dossier chrono_upload !

Conclusion : aucune page html ! Il suffit de sauvegarder la base et le dossier chrono_upload pour faire un back-up ou une sauvegarde du site !

6* Il me faut maintenant étudier le système des comptes privés et publics et des restrictions d’accès ! J’utilise les variables de session plutôt que les protections de dossier .htaccess car ces derniers sont trop différents  d’un serveur à l’autre ! Certains exigent des mots de passe criptés et d’autre non etc. Les variables de sessions sont plus homogènes et gérées de façon identiques sur tous les serveurs !  Elles permettent aussi de sécuriser plus facilement le site ! Un fichier comptes_01.txt contient les identifiants et les mots de passe ainsi que la chaîne des droits (voir annexe 2)

7* Il reste à faire un fichier d’installation qui va créer les tables de la base de données ! Les fichiers php seront archivés (format zip) … pour être téléchargés rapidement et l’installation d’un système chrono-site se passera donc ainsi :

Avant toute installation il faut bien entendu disposer d'un compte d'hébergement avec base de données  (une partie du site officiel de chrono-site est consacrée aux différents hébergeurs)

Pour installer un site en chrono-site il suffit de :

1- Télécharger l'archive zip

2- Décompresser ce fichier dans un dossier de votre disque dur.

3- A l'aide de votre éditeur habituel prendre le temps de modifier avec soin le contenu du fichier "variables.php" ! De la précision de ces informations dépend la réussite de l'installation. Cet éditeur peut être un éditeur simple tel le bloc-notes !

4- Expédier alors l'ensemble des fichiers et dossiers décompressés sur votre espace hébergé à l'aide de votre client ftp habituel (Filezilla, dreamweaver ou autre).

5- Dernière étape : exécuter le fichier "installe.php" en tapant dans la ligne d'adresse quelque chose comme ceci "http://jlepine.free.fr/installe.php" (vous remplacerez évidemment jlepine.free.fr par l'adresse de votre site).... Cliquez sur installer la base de données ..... puis sur revenir à la page d'accueil de mon site !

6- Détruisez alors le fichier "installe.php  du serveur pour que personne ne puisse vous réinitialiser la base !

Chrono-site est ainsi structuré et prêt à l’emploi il ne reste plus qu’à le mettre à disposition : j’en profite pour le mettre en licence GNU/GPL  (comme je l’ai déjà fait pour les « Ateliers de géométrie » licence en annexe 4 ) de façon à pouvoir profiter de la communauté des développeurs (ce qui, au demeurant, fonctionne très bien puisque l’on trouve sur le site des démos qui n’ont pas été faites par moi !) …. Je réserve un espace sur le serveur logiciels de chronosite (comme pour les « ateliers de géométrie ») puis j’y installe les fichiers de chrono-site dans un système chrono-site (récursivité indispensable)

G- Ajout des annuaires

Dans un second temps des annuaires de liens et de courriers sont ajoutés (je les avais développés pour le lycée).

Un système anti-spam est créé pour l’occasion ! Il fonctionne de la façon suivante : lorsqu’une adresse email est piochée dans la base de données le symbole @ est remplacé par un double point d’exclamation ! ce qui peut donner nestor!!free.fr plutôt que nestor@free.fr !  De plus le mot clé mailto est remplacé par l’appel d’une procédure javascript  qui activera l’adresse lors du click sur le lien …. L’adresse email tant recherchée par les robots spammeurs n’apparaîtra qu’au moment de l’écriture du message et ça les robots ne peuvent le déclencher !

H- En projet : le calendrier et le FIL

Il s'agira en fait d'un module additionnel calqué sur la salle des profs virtuelle que j’ai développé pour notre établissement :

En préparation pour début juillet deux modules :

a- Un calendrier permettant à la secrétaire de direction de saisir l’information (réunions, sorties, conseils de classe..) Et aux enseignants de consulter le planning a tout moment à partir de leur salle des profs virtuelle (en fait  chaque enseignant a accès à sa salle personnelle avec comme identifiant la 1ère lettre de son prénom collée à son nom et comme mot de passe son numéro de photocopieur (6 chiffres). Ce planning est bien sur imprimable !

b- Un module d’informations nommé FIL (Feuillet Internet de Liaison) qui, une fois installé sur chrono-site, permettra à l'établissement de gérer un système d'informations en direct à partir d'administrateurs désignés ...

Ce Feuillet pourra fonctionner sur plusieurs établissements (nous l'utilisons depuis plus d'un an sur quelques établissements de la région)

Ce Feuillet génère automatiquement une (ou plusieurs) page(s) imprimable(s) à n'importe quel moment de la semaine ou de la quinzaine (ou du mois !)....

Les informations saisies par les membres désignés (dans notre établissement : les membres du conseil de direction) sont conservées dans un fichier et donc réutilisables à tout moment ..... Le FIL est consultable (accès restreint ou public) à tout moment sur Internet. Comme toutes les fiches restent dans un fichier il est possible de faire une sélection de l'information : un consultant peut par exemple obtenir (et imprimer) toutes les informations du niveau collège concernant les sorties pédagogiques depuis deux ans !  En annexe 5 l’adresse de la salle des profs virtuelle dans laquelle vous pouvez entrer avec mes codes personnels

K- Dans l’avenir ….

Beaucoup d’établissements utilisent déjà chrono-site (on les a en exemples sur le site officiel) et pour l’instant peu de doléances sont remontées ! Je compte beaucoup plus sur les petites remarques journalières de mes collègues pour améliorer chrono-site ….. On peut voir au niveau du livre d’or et du forum du site officiel que le système chrono-site répond à un véritable besoin.. Il a été prévu pour le monde scolaire et se trouve utilisé également pour les sites personnels et associatifs !

Annexe 1 : liste des unités

Annexe 2 : fonctionnement des comptes

Annexe 3 : la table chrono_titre :

Top of Form 1

Annexe 4 : la licence GNU/GPL

 unité variables.php                                                    

Copyright 2003,2010      Lépine JEAN                      

This file is part of Système Chrono-site.                                          

Le système chrono-site   is free software;                                          

you can redistribute it and/or modify                                              

it under the terms of the GNU General Public License as published by              

the Free Software Foundation; either version 2 of the License, or                  

(at your option) any later version.                                                

Le système chrono-site    is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the  GNU General Public License for more details.

You should have received a copy of the GNU General Public License                  

along with Le système chrono-site    ; if not, write to the Free Software          

Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA          

Annexe 5 : les adresses internet des sites cités ci-dessus