Les espaces client

Ce sont dans les espaces client que le rédacteur pourra insérer les rangées de contenus de son choix. Dans les propriétés du modèle de page, l'administrateur du site pourra ensuite proposer des rangées par défaut. On peut également créer des groupes de rangées et ne les autoriser que dans certains modèles, mais en ce qui concerne le développement du modèle de page, le travail se limite à définir les zones qui afficheront les différentes rangées de contenus.

Pour cela rien de plus simple, il suffit de faire appel à l'élément <atm-clientspace />. Cet élément a deux attributs obligatoires : module et id. Le premier va indiquer à quel module est relié cette zone et le second va permettre d'identifier chaque espace client, ce qui sera utile aussi pour la compatibilité entre modèles.

Le module le plus utilisé dans Automne est le module de gestion de pages, aussi appelé module standard. On écrira donc par exemple pour la zone de contenu principal :

<atm-clientspace module="standard" id="main-content" />

Nous vous recommandons de choisir des identifiants avec une bonne sémantique afin de savoir quelle type d'information ils contiennent. Ce sera utile pour la compatibilité entre modèles.

Dans notre exemple il y a deux endroits où j'ai prévu d'avoir du contenu, une zone qui contiendra le contenu principal et une autre qui contiendra du contenu annexe que je vais définir ainsi :

<atm-clientspace module="standard" id="aside" />

Il ne nous reste plus qu'à insérer nos deux espaces client dans notre modèle :

<!DOCTYPE html>
<html lang="fr">
    <head>
        <title><atm-title /> - <atm-website name="title" /></title>
        <meta charset="UTF-8" />
        <atm-css-tags files="/css/reset.css,/css/base.css,/css/fonts.css" media="all" />
        <!--[if IE 7]>
        <link rel="stylesheet" href="/css/ie7.css" type="text/css" media="all" />
        <![endif]-->
        <atm-css-tags files="/css/print.css" media="print"/>
        <atm-css-tags files="/css/mobile.css" media="handeld"/>
        <atm-js-tags files="/js/jquery-1.4.2.js,/js/myscript.js"/>
        <atm-meta-tags />
    </head>
    <body>
        <div id="header">
            <atm-linx type="recursivelinks">
                <selection>
                    <!-- On démarre à la racine du site -->
                    <start>
                        <nodespec type="relative" value="root"/>
                    </start>
                    <!-- On ne veut afficher que 2 niveaux de l'arborescence -->
                    <condition property="lvl" operator="&lt;=">
                        <value type="data">2</value>
                    </condition>
                </selection>
                <!-- Je laisse le menu fermé par défaut et je n'affiche pas la page raçine du site -->
                <display mode="close" root="0"><htmltemplate>
                <!-- Ici le modèle HTML dans lequel les variables seront remplacées par les URLs et le titre de page-->
                <li><a href="{{href}}">{{title}}</a></li></htmltemplate>{{sublevel}}
                <!-- Le modèle employé pour la récursivité -->
                <subleveltemplate><ul>{{sublevel}}</ul></subleveltemplate></display>
            </atm-linx>
        </div>
        <div id="main-content">
            <div id="breadcrumbs">Vous êtes ici :
            <!-- Le type de liens à créer -->
            <atm-linx type="desclinks">
                <selection>
                    <!-- La page de départ sera la racine du site -->
                    <start>
                        <nodespec type="relative" value="root"/>
                    </start>
                    <!-- On s'arrête à la page en cours -->
                    <stop>
                        <nodespec type="relative" value="self"/>
                    </stop>
                </selection>
                <display>
                    <!-- J'affiche un lien -->
                    <htmltemplate>
                        <a href="{{href}}">{{title}}</a>
                    </htmltemplate>
                </display>
            </atm-linx> 
        </div>
            <atm-clientspace module="standard" id="main-content" />
      </div>
        <div class="aside">
            <atm-clientspace module="standard" id="aside" />
      </div>
        <div id="footer">
            <atm-linx type="sublinks">
                <selection>
                    <!-- Je sélectionne la page dont l'identifiant est 10 -->
                    <start>
                        <nodespec type="node" value="10" />
                    </start>
                </selection>
                <display>
                    <!-- J'utilise une simple liste à puces comme modèle HTML -->
                    <htmltemplate>
                        <li>
                            <a href="{{href}}">{{title}}</a>
                        </li>
                    </htmltemplate>
                    <subleveltemplate>
                        <ul class="links">{{sublevel}}</ul>
                    </subleveltemplate>
                </display>
            </atm-linx>
        </div>   
        <address>
            <!-- Indique la date de dernière publication ainsi que l'auteur de la modification -->
            <atm-last-update format="d/m/Y H:i:s"><small>Dernière mise à jour : {{date}} par {{firstname}} {{lastname}}</small></atm-last-update>
        </address>
    </body>
</html>

Il existe d'autres balises XML comme <atm-last-update> inséré dans le bas de page qui vous permettent d'aller plus loin dans les fonctionnalités que peut offrir un modèle de page.

Nous obtenons ainsi un modèle de page très générique que je vais pouvoir décliner facilement soit en modifiant la langue utilisée dans le modèle, les feuilles de styles, les identifiants de page appelés ou les espace clients présents.

La prochaine étape consiste à développer ses propres rangées de contenu ou adapter les rangées existantes pour personnaliser vos pages.

J'espère que ce tutoriel vous aura aidé à mieux comprendre comment développer vos propres modèles de page avec Automne. Et si vous avez des questions, n'oubliez pas que le forum est là pour vous aider :)


1 contribution(s)

Par LLORIS le 14/04/2018 11:04:50 :


Bonjour
Pour tous, les vrais prêteurs n'ont jamais existé et j'y croyais aussi jusqu'au moment où un témoignage parlait d'une dame du nom de Mme ANGELE MAURIN ,
une prêteuse particulière française que j'ai fini par contacter après une longue hésitation mais à ma grande surprise elle m'a octroyé un prêt de 25000€
après avoir suivi une procédure qui n'a duré que 24h. elle est fiable sincère et honnête. Si vous voulez retrouver le sourire comme moi,
contactez la en lui laissant votre demande sur son mail professionnel:


e-mail: angelemaurin16@gmail.com

Email: angelemaurin@outlook.com
*


















Bonjour
Pour tous, les vrais prêteurs n'ont jamais existé et j'y croyais aussi jusqu'au moment où un témoignage parlait d'une dame du nom de Mme ANGELE MAURIN ,
une prêteuse particulière française que j'ai fini par contacter après une longue hésitation mais à ma grande surprise elle m'a octroyé un prêt de 25000€
après avoir suivi une procédure qui n'a duré que 24h. elle est fiable sincère et honnête. Si vous voulez retrouver le sourire comme moi,
contactez la en lui laissant votre demande sur son mail professionnel:


e-mail: angelemaurin16@gmail.com

Email: angelemaurin@outlook.com


















Bonjour
Pour tous, les vrais prêteurs n'ont jamais existé et j'y croyais aussi jusqu'au moment où un témoignage parlait d'une dame du nom de Mme ANGELE MAURIN ,
une prêteuse particulière française que j'ai fini par contacter après une longue hésitation mais à ma grande surprise elle m'a octroyé un prêt de 25000€
après avoir suivi une procédure qui n'a duré que 24h. elle est fiable sincère et honnête. Si vous voulez retrouver le sourire comme moi,
contactez la en lui laissant votre demande sur son mail professionnel:


e-mail: angelemaurin16@gmail.com

Email: angelemaurin@outlook.com

























Bonjour
Pour tous, les vrais prêteurs n'ont jamais existé et j'y croyais aussi jusqu'au moment où un témoignage parlait d'une dame du nom de Mme ANGELE MAURIN ,
une prêteuse particulière française que j'ai fini par contacter après une longue hésitation mais à ma grande surprise elle m'a octroyé un prêt de 25000€
après avoir suivi une procédure qui n'a duré que 24h. elle est fiable sincère et honnête. Si vous voulez retrouver le sourire comme moi,
contactez la en lui laissant votre demande sur son mail professionnel:


e-mail: angelemaurin16@gmail.com

Email: angelemaurin@outlook.com





















Bonjour
Pour tous, les vrais prêteurs n'ont jamais existé et j'y croyais aussi jusqu'au moment où un témoignage parlait d'une dame du nom de Mme ANGELE MAURIN ,
une prêteuse particulière française que j'ai fini par contacter après une longue hésitation mais à ma grande surprise elle m'a octroyé un prêt de 25000€
après avoir suivi une procédure qui n'a duré que 24h. elle est fiable sincère et honnête. Si vous voulez retrouver le sourire comme moi,
contactez la en lui laissant votre demande sur son mail professionnel:


e-mail: angelemaurin16@gmail.com

Email: angelemaurin@outlook.com

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 : 24/04/2018   14:46:22

Haut