Suggestions

Définition XML

La définition XML d'un modèle de page est constituée de la manière suivante :

  • Du code XHTML qui sera repris dans les pages du site utilisant ce modèle.
  • Du code XML permettant de définir les zones logiques sur lesquelles travaillera Automne.

Il y a plusieurs sortes de tags XML dans les modèles de pages :

  • Tags atm-linx : permettent de créer les liens de navigation entre les différentes pages d'Automne.
  • Tags de travail XML génériques : Ces tags ne sont pas spécifiques aux modèles et peuvent aussi être employés dans des rangées.
  • Tags atm-clientspace : Ces tags, décrits ci-dessous permettent de définir les zones de contenu.
  • Tags XML spécifiques : Ces tags ne peuvent être employés que dans des modèles de pages. Vous en trouverez la description ci-dessous.

Un modèle peut contenir les tags XML spécifiques suivants :

Espaces clients de la page :

Ce tag permet de spécifier dans quelles zones de votre modèle viendront s'insérer les rangées de contenu dynamique propres à chaque pages.

<atm-clientspace id="identifiant" module="codename" /> Tag auto-fermé. Il possède les attributs suivants :

  • id : identifiant unique de l'espace client dans le modèle. Vous pouvez y mettre n'importe quelle valeur alphanumérique du moment qu'elle soit unique parmi tous les tags atm-clientspace du modèle.
  • module : permet de définir quel module fournira le contenu de cet espace client. Par défaut, si vous souhaitez pouvoir insérer des rangées de contenu dans cet espace client, vous devez y spécifier la valeur "standard".

Ce tag permet de définir la position d'un espace client dans la page. C'est ce tag qui vous permettra de pouvoir insérer des rangées de contenu dans les pages qui seront crées à partir de ce modèle.

Exemple : <atm-clientspace id="left-column" module="standard" />

Méta données de la page :

<atm-meta-tags /> Tag auto-fermé et sans attribut : Il sera remplacé par les champs de méta données de la page.

Ce tag est obligatoire, il doit se trouver dans le tag <head> de votre modèle XHTML car il permet de gérer certaines fonctionnalités propres à Automne. C'est par exemple ce tag qui permet d'activer les fonctions d'édition des pages. Il permet aussi d'ajouter les fichiers Javascript et les feuilles de styles fournies par les différents modules qui seront employés dans les pages.

Ce tag génèrera les méta données suivantes :

Nom Meta Données Valeurs Possibles
Description <meta name="description" content=" " /> Libre
Keywords <meta name="keywords" content=" " /> Libre
Category <meta name="category" content=" " /> Libre
Robots <meta name="robots" content=" " /> ( all, index, follow, noindex, nofollow )
Language <meta name="language" content=" " /> Libre
Author <meta name="author" content=" " /> Libre
Copyright <meta name="copyright" content=" " /> Libre
Cache du navigateur <meta http-equiv="pragma" content="no-cache" /> S'applique uniquement si cette option est cochée
Generator <meta name="generator" content="Automne" /> Automatique
Base <base href="http://www.automne-cms.org/" /> Automatique

Cette balise <atm-meta-tags /> affichera aussi toutes les meta-données libres comme des liens vers vos flux RSS de modules que vous aurez ajouté dans les propriétés de page ou dans les propriétés de site.

Tag d'appel des scripts <atm-js-tags />

<atm-js-tags files="/js/js1.js,/js/js2.js" />

Ce tag permet de concaténer plusieurs fichiers javascripts en un seul. Accélérant ainsi le chargement de vos pages Web.

Les fichiers ainsi listés seront concaténés et compressés avant d'être servis à l'internaute. Une gestion avancée du cache sur le navigateur de l'internaute est employée.

  • Attribut files : Fichiers javascript à inclure dans la page (séparés par des virgules).

Les fichiers à utiliser doivent impérativement se trouver dans le répertoire /js/ ou un sous répertoire.

Exemple :

<atm-js-tags files="/js/jquery.js,/js/common.js" /> 

En développement, lorsque le paramètre "activer le débuggage du système" est actif, la minimisation Javascript n'est pas effectuée, il est alors possible de parcourir plus facilement le code Javascript.

Contrairement, en production, lorsque le paramètre "activer le débuggage du système" est inactif, la minimisation permet de meilleures performances.

Vous pouvez désactiver la minification d'une portion de code javascript en l'entourant des balises suivantes :

//<<
... votre code javascript ...
//!>>

Tag d'appel des feuilles de style <atm-css-tags />

<atm-css-tags files="/css/css1.css,/css/css2.css" />

Ce tag permet de concaténer plusieurs fichiers de feuille de styles en un seul. Accélérant ainsi le chargement de vos pages Web.

Les fichiers ainsi listés seront concaténés et compressés avant d'être servis à l'internaute. Une gestion avancée du cache sur le navigateur de l'internaute est employée.

  • Attribut files : Feuilles de styles CSS à inclure dans la page (séparés par des virgules).
  • Attribut media (optionnel) : permet de spécifier le média de sortie employé parmi :
    • all (par défaut si l'attribut media n'est pas employé)
    • aural
    • braille
    • embossed
    • handheld
    • print
    • projection
    • screen
    • tty
    • tv

Les fichiers à utiliser doivent impérativement se trouver dans le répertoire /css/ ou un sous répertoire.

Exemple :

<atm-css-tags files="/css/common.css,/css/accueil.css" />

Constantes PHP :

<atm-constant name="constant" /> Tag auto-fermé. Il possède l'attribut suivant :

  • name : nom de la constante dont il faut retourner la valeur.

Ce tag permet d'obtenir la valeur de toute constante PHP.

Exemple : <atm-constant name="APPLICATION_LABEL" /> Ce code retournera le nom de la constante APPLICATION_LABEL qui, dans Automne est le nom de votre instance d'Automne.

Lien vers la page d'impression :

<atm-print-link keeprequest="true"> ... {{href}} ... </atm-print-link> Ce tag possède l'attribut suivant :

  • keeprequest : cet attribut est optionnel et il permet de renvoyer à la page d'impression les valeurs GET et POST envoyées à la page en cours. Valeurs acceptées : true ou false (défaut).

Ce tag remplacera la valeur spéciale suivante :

  • {{href}} : adresse de la page d'impression pour la page en cours.

Ce tag permet de réaliser un lien vers la page d'impression (si elle existe) de la page en cours.

Exemple : <atm-print-link><a href="{{href}}">Imprimer</a></atm-print-link>

Date de dernière mise à jour de la page :

<atm-last-update format="m/d/Y H:i:s"> ... {{date}} ... {{firstname}} ... {{lastname}} ... </atm-last-update>Ce tag possède l'attribut suivant :

Ce tag remplacera les valeurs spéciales suivantes :

  • {{date}} : Date de la dernière mise à jour de la page au format spécifié par l'attribut format.
  • {{firstname}} : Prénom de l'utilisateur ayant effectué la dernière modification sur la page.
  • {{lastname}} : Prénom de l'utilisateur ayant effectué la dernière modification sur la page.

Ce tag permet d'afficher la date et / ou l'auteur de la dernière mise à jour de la page en cours.

Exemple :<atm-last-update format="m/d/Y H:i:s"><small>Dernière mise à jour : {{date}} par {{firstname}} {{lastname}}</small></atm-last-update>

Identifiant de la page en cours : 

Cette valeur sera remplacée par l'identifiant de la page en cours.

PageID est très utile pour récupérer l'identifiant de la page actuelle.

Un exemple simple pour votre modèle XML ressemble à ce code :

<!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" lang="fr">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title><atm-website name="title" /> : <atm-title /></title>
    <atm-css-tags files="css/common.css,css/index.css" media="screen" />
    <atm-css-tags files="css/print.css" media="print" />
    <atm-js-tags files="js/sifr.js,js/common.js,js/jquery-1.3.2.js,js/menu.js" />
    <atm-meta-tags />
</head>
<body>
    <h1><atm-title /></h1>
   
    <div>
        <atm-clientspace module="standard" id="center" />
    </div>
    <br /><br />
   
    <atm-print-link keeprequest="true">&nbsp;<a href="{{href}}" target="_blank">Print</a></atm-print-link><br />
   
    <atm-last-update format="m/d/Y H:i:s"><small>Last update : {{date}} by {{firstname}} {{lastname}}</small></atm-last-update>
</body>
</html>

Cet exemple très simple permet d'obtenir un modèle qui peut être employé pour créer des pages dans lesquelles il est possible d'insérer des rangées de contenu.

Il ne contient pas, par contre, de système de lien permettant de naviguer entre les différents pages qui seront ainsi créées.

 



3 contribution(s)

Par efusien le 24/03/2010 18:21:58 :

A noter : une fois avoir installé Automne, par défaut il existe des modules préconfigurés : le module Mediathèque (pmedia) et Actualités (pnews) par exemple.

Attention car dans les fichiers Javascript liés à ces modules (/js/modules), il existe la librairie jQuery, automatiquement chargée via le <atm-js-tag>.
/js/modules/pMedia/jquery-1.2.6.min.js
/js/modules/pNews/jquery-1.2.6.min.js

Cela peut parfois causer des conflits, par exemple si vous utilisez un plugin de jQuery (tel que colorbox par exemple).

L'astuce est donc de vérifier que la librairie n'est pas appelée plusieurs fois.
Dans le cas où vous souhaiteriez mettre votre propre librairie jQuery, pensez donc à supprimer ces fichiers qui seraient alors inutiles.

Par Julien Breux le 09/06/2010 09:52:15 :

Note à propos du tag <atm-css-tags /> vous pouvez spécifier le type de média en nommant votre fichier avec le suffixe portant le nom du média précédé par un tiret (-).

Exemple : global-print.css, global-screen.css

Par Guillaume Mesnard le 09/06/2010 09:58:45 :

Petite précision supplémentaire : les tags atm-css-tags et atm-js-tags doivent être uniques dans votre modèle de page, sous peine d'insérer plusieurs fois les fichiers importés des modules.

Ajouter une contribution :

Les contributions servent à compléter la documentation en détaillant des points précis ou pour donner des exemples. Elles sont modérées et peuvent être supprimées sans préavis.
Pour poser des questions, merci d'employer le forum et pour rapporter un bug, le BugTracker est à votre disposition.








Vous pouvez employer les balises bbcode suivantes :
  • [code-xml] votre code ... [/code-xml] : Pour mettre en forme du code XML / XHTML
  • [code-php] votre code ... [/code-php] : Pour mettre en forme du code PHP
  • [code-js] votre code ... [/code-js] : Pour mettre en forme du code Javascript
Date de votre contribution : 06/02/2012   12:49:06

Haut