Installer Zpip-dist
Pour installer Zpip-dist et jouer avec sans plus attendre, il suffit de suivre le guide d’installation pas à pas.
A noter que Zpip-dist s’installe comme un plugin ! Vous pourrez déjà vous faire plaisir avec la galerie de thèmes, et revenir lire la suite au moment de mettre un peu les mains dedans pour le personaliser !
Le projet Zpip
Plus qu’un squelette, Zpip est un exemple d’un système de squelette qui met en application les idées exposées dans Modèle de squelette réutilisable. Il propose une organisation des squelettes visant à le rendre :
- habillable par des thèmes indépendants du squelette
- maintenable dans le temps, par une duplication minimale du code
- rapidement déployable, au prix d’un petit apprentissage initial sur son organisation Zpip s’adresse aussi bien aux débutants qui veulent profiter d’une galerie de thèmes prêts à l’emploi, qu’aux webmestres avancés pour qui il propose un fonctionnement et des mécanismes productifs. Toute l’organisation et le fonctionnement de Zpip peuvent être réutilisés pour construire de nouveaux squelettes qui bénéficieront des mêmes avantages.
Organisation des fichiers
Zpip-dist redéfinit tous les squelettes par défaut de la dist de SPIP, à la racine de son dossier : 404.html, article.html, auteur.html, backend.html, breve.html, forum.html, login.html, mot.html, page.html, plan.html, recherche.html, rubrique.html, site.html, sommaire.html, et spip_pass.html. À l’exception du flux RSS (backend.html), tous ces squelettes sont réécrits de façon minimale pour inclure structure.html qui produira toutes les pages. Vous pouvez donc oublier tous ces squelettes issus de la dist : vous n’aurez plus besoin de les manipuler, sauf cas exceptionnel. Nous voici donc avec deux squelettes supplémentaires à la racine : structure.html et body.html.
Le premier, structure.html, pose la structure minimale de la page HTML, inclut les squelettes chargés de produire le head, puis le body.html qui définit le layout unique et sur lequel nous revenons ci-dessous plus en détail. Zpip contient de plus six sous dossiers.
Deux sont génériques :
-
img/qui contient toutes les images de décoration -
inclure/qui contient les squelettes communs et partagés entre les différentes pages du site. Les quatre autres dossiers déclinent des morceaux de la page html en fonction de la page du site sur laquelle on se trouve : -
head/qui contient les squelettes de la section<head>personnalisée pour chaque page, lorsque c’est nécessaire, qui s’ajoute à un<head>commun situé dansinclure/ -
contenu/dans lesquels seront mis tous les squelettes produisant le contenu principal de chaque page -
extra/dans lesquels seront mis tous les squelettes produisant les informations extra contextuelles pour chaque page -
navigation/dans lesquels seront mis tous les squelettes produisant les informations de navigation propres à chaque page
Layout Unique
Zpip est donc organisé autour d’un layout unique décrit par body.html qui intègre 6 entités logiques de contenu et les structure à sa guise dans le HTML. Les 6 entités sont nommées selon la convention ci-dessous, eu égard à leur contenu informationnel et sans préjuger de la dénomination et de la structure englobante définie par le thème :
- entête fournit la présentation de la page et d’identité du site
- barre-nav constitue la navigation principale du site ; peut être vide
- contenu contient l’information principale de la page, déclinée par type de page
- navigation fournit des éléments de navigation secondaire, déclinés par type de page
- extra fournit des éléments d’information connexes contextuels, déclinés par type de page
- pied fournit des éléments de repérages et de rappels secondaires Le layout par défaut de Zpip-dist est simple :
Nous voyons que ce layout ne gère qu’une unique colonne
#navigation, laquelle intègre le contenu des blocs denavigationetextra.Pages automatiques
Zpip intègre un mécanisme de génération automatique des pages complètes à partir d’un seul squelette de contenu. Par exemple, il suffit d’écrire un squelette minimal
contenu/page-inscription.htmlcontenant seulement :pour que la page complète
spip.php?page=inscriptionsoit disponible. Pour réaliser cela Zpip utilise les éléments communsinclure/entete.html,inclure/barre-nav.htmletinclure/pied.html. Pour les éléments de navigation et d’extra, Zpip utilise par défaut les squelettesnavigation/dist.htmletextra/dist.htmlsi aucun squelettenavigation/page-inscription.htmlouextra/page-inscription.htmln’est défini. Ce mécanisme de pages automatiques permet d’ajouter, aussi rapidement que facilement, des pages spécifiques, en cohérence immédiate avec le reste du site. De même, il permet à des plugins de fournir des pages dédiées, utilisables sur tous les sites quelle qu’en soit leur structure, laquelle sera automatiquement fournie par Zpip. Par exemple, un plugin de newsletter peut facilement fournir un squelettecontenu/page-abonnement.html(permettant à l’abonné de gérer son abonnement), qui pourra être utilisé tel quel par tous les sites reposant sur Zpip.Menu de navigation principale
Zpip permet de gérer votre navigation principale directement dans l’espace privé à l’aide du plugin Menus. Il suffit de créer un menu avec l’identifiant
barrenavpour qu’il soit automatiquement inséré à la place de la navigation principale, sans modifications de fichiers.Compositions
Zpip est naturellement conçu pour fonctionner avec le plugin Compositions qui permet d’utiliser plusieurs types de composition par objet, et de décliner les cœurs de page en fonction des besoins.
Thèmes
Grâce à sa structure, Zpip est utilisable directement avec une galerie de thèmes interchangeables. Pour faciliter l’écriture de nouveaux thèmes pour Zpip, un certain nombre de conventions ont été documentées qui permettent de définir un socle commun. Les thèmes qui respectent ces conventions pourront être utilisés indifféremment avec Zpip ou tout autre squelette reposant sur la même structure et les mêmes conventions.