CMS Automne

Forum de la communauté du CMS Automne
Nous sommes actuellement le Mar Déc 24, 2024 1:38 am

Le fuseau horaire est UTC [Heure d’été]




Publier un nouveau sujet Répondre au sujet  [ 16 messages ]  Aller vers la page 1, 2  Suivant
Auteur Message
MessagePublié: Ven Nov 19, 2010 11:23 am 
Hors-ligne

Inscrit(e) le : Ven Nov 19, 2010 11:05 am
Message(s) : 223
bonjours a tous, je maitrise bien xhtml et css, un petit peut php, mais la je suis un peut perdu, j'ai essayer la version demo et j'ai pu modifier comme je l'ai voulu mais maintenant avec la version vide je ne sais plus comment faire. quelqu'un pourrait il me donner la marche a suivre et surtout dans l'ordre svp ( du genre )
etape 1...
etape 2... ect

pour le design: ou mettre le css ?
ce cms me parait magnifique et je ne voudrais pas rater l'occasion de l'utilisé pour mon site.
merci d'avance a tous et surtout aux créateurs. a plus wind.


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Ven Nov 19, 2010 12:50 pm 
Hors-ligne
Administrateur
Avatar de l’utilisateur

Inscrit(e) le : Jeu Juin 16, 2005 8:05 am
Message(s) : 628
Localisation : Toulouse, France
Bonjour,

Ta question devance le tutoriel que je prépare, à savoir "Créer un site de A à Z avec Automne", je vais donc en profiter pour essayer d'être assez exhaustif sur la méthodologie à adopter, n'hésitez pas à me faire des retours s'il y a des points qui ne vous paraissent pas clairs.

La première chose quand on part d'un Automne vide va être de créer un modèle de page et une arborescence de pages.

A - Création d'un modèle de page : les préparatifs

SI tu as déjà ta maquette en pur HTML/CSS tu peux créer un modèle de page et coller ton code dedans.

Pour ce qui est de l'emplacement des fichiers par défaut il y a plusieurs dossiers à la racine :

/css : pour les feuilles de styles
/js : pour les scripts javascript
/img : pour les images

/automne/templates/ pour les modèles de pages
/automne/templates/rows/ pour les modèles de rangées

1 - Je fais ma maquette en XHTML/CSS/JS
2 - Je dépose mes CSS dans /css , je peux créer autant de sous-dossiers que nécéssaires pour m'organiser.

L'exemple de la démo :
Pièce jointe:
Description du fichier : Arborescence CSS de la demo
arborescence_css_automne.png
arborescence_css_automne.png [ 13.48 Kio | Consulté 77536 fois ]


A noter la présence du fichier 'cssmanager.php' qui est utilisé par Automne pour l'optimisation du chargement des feuilles de styles. Ne jamais toucher à ce fichier.

Un exemple d'arborescence possible :
Pièce jointe:
Description du fichier : Exemple d'arborescence des feuilles de styles CSS
custom_css_tree_automne.png
custom_css_tree_automne.png [ 4.64 Kio | Consulté 77536 fois ]

On est donc libre d'organiser ses CSS pour les modèles de pages.

[FACULTATIF - Chargement automatique des feuilles de styles de modules]
Pour les modules il faut savoir qu'Automne détecte automatiquement les fichiers placés dans le sous-dossier '/css/modules/' à condition que le nom de la feuille de style soit le même que celui du codename du module - son identifiant unique - , mais tu peux très bien faire des appels avec ton propre chemin si tu souhaites t'organiser différemment.

Ce qui donne :
Code :
/css/modules/CODENAME_MODULE.css


Pour connaître le codename d'un module, il faut aller dans la gestion du module, choisir l'application dans la liste et cliquer sur modifier, le codename est afficher sous le nom du module.

Pièce jointe:
Description du fichier : Gestion de module : propriétés
codename_module.png
codename_module.png [ 9.87 Kio | Consulté 77531 fois ]


Pour le module actualités si j'ai une feuille de style spécifique au module, je nommerais ma feuille de style 'pnews.css' et je dois me retrouver avec l'arborescence suivante :
Code :
/css/modules/pnews.css

[/FACULTATIF]

3 - Je dépose mes scripts Javascript dans le dossier /js

[FACULTATIF - Chargement automatique des fichiers Javascript liés à un module]
Pour les modules le principe est similaire pour les CSS faut que cette fois-ci on a un dossier par module.

Pour la détection automatique des fichiers JS liés à un module, on les places dans /js/modules/CODENAME_MODULE/script.js

Pour ajouter du JS détecté de manière automatique à mon module actualités, je le place dans /js/modules/pnews/script.js.
A noter que les scripts sont chargés dans l'ordre alphabétique lorsqu'on utilise le jsmanager.
[/FACULTATIF]

4 - Je dépose mes images dans le dossier /img, là encore totale liberté pour s'organiser. Perso je fais un dossier par site puis des sous-dossiers par modèle si besoin.

5 - Je créer un nouveau modèle de page dans Automne, je lui donne un nom et éventuellement une description, j'enregistre.
Maintenant je peux aller dans l'onglet "Définition XML" et recopier mon code source HTML. J'enregistre.
Par défaut un nouveau modèle est inactif, c'est à dire qu'il ne sera pas proposé lors de la création d'une nouvelle page. Il faut donc sélectionner le modèle et l'activer dans la liste des modèles.

6 - Je peux déjà tester mon nouveau modèle de page pour voir si j'ai tout bon. Pour cela je créer une nouvelle page et je lui affecte mon modèle.

Si tout se passe bien, la page crée sera conforme à la maquette HTML/CSS/JS. Je peux publier la page et vérifier que c'est aussi OK côté client.
Si tu as un problème à ce niveau c'est simplement une histoire de liens entre ton modèle et des fichiers CSS et JS. Si tu utilises la 4.02 tous les chemins sont absolus. Tes appels seront donc de la forme :

Code :
<link rel="stylesheet" type="test/css" href="/css/reset.css" media="all />
<link rel="stylesheet" type="test/css" href="/css/fonts.css" media="all />
<link rel="stylesheet" type="test/css" href="/css/modele1/screen.css" media="all />
<link rel="stylesheet" type="test/css" href="/css/print.css" media="print />


7 - Une fois arrivé jusque là je vous invite à suivre ce tutoriel sur la transformation d'une maquette HTML en modèle de page Automne.

8 - Une fois le modèle crée, il faut passer aux rangées. Automne intègre une aide pour la synthaxe dans l'onglet de "Définition XML".
Vous pouvez aussi consulter la documentation en ligne :
http://doc.automne.ws/web/Documentation ... ssique.php

Il est évidemment préférable d'avoir déjà fait le travail sur l'architecture du site et d'avoir créer les pages, même si c'est avec un modèle vide. Ça permettra de tester que les liens, sous-liens ou liens récursifs fonctionnent.

Merci de me dire si tout ça est assez clair, de manière à ce que je corrige le tutoriel en conséquence.

Je vais partir d'un exemple concret avec un design simple à intégrer pour le tutoriel, mais je pense qu'il y a ici déjà matière à te lancer dans la création de ton premier modèle de page.

_________________
Frank
http://www.automne-cms.org


Dernière édition par Frank le Ven Nov 19, 2010 4:03 pm, édité 1 fois.
Ajout d'une mention facultative pour le chargement automatique des CSS et de JS


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Ven Nov 19, 2010 5:26 pm 
Hors-ligne

Inscrit(e) le : Ven Nov 19, 2010 11:05 am
Message(s) : 223
je pense que je n'ai pas trop compris les définitions de "modele de page" et "modele de rangée" pourtant j'ai lu et relu mais je ne suis pas trop familier avec les CMS et je pense que mon problème est dans l'organisation dans les fichiers, je continue a fouiller.
merci beaucoup ++.


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Ven Nov 19, 2010 6:31 pm 
Hors-ligne
Administrateur
Avatar de l’utilisateur

Inscrit(e) le : Jeu Juin 16, 2005 8:05 am
Message(s) : 628
Localisation : Toulouse, France
Pas de soucis. J'essaie de expliquer la philosophie d'Automne :)

Automne c'est comme les poupées russes.

Ce schéma illustre un exemple de la structure d'une page :
http://www.automne.ws/automne_modules_files/pmedia/public/r145_9_schemaautomne2-2.jpg

Maintenant le vocabulaire est peut-être pas forcément le même (modèle, espace client, rangées) que celui qu'on trouve dans d'autres CMS.

  • Un site web est composé de pages,
  • Les pages ont des modèles (templates, gabarits ou squelettes c'est pareil),
  • Les modèles ont des zones modifiables (ou espaces clients),
  • Les zones modifiables peuvent recevoir divers types de blocs contenus (on appelle ça des rangées dans Automne)
  • Chaque bloc de contenu peut contenir différents assortiments de types de contenus (texte, image, fichier, données dynamiques)

OK ?

L'apparence de chaque page est donc définie dans un modèle de page. (ex. modèle de page d'accueil)
Ce modèle XML est en fait la maquette HTML/CSS + liens de navigations dynamiques + définition des zones modifiables.
C'est cette partie qui est détaillée dans le tutoriel sur la création de modèles de page.

Jusque là c'est bon ?

Chaque zone de contenu modifiable de la page peut contenir divers blocs de contenus (les rangées donc).

L'utilisateur aura à sa disposition une bilbiothèque de rangées pour ajouter des blocs de contenus dans ses pages.
Exemple : Une rangée "Texte + média" , une rangée "Derniers billets de blog", une rangée "carte Google Maps" voire une rangée "formulaire".

Certaines rangées seront à usage unique, d'autres pourront être utilisées sur autant de page qu'on veut.

C'est plus clair sur la différence entre un modèle de page et une rangée ?

N'hésite pas à faire des retours ou des commentaires, c'est pas forcément évident de capter le principe en 5 minutes.

_________________
Frank
http://www.automne-cms.org


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Ven Nov 19, 2010 6:57 pm 
Hors-ligne

Inscrit(e) le : Ven Nov 19, 2010 11:05 am
Message(s) : 223
donc si j'ai bien compris, le model de page est un accés ou une administration de la source au lieu de notpad++ par exemple ?


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Ven Nov 19, 2010 7:17 pm 
Hors-ligne
Administrateur
Avatar de l’utilisateur

Inscrit(e) le : Jeu Juin 16, 2005 8:05 am
Message(s) : 628
Localisation : Toulouse, France
Tout à fait. Le modèle de page contient la source de la structure de la page et défini les zones modifiables ainsi que les liens de navigation.

Je précise que rien ne empêche d'utiliser son éditeur préféré pour éditer les modèles de pages pour Automne.,
On peut ensuite soit recopier son code valide XHTML dans l'onglet 'Définition XML' de l'interface d'Automne soit déposer le fichier XML valide directement dans le dossier /automne/templates/mon_modele.xml

L'avantage de la première méthode c'est que le parser XML intégré dans Automne te signalera si tu as fait des erreurs. Pratique quand on débute ;)

_________________
Frank
http://www.automne-cms.org


Dernière édition par Frank le Sam Nov 20, 2010 10:49 am, édité 1 fois.
Précision sur l'utilisation d'un éditeur externe


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Ven Nov 19, 2010 7:25 pm 
Hors-ligne

Inscrit(e) le : Ven Nov 19, 2010 11:05 am
Message(s) : 223
ok merci beaucoup pour les infos, je travaille dessus et je visualise mieux l'ensemble, merci.


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Sam Nov 20, 2010 6:20 pm 
Hors-ligne

Inscrit(e) le : Ven Nov 19, 2010 11:05 am
Message(s) : 223
rien a faire, je ni arrive pas et je ne comprend pas ou ça va pas :cry:


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Sam Nov 20, 2010 6:25 pm 
Hors-ligne

Inscrit(e) le : Ven Nov 19, 2010 11:05 am
Message(s) : 223
1) je crée un modèle de page avec le modèle XML du site
2) je fait un fichier css pour le modèle et je le met dans le dossier /css a la racine
3) je met les images dans /img
4) je crée mes pages avec le modèle XML

Si j'ai bien compris je devrais voir apparaître le template mais rien ne se passe ?
c'est peut être trop dur pour moi, je déprime........... :cry:


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Sam Nov 20, 2010 9:39 pm 
Hors-ligne

Inscrit(e) le : Ven Nov 19, 2010 11:05 am
Message(s) : 223
c'est bon, j'ai commencé a faire l'architecture, je travaillais avec un mauvais fichier CSS :oops:


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Dim Nov 21, 2010 11:13 am 
Hors-ligne
Administrateur
Avatar de l’utilisateur

Inscrit(e) le : Jeu Juin 16, 2005 8:05 am
Message(s) : 628
Localisation : Toulouse, France
Citer:
Si j'ai bien compris je devrais voir apparaître le template mais rien ne se passe ?


J'en profite pour rappeler le comportement par défaut d'Automne :
Pour apparaître dans les modèles de pages proposés lors de la création d'une nouvelle page, le modèle doit être activé manuellement au préalable.

Pour activer un modèle, il suffit de le sélectionner et de cliquer sur le bouton activer.

Pièce jointe:
Description du fichier : Automne : gestion des modèles de page - activer un modèle
activer_modele_automne.png
activer_modele_automne.png [ 69.27 Kio | Consulté 77505 fois ]


Ne te décourage pas, je suis sur que tu vas y arriver. Je suis là si tu as des questions. :)

_________________
Frank
http://www.automne-cms.org


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Dim Nov 21, 2010 3:15 pm 
Hors-ligne

Inscrit(e) le : Ven Nov 19, 2010 11:05 am
Message(s) : 223
salut, je continue ici comme il s'agit d'un depart de zero:
le xml me pose des soucis de plus l'organisation n'a rien a voir avec mes connaissances mais je m'en sort.
j'ai un truc que je ne comprend pas:
j'ai crée une sous page, elle est bien présente dans l’arborescence de l'admin elle marche elle est présent dans le fil d'arriane mais elle n’apparaît pas dans le menu principale, j'ai pris l'exemple automne pour le xml, le meme menu mais avec 3 page et une sous page


Pièces jointes:
Sans titre.jpg
Sans titre.jpg [ 21.51 Kio | Consulté 77499 fois ]
Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Dim Nov 21, 2010 6:59 pm 
Hors-ligne
Administrateur
Avatar de l’utilisateur

Inscrit(e) le : Jeu Juin 16, 2005 8:05 am
Message(s) : 628
Localisation : Toulouse, France
Quel sont les pages que tu veux afficher dans le menu de navigation ?

Si tu veux afficher la 2, la 3 et la 4, on peut utiliser utiliser la syntaxe pour afficher des sous-liens, mais c'est limité à 1 seul niveau.

J'en déduis que tu as du utilisé un code qui ressemble à celui-ci :
Code :
<!-- Je veux afficher des sous-liens de la racine -->
<atm-linx type="sublinks">
            <selection>
              <!-- Je pars donc de la racine du site -->
              <start><nodespec type="relative" value="root"/></start>
            </selection>
            <display>
              <!-- J'affiche un item de liste pour chaque sous-page de la racine -->
              <htmltemplate><li><a href="{{href}}">{{title}}</a></li></htmltemplate>
            </display>
</atm-linx>


Or si tu veux tout afficher y compris la page 5, il faut utiliser la syntaxe pour afficher des liens récursifs afin de pouvoir descendre dans d'autres niveaux de l'arborescence.

On écrira donc plutôt :

Code :
<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>
</atm-linx>

_________________
Frank
http://www.automne-cms.org


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Lun Nov 22, 2010 9:22 pm 
Hors-ligne

Inscrit(e) le : Ven Nov 19, 2010 11:05 am
Message(s) : 223
bon pour moi ça va pas trop mal, j'ai refais mon ancien site (html pure) avec automne et j'en suis très content, en fait c'est pas trop compliqué le plus dur c'est l'organisation qu'il faut comprendre.
la je n'arrive pas a uploader des photos, pas de catégorie mais je ne trouve pas ou les créer.
si non c'est vraiment un bel outil.


Haut
 Profil  
 
 Sujet du message: Re: pas tout compris
MessagePublié: Lun Nov 22, 2010 10:21 pm 
Hors-ligne
Administrateur
Avatar de l’utilisateur

Inscrit(e) le : Jeu Juin 16, 2005 8:05 am
Message(s) : 628
Localisation : Toulouse, France
Content de voir que tu t'en sors bien ;)

_________________
Frank
http://www.automne-cms.org


Haut
 Profil  
 
Afficher les messages publiés depuis :  Trier par  
Publier un nouveau sujet Répondre au sujet  [ 16 messages ]  Aller vers la page 1, 2  Suivant

Le fuseau horaire est UTC [Heure d’été]


Qui est en ligne ?

Utilisateur(s) parcourant ce forum : Aucun utilisateur inscrit et 7 invité(s)


Vous ne pouvez pas publier de nouveaux sujets dans ce forum
Vous ne pouvez pas répondre aux sujets dans ce forum
Vous ne pouvez pas éditer vos messages dans ce forum
Vous ne pouvez pas supprimer vos messages dans ce forum
Vous ne pouvez pas insérer de pièces jointes dans ce forum

Recherche de:
Aller vers :  
Powered by phpBB® Forum Software © phpBB Group
Traduit par Maël Soucaze et Elglobo © phpBB.fr