Thèmes - Arborescence

Pour créer un thème adHoc, étudier le thème par défaut fourni dans le paquet.



1 - ouvrir le fichier skin.dbt
il comprend actuellement 3 lignes.
Une 4e pourrait venir ultérieurement pour les sections qui doivent être impérativement fixées, et non pas positionnées selon la volonté du webmestre (admin) ou du skinneur (css).



Voici par exemple celui de Chronica :
sectiontop;HeroUnit;UpTab
sectionbtm;DownTab
col;cfgModuleGauche;cfgModuleDroit;sideBar3



Les 3 lignes actuelles doivent être obligatoirement complétées pour mettre la skin en fonction, avec pour chaque groupe de sections (sectiontop, sectionbtm et col) l'indication des sections que l'on utilisera, une ou plusieurs parmi celles-ci :

  • HeroUnit, UpTab,uppertab pour la sectiontop
  • DownTab pour la sectionbtm
  • cfgModuleGauche, cfgModuleDroit et sideBar3 pour la section col.


2 - Le menu relève uniquement de la config en admin et du style que l'on donne à sa ou ses classes.


3 - Pour fixer la largeur du site, c'est dans style.css, la classe wrapper.


4 -pour les fichiers _default.inc (page par défaut), _index.inc (page d'accueil) et les autres éventuelles pages spécifiques (_news.inc ou _forum.inc, par exemple), il est conseillé de ne pas toucher aux lignes avec html.

Mais on doit renseigner le contenu de sectiontop, sectionbtm et col avec les sections que l'on a définies dans skin.dtb (attention à bien préserver la syntaxe, en particulier les crochets vides).
 
 Par exemple on pourra avoir dans skin.dtb :

     sectionbtm;DownTab0;DownTab1;DownTab2
 
 On pourra remplir ainsi les déclarations des sections du bas,

dans _index.inc :

    ### Declaration des sections en bas
    $skin['sectionbtm'][] = "DownTab0"; // Section down
    $skin['sectionbtm'][] = "DownTab1"; // Section down


et dans _default.inc :

    ### Declaration des sections en bas
    $skin['sectionbtm'][] = "DownTab0"; // Section down
    $skin['sectionbtm'][] = "DownTab2"; // Section down


Ainsi la section DownTab0 (et ses différentes boites) sera présente à la fois dans la page Index et dans les pages par défault. alors que les sections DownTab1 et DownTab2 ne seront présentes que dans leurs pages respectives.
On peut multiplier des exemples pour les sections du haut et pour les colonnes. Le nombre de sections de chaque groupe de section n'est pas limité.

NB : Il y aura nécessairement des adaptations à faire dans la feuille de style style.css de la skin.
Actuellement, dans la feuille style.css de la no_skin, il y a pour la section DownTab l'id :
    #DownTab {
      background: #ddd;
    }

il faudra par exemple adapter
    #DownTab0, #DownTab1, #DownTab2  {
      background: #ddd;
    }


ou créer des id différentes pour chaque section...


Renseigner ou modifier en fonction des besoins : maxcols, left, right,wl,wr,wm.


  • maxcols : on y fixe le nombre maximal de colonne pour la page (1 à 5)
  • wl : largeur en nombre de colonnes pour la partie gauche
  • wr : largeur en nombre de colonnes pour la partie droite
  • wm : largeur en nombre de colonnes pour la partie centrale (si on ne le renseigne pas, il prendra automatiquement l'espace disponible restant). Si on ne renseigne rien en wl, wr et wm, ça marchera aussi et l'équilibre entre les 3 zones se fera en automatique. Si l'on renseigne, le skinneur conserve la maîtrise de la répartition.

5 - Il est possible d'afficher une page avec uniquement des sections horizontales, sans colonne ni partie centrale.


Cette image donne un aperçu de la mise en forme avec les placements possibles pour les boites.

Le nombre des sections du haut ou du bas est fonction du thème utilisé.


squelette

Info | Imprimer | Permalien