Fork me on GitHub

Première analyse de la structure des thèmes Xoops 2.2
4
200531
Juillet
  Marco Documentations 6625

Comme l'indiquait tout récemment Christian dans son article de présentation de Xoops 2.2, la partie thèmes a été retouchée dans cette nouvelle version de Xoops !
La nouveauté consiste principalement en l'apparition d'un thème pour l'administration: il est possible maintenant de personnaliser l'apparence de votre zone Admin !

Plus encore, le contenu standard d'un répertoire thème, auparavant assez simple, se structure davantage:

  • de nouveaux sous répertoires/fichiers font leur apparition, notamment pour gérer le thème de l'admin et les nouveaux menus
  • de nouveaux styles ont été ajoutés (notamment pour personnaliser les images, les formulaires, et les nouvelles barres de menu)

Cet article vous décortique très brièvement ces petites nouveautés.



Liste des thèmes livrés avec la version 2.2 de Xoops

Default (ou encore XDT Xoops Default Theme)

C'est le théme que vous connaissiez, qui a été mis à jour par Ralf 57 pour s'adapter à Xoops 2.2, notamment pour gérer le nouveau menu javascript ajouté dans la version2.2.


Phpkaox et x2t

Ces deux thèmes, déja présents dans les précédentes distributions, ont été seulement légèrement retouchés, seuls des fichiers primaires css et html utiles aux nouveaux panneaux d'administration de la 2.2 ont été ajoutés.


XMT (Xoops Modern Theme)

Basé sur le thème Kubrick de KavaXtreme , il a été crée par Ralf57 pour remplacer à terme le thème Default actuel, thème qui n'a pas été amélioré/mis à jour depuis bien longtemps. Ralf lance un appel aux contributeurs pour améliorer encore ce thème. Volontaires et imaginatifs, lancez-vous ! Il y a quelques jours certains proposaient le lancement d'un concours pour créer le nouveau theme par défaut de Xoops. A suivre...

Remarque: les fichiers theme.html des thèmes XDT/XMT comprennent également deux nouvelles fonctions javascript : function toggle, function swapimage, qui permettent de rendre déployables les options de notification (du type +/-).

Nouvelle Structure des thèmes

Voici la nouvelle structure des themes pour Xoops 2.2
/themes/ : repertoire, situé à la racine de xoops,dans lequel sont logés tous vos themes

A l'intérieur du répertoire de votre theme, vous devrez trouver :

  • /themes/votretheme/theme.html : fichier html général pour la partie publique de votre site
  • /themes/votretheme/themeadmin.html : fichier html général pour la partie admin de votre site
  • /themes/votretheme/blocks : répertoire qui contient les fichiers html de présentation des blocs
  • /themes/votretheme/css/ : répertoire qui contient les différentes feuilles de style de votre themes
  • /themes/votretheme/js/ : répertoire contenant les fichier javascript utilisés par votre theme (ex: menus javascripts, javascripts additionnels pour IE5.5)
  • /themes/votretheme/images/ : répertoire contenant les images utilisées par votre theme
  • /themes/votretheme/language/ : répertoire contenant les variables de langue pour l'admin de xoops
  • /themes/votretheme/navigation/ : répertoire contenant les fichiers html définissant les barres de navigation (barre user, barre admin, barre admin des modules)

Nouveautés dans le répertoire /css

A l'intérieur du répertoire css seront définis plusieurs fichiers de style, que nous listons ci-dessous :

  • style.css, styleMAC.css, styleNN.css : fichiers css pour la partie publique de votre site
  • styleAdmin.css, styleAdminMAC.css et styleAdminNN.css : fichiers css pour l'admin de xoops (dont 2 fichiers d'adaptation pour les browser Mac et Netscape/Mozilla)
  • les fichiers css éventuels de vos modules (ex: cbb-ex_newbb)
  • calendar.css utile pour personnaliser le calendrier Xoops, calendrier utilisé par certaines modules tels News, Extcal, etc.)

Nouveautés dans le fichier style.css

Pour mémo, le fichier style.css du thème default contenait les paramètres de présentation pour les zones suivantes de votre site :

  • vos pages en général (body,a, etc.)
  • des éléments spécifiques (item), comme exemple des éléments pour le module news
  • les blocs centraux (Center,Center Center, Center Left ,Center Right)
  • les colonnes de droite / gauche
  • les header/footer
  • le menu principal (mainmenu)
  • le menu utilisateur (usermenu)
  • les tables (outer, head, even, odd, foot,etc.)
  • les messages d'erreur/confirmation du système Xoops
  • les bb codes Code (code) et Quote (citation)
  • l'affichage des informations utilisateurs dans les modules (groupe, rang, etc.)

Par comparaison, on remarque les principales différences suivantes entre le thème Default pour Xoops 2.0.X et le thème Default pour Xoops 2.2 (liste non exhaustive):
  • ajout des styles pour les images ( img border)
  • ajout de styles pour les formulaires (.formButton, input)
  • ajout de styles pour le bloc recherche (.search_block)
  • ajout de styles pour la barre de navigation / barre de menu (.Navmenu)
  • ajout des styles fieldset, legend, divwrapper, .centered, table.maintable, table.toptable, table.footertable pour les éléments généraux
  • ajout de .comUserDetails, .comUserName pour les éléments utilisateurs
  • ajout .comIcons pour les icones

    • Qu'apporte le thème XMT?

    Il est toujours en DTD XHTML 1.0 Transitional. La balise table est toujours utilisée (en effet, tout le code de Xoops 2.2 n'est pas compatible xhtml strict encore).
    C'est le theme que vous trouverez à l'heure où j'écris l'article sur http://www.xoopsforge.com
    Il comprend un style spécifique additionnel pour newbb
    Il ne comprend pas de style pour le bb code Quote Citation (un oubli vraisemblablement).
    Il est commenté et un peu mieux structuré.
    Bref, ce thème n'est qu'un début, il ne demande qu'à être amélioré.


    Voila, ce n'est qu'une première lecture des nouveautés.
    Si vous voulez utiliser de manière optimale vos thèmes actuels sous la 2.2, il vous reste à modifier vos themes actuels à l'aide des nouveautés listées ci-dessus, en n'oubliant pas les fonctions javascript function toggle et function swapimage, ainsi que leurs images associées (minus.gif et plus.gif).
    Nous complèterons / améliorerons cet article avec l'expérience !


    merci à Christian et kris pour la relecture !
    Marc
Note: 0.00 (0 votes) - Noter cet article -

Partager Twitter Partagez cette article sur GG+
Format imprimable Envoyer cet article à un ami
Les commentaires appartiennent à leurs auteurs. Nous ne sommes pas responsables de leur contenu.
Semi pro
Inscrit le: 04/02/2003
De: Qc.ca
Contributions: 1389
king76 Posté le: 01/08/2005 07:20  Mis à jour: 01/08/2005 07:20
 Re: Première analyse de la structure des thèmes Xoops 2.2
he ben ca ne chome pas, manque plus qu'un article sur la migration des modules et on sera fin pret pour la 2.2 ;)

merci
Aspirant
Inscrit le: 06/01/2004
De:
Contributions: 63
skalpa Posté le: 08/08/2005 19:24  Mis à jour: 08/08/2005 19:24
 Re: Première analyse de la structure des thèmes Xoops 2.2
Petite note quand meme, avant que vous ne changiez tout pour rien
La structure des fichiers vous n'êtes pas obligés de la copier. C'est normalement un choix personnel des auteurs de themes.
Exemple: vous pouvez mettre les templates de blocs ou vous voulez (meme /themes/curtheme/A/B/blocs/tpl.html), il faut juste indiquer le bon chemin dans le template de page theme.html à l'endroit où vous insérez les blocs...

Seules exceptions (je crois):
- theme.html : toujours a la racine du theme
- la css insérée pas xoops <{$xoops_themecss}>

Pour ce dernier cas point perso (qui risque d'étonner un peu): à moins que votre theme ait explicitement besoin d'avoir 1 CSS pour NS4, une pour Mac et une 3eme pour les autres, ne l'utilisez pas. Ca ne sert pas à grand chose, et on arrive au même résultat avec:
Citation :
<link rel="stylesheet" type="text/css" media="screen" href="<{$xoops_imageurl}>style.css" />


Avec en plus l'avantage de pouvoir renommer / bouger la CSS où on veut (mais conseil perso pour les CSS elles-memes: laissez les ds la racine du thême... vu que les chemins des images référencées dedans sont relatifs à son emplacement, ca evite d'avoir des url('../images/xxx') partout ).


skalpa.>
Xoops accro
Inscrit le: 18/01/2004
De: Ma Caverne
Contributions: 2839
Marco Posté le: 08/08/2005 23:26  Mis à jour: 08/08/2005 23:35
 Re: Première analyse de la structure des thèmes Xoops 2.2
Citation :

Petite note quand meme, avant que vous ne changiez tout pour rien
La structure des fichiers vous n'êtes pas obligés de la copier. C'est normalement un choix personnel des auteurs de themes.

Merci skalpa pour cette petite précision. Cette structure n'est bien sur qu'indicative (l'objectif de l'article est de décrypter les themes nouveaux fournis dans cette 2.2, en les comparant par rapport aux thèmes de la 2.0.x), mais souhaitable : la structure proposée (par Ralf57) ne devrait pas faire de mal pour que le néophite s'y retrouve !

marco

nb : dis moi skalpa, ça fait un bail qu'on ne t'a pas vu sur xoops france Cool !
Aspirant
Inscrit le: 12/12/2004
De: 91
Contributions: 57
fundish Posté le: 02/09/2005 13:35  Mis à jour: 02/09/2005 13:35
 Re: Première analyse de la structure des thèmes Xoops 2.2
Je trouve que l’idée d’un concours pour trouver un nouveau thème par défaut à Xoops est une excellente idée. Xoops permet de faire des choses fantastiques, le support communautaire et très bon, mais l’apparence du thème actuel ne reflète pas la qualité sous jacente. Je pense que ça contribuerait réellement au succès de Xoops. Malheureusement beaucoup de personnes en recherche d’un CMS s’arrêtent à la première apparence visuelle.
J’espère donc que cette idée verra le jour...
Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

71 Personne(s) en ligne (1 Personne(s) connectée(s) sur Articles) | Utilisateur(s): 0 | Invité(s): 71 | Plus ...