Installer Zpip
Zpip se charge et s’installe comme un plugin. Pour installer Zpip et jouer avec sans plus attendre, il suffit de suivre le guide d’installation pas à pas.
Une fois installé, vous pourrez vous faire plaisir en téléchargeant des thèmes déjà existants, et revenir lire la suite de cet article au moment de mettre un peu les mains dedans pour le personnaliser !
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 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 est simple :
<div id="page">
<div id="entete">
<INCLURE{fond=inclure/entete,env}>
</div>
<div id="nav">
<INCLURE{fond=inclure/barre-nav,env}>
</div>
<div id="conteneur">
<div id="contenu">
<INCLURE{fond=contenu/#ENV{type},env}>
</div>
<div id="navigation">
<INCLURE{fond=navigation/#ENV{type},env}>
<INCLURE{fond=extra/#ENV{type},env}>
</div>
</div>
<div id="pied">
<INCLURE{fond=inclure/pied,env}>
</div>
</div>
Nous voyons que ce layout ne gère qu’une unique colonne #navigation
, laquelle intègre le contenu des blocs de navigation
et extra
.
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.html
contenant seulement :
#FORMULAIRE_INSCRIPTION
pour que la page complète spip.php?page=inscription
soit disponible.
Pour réaliser cela Zpip utilise les éléments communs inclure/entete.html
, inclure/barre-nav.html
et inclure/pied.html
. Pour les éléments de navigation et d’extra, Zpip utilise par défaut les squelettes navigation/dist.html
et extra/dist.html
si aucun squelette navigation/page-inscription.html
ou extra/page-inscription.html
n’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 squelette contenu/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 barrenav
pour 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.
Discussions par date d’activité
168 discussions
J’ai signalé un petit bug sur le thème Wu-wei, via un commentaire. Y aurait-il un bug tracker où l’on peut soumettre un rapport de bug qui serait plus visible à la communauté ?
Non, c’est parfait : le suivi et le support se font par les forums de SPIP-Contrib.
Répondre à ce message
J’ai téléchargé le plugin SLOGAN par svn et cela fonctionne.
Maintenant je ne réussis pas à faire fonctionner le plugin boutonstexte. Est-il incompatible ?
Merci
Euuhh, excusez moi mais je ne trouve pas le plugin SLOGAN compatible avec SPIP 2.0. Uniquement pour 1.9.
Merci par avance...
Je viens de mettre a jour le plugin Slogan pour SPIP 2.0
Répondre à ce message
J’ai téléchargé par svn de spip-zone.
http://zone.spip.org/trac/spip-zone/browser/_plugins_/_stable_/slogan/plugin.xml?rev=18501
Cela fonctionne très bien.
RP
Répondre à ce message
Il me semble que dans inclure/article-resume.html, la boucle
BOUCLE_nb_commentaires(FORUMS) ne soit pas fermée. svn 34180
si, si. Il s’agit d’une boucle auto fermée avec un
/>
ce qui est équivalent à
Répondre à ce message
Aucun des thèmes ZenGarden ne semble fonctionner... le fond est bien là, mais le contenu n’a aucune mise en forme :
spip 2.0.10, Zen-Garden 33476 ou 34077 (auto) ou 34153 (svn), OutDoor 34078 ou autres ... aucun autre plugin sauf Bonux.
Réponse : Aïe... pas eu le temps de supprimer mon message, il y avait déjà une réponse...
Faute stupide de ma part sur un nouveau site : j’ai installé Zen-garden mais pas zpip .... :-/
Tu as sans doute des squelettes personnalisés dans ton dossier
squelettes/
, qui ne sont pas compatible. Renomme ton dossiersquelettes/
pour vérifier.Répondre à ce message
Bonjour,
tout d’abord bravo pour le travail accompli, très pratique cette gestion des thèmes, ça manquait vraiment.
J’ai créé un menu à l’aide du plugin Menus, que j’ai nommé barrenav. Il s’insère bien dans ma page.
Seulement, si mon menu possède plus d’un niveau, tous les items et sous-items sont affichés sur la même ligne. Je voulais savoir si c’est simplement que le thème choisi n’a pas géré un menu arborescent (avec un menu dépliable par exemple) et que je dois donc le faire moi-même (c’est bien au thème de gérer ça ??) ou si j’ai oublié de faire quelque chose.
Merci
Salut Thomas,
Sans doute que c’est cette solution. Les thèmes n’ont pas tous prévu le menu déroulant. Particulièrement si les thèmes originaux n’ont pas de menus déroulant.
Je pense que tu peut modifier et proposer tes modifications. Voire commiter directement les modifications sur la zone du thème.
:)
Merci pour ta réponse.
Je vais surement m’y pencher donc et je proposerai mes modifications.
Hello Thomas,
C’est un bug de compréhension du plugin menu : opte pour un objet spip et choisis rubrique, numéro de rubrique et là tu n’auras plus d’arborescence ;-)
Comme toi j’avais opté pour menu arborescent avec arborescence « 0 » mais ça donne quand même infini...
L’objet spip est la solution pratique actuellement.
Répondre à ce message
Bonjour,
Je me demande pourquoi dans Zpip les blocs navigation et extra sont dans un même div navigation alors que, plus logiquement selon moi, dans LayoutGala ils sont au même niveau.
Est-ce que ça ne bloque pas une possibilité et une autonomie supplémentaire du bloc extra ?
Merci.
En fait, chaque thème peut définir son propre encadrement des différents éléments ; c’est le fichier « body.html » que surcharge chaque thème. Par conséquent, ce n’est pas limitant, puisque chaque thème indique les différents blocs qu’il souhaite.
Répondre à ce message
C’est ce que je voulais dire...
Répondre à ce message
Ah oui, effectivement tu as raison.
Mais du coup ce n’est pas terrible car il y a confusion entre l’inscription pour écrire et celle nécessaire pour recevoir la newsletter.
Il faudrait mettre du conditionnel ou bien conditionner par rapport à SPIP listes.
A suivre.
Ah non, y a rien a conditionner dans Zpip. C’est tout le principe : au lieu d’essayer de prévoir tous les plugins inimaginables, ce qui conduit à une usine à gaz, on prévoit une structure simple et ouverte, avec une API, sur laquelle chaque plugin pourra se brancher.
Donc les problèmes sont à résoudre dans SPIP-Listes ! :p
Répondre à ce message
Bonsoir et merci pour le cadeau,
J’ai une petite question. Dans quel ordre sont examiné les réertoires pour le squelette ?
Est ce bien : themes -> squelettes -> plugin zpip ?
Si j’ajoute un plugin pour redéfinir certaines pages de Zpip, comment faire pour qu’il soit examiné au moment souhaité (càd entre squel et zpip ou entre themes et squel ?)
Merci
C’est plugin zpip / plugin nécessitant ou utilisant zpip -> themes -> squelettes.
Si tu installe un theme en comme un plugin, tu pourrais faire :
zpip -> plugin positionné après zpip | themes -> plugin nécesitant theme -> squelettes.
Ce qu’il ya dans ton squelettes est toujours prioritaire, si tu y mets body.html et habillage.css , les thèmes n’ont plus d’effet (ou quasiment).
Pour les pages : les pages par défaut de spip n’ont pâs besoin de page- devant . Si tu créé une nouvelle page, il faudras écrire page-nomdemapage.html .
Mais bon, c’est pas encore très clair de mon coté
:)
Répondre à ce message
Ajouter un commentaire
Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :
Merci d’avance pour les personnes qui vous aideront !
Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.
Suivre les commentaires : |