Travaux pratiques

Fabriquer ses modèles

Avec Automne, nous avons donc la possibilité de fabriquer très facilement des modèles de pages et nous allons nous servir pour le moment d'un exemple visuel en restant sur la page "Rangées" de votre installation de démonstration afin de voir comment sont conçus ces modèles.

Quand vous travaillez une page, il va vous être utile de quitter le mode éditeur pour aller voir comment les pages sont faites et c'est un vrai bazar de quitter, revenir, quitter, revenir jusqu'à ce que vous trouviez par vous même les astuces pour aller plus vite et sereinement.

En ce qui me concerne, je travaille avec deux explorateurs (Firefox et Google Chrome), connectés en même temps dans l'administration, ce qui me permet avec l'un de rester sur mon espace de travail et avec l'autre d'aller explorer les outils au fur et à mesure de mon apprentissage.

Il est à noter que votre rangée éditée, après l'avoir enregistré grâce à la petite icône de validation ( Bis repetita: Attention ne ne pas cliquer sur la croix rouge "supprimer"), vous pouvez voir son rendu en temps réel en cliquant sur l'item "Aperçu" dans votre menu du haut.

Regardons dans la barre d'adresse du navigateur l'URL de notre page en cours.

http://www.automne-cms.org/automne/admin/#page:24

Elle se termine par un chiffre qui est le numéro unique de la page en cours (concept très important sur Automne), ce qui vous permettra de la retrouver en quelques secondes sans passer par l'explorateur d'arborescence des pages qui est le deuxième item en partant de gauche.

Autre truc, juste à droite de cet item, il y en a un autre (étoile), qui permet de mettre en favori vos pages préférées ce qui permet de les retrouver d'un clic en ouvrant l'item "Gestion de pages" dans le menu latéral rétractable.

Le travail dans les rangées terminé (et la rangée enregistrée), vous pouvez soit le "valider" et il sera en ligne immédiatement, soit le laisser dans l'état car il est enregistré dans un "brouillon" et sera disponible à tout moment. Pratique pour ne terminer un exercice que le lendemain.

Plus tard, quand vous confirez l'édition des pages de votre site à un ou des rédacteurs, ils ne pourront pas les valider directement mais les "soumettre à validation" selon les "droits" que vous leur donnerez mais nous étudierons cela dans un prochain chapitre.

Récapitulatif:

Vous avez crée une ou plusieurs rangées sur votre page (numéro "24" pour la mienne) en y intégrant du texte ou des médias (ou modules) que vous aurez préalablement téléchargé dans votre médiathèque.
La conception de votre page se fait avec une ou plusieurs rangés dont certaines sont déjà en stock dans la bibliothèque de modèles où vous aurez la possibilité de créer vos propres modèles quand vous aurez compris l'utilité de ce système.

A ce propos, souvenez-vous bien "d'activer" un modèle nouvellement créé (de quelle sorte qu'il soit), sinon, vous ne pourriez l'utiliser et vous demanderiez d'où vient la panne.
Vous pourriez "désactiver" ces modèles plus tard si vous ne les utilisez que très rarement gagnant ainsi de l'espace et de la visibilité pour mieux les retrouver ensuite avec ou sans le moteur de recherche intégré à ce module particulier.
Notons que la désactivation d'un modèle n'a aucune incidence sur les pages l'utilisant déjà et est particulièrement utile quand on désire que nos rédacteurs n'y aient pas accès pour une raison ou pour une autre.

En ce qui concerne l'éditeur de texte intégré, sachons que nous pouvons à loisir ajouter ou retirer des outils grâce à la "Gestion des barres d'outils de l'éditeur visuel (WYSIWYG)" que vous trouvez dans le panneau latéral dans la rubrique "Modèles".

Vous aurez la possibilité de personnaliser cette barre d'outils pour vous-même (administrateur) et pour chaque groupe d'utilisateurs, rédacteurs ou autres toujours selon les "droits" que vous leur accorderez.
Cela reste valable pour le gestion des modèles et la documentation d'Automne n'est pas avare d'enseignements à ce sujet.

• Droits d'administration
• Gestion de groupes.

Pour la Médiathèque, il n'est pas besoin de longs discours et son utilisation est très intuitive. 
D'ailleurs, le système vous prévient en cas d'erreur et vous n'aurez pas de problèmes avec ce module.

Les modèles de pages

Voilà la première épreuve qu'auront à subir les débutants assez peu à l'aise avec le célèbre trio XHTML/XML/CSS mais un peu de bon sens et quelques heures vous aideront ainsi que les participants aux forums qui vous aideront avec joie si vous ne leur demandez pas comment faire un copier/coller ou envoyer par mail une pièce jointe.

Je vais vous expliquer en bref comment cela fonctionne.

Tout le monde sait qu'une page web est constituée de code et fini le bon vieux HTML de papa. Nous nous sommes ici à la pointe du progrès (automne a été conçus pour l'avenir).

Sur un site classique, nous avons un template (habillage) et, outre le fait qu'il soit figé (sauf si nous sommes un champion du PHP), ce dernier reste le même d'un bout à l'autre du site.

Bien sûr, tout bon CMS propose plusieurs templates que le visiteur peut changer d'un seul clic, mais un template de série est toujours un template de série, et bien malin est celui qui veut personnaliser un habillage existant à ses couleurs surtout si il n'a besoin que de deux ou trois pages différentes (du modèle prédéfini) ou si il veut consacrer une section de son site à une thématique différente.

Imaginons que sur mon site, je vende des cercueils (gris, noir, sérieux) et sur une autre page des fraises (dominante rose).
Imaginons aussi que sur mon système (c'est le cas d'Automne), je veuille installer plusieurs sites avec un domaine et un thème totalement différent. 

Hé bien ici, c'est tout à fait possible parce que les développeurs ont prévus cette option et on ne mets pas du contenu dans un site mais des habillages autour de notre contenu. 

C'est pour cela qu'existe cette notion de "modèle de page".

Bon, je construis le modèle de ma page, qui est unique, et je le range dans ma bibliothèque "Modèle de page"

Je veux une autre page, alors, quand je la construit en cliquant tout simplement sur le bouton "Créer" de la page en cours, le système me demande avec quel modèle je veux la faire, si je veux intégrer ou non les rangées par défaut (qu'il y a déjà ou non dans les modèles de page existants) et il pousse l'amabilité de me dire dans quels sites existants ("Principal" et "Démo" dans notre cas) elle peut apparaitre. Je crée donc ma page avec un modèle existant. Il n'y a qu'à cliquer sur sa vignette.

Si plus tard je veux modifier cette page en lui donnant un nouveau template existant, il ira (le système) jusqu'à me dire quel modèle est compatible (ou non) avec ma création. C'est là que nous allons comprendre l'utilité et l'importance du fameux "espace client".

Une rangée va apparaitre sur ma page grâce à un espace que je lui aurais emménagé au sein de mon code. C'est un peu comme si en html on créait un tableau ou un cadre voire une frame.

Mais Automne est bien plus simple et performant que cela.

A l'endroit du modèle de page où je vais faire apparaitre mon "espace client", je vais tout simplement insérer une balise nommée "tag". Le tag <atm-clientspace /> 

Notons que je peux construire mon modèle de page chez moi avec mon éditeur de texte préféré (Notepad++ par exemple) ou tout simplement transformer un modèle existant (après bien sûr l'avoir dupliqué avec l'outil modèle/Modèle de page/ sélection d'un modèle et "Dupliquer") sans oublier évidement de déclarer mes nouvelles feuilles de style (que je téléchargerais obligatoirement dans le répertoire /CSS avec les autres existantes) et de bien renseigner le chemin des images en utilisant la méthodologie Automne de préférence car ce système est bien fait.

Si nous voulions deux rangées cote à cote, nous prévoirions deux espaces client pour les accueillir.

Nous éditerons en temps un tutoriel consacré à cette question et vous verrez que ce n'est pas si compliqué que cela le parait au premier abord et il y a dans la documentation une page très claire à ce sujet

Notons pour terminer provisoirement ce chapitre qu'il est tout à fait possible d'utiliser des templates existants sur le Net pour autant qu'ils soient valides W3C.

Conseils des développeurs

Si comme moi, vous éditez vos modèles de page "au fichier" et non par la configuration. Alors sachez que si vous ajoutez un ou plusieurs "espaces client" dans un modèle de page en éditant le fichier, (sans passer par l'outil pour x ou y raison) vous devez enregistrer et régénérer la définition XML de ce modèle de page. Ceci afin que le système prenne en compte l'ajout de ce ou ces nouveaux espaces client.

Le mécanisme de création de modèles de page d'Automne repose sur les standards préconisés par le W3C, à savoir (X)HTML pour structurer ses informations, CSS pour les styles et la mise en page et Javascript pour ajouter des comportements. Sur ce point Automne ne diffère pas des autres CMS. 

Jusqu'à présent nous n'avons pas encore adapté de thèmes pour Automne mais c'est quelque chose que nous sommes en train de mettre en place et qui fera l'objet d'un tutoriel.

Pour information, on trouve plein de modèles de pages XHTML/CSS en libre téléchargement qu'il te faudra ensuite d'adapter pour Automne. L'avantage c'est que nous pouvons personnaliser un minimum notre site web sans maîtriser totalement XHTML et CSS, qui comme toute technologie demandent pas mal de pratique avant d'acquérir un niveau suffisant pour créer des modèles. Surtout que la compatibilité entre les navigateurs peut-être parfois un vrai casse-tête. 

• http://www.oswd.org/
• http://www.freecsstemplates.org/css-templates/
• http://opensourcetemplates.org/
• http://cmstemplates.org/

Je pense que commencer par adapter un modèle existant est déjà un bon challenge, qui permettra de se familiariser avec la syntaxe XML des balises spécifiques à Automne.