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_INSCRIPTIONpour 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
Bonjour, j’utilise le jeux de squelette Zpip sur mon site perso sous SPIP 2.0.
J’ai un problème avec le cache, apparemment la balise #CACHE ne semble s’appliquer qu’à l’élément « contenu ». Du coup je ne peux forcer le rafraichissement automatique des autres éléments de la page : « navigation » et « extra » par exemple.
Êtes vous au courant de cette limitation ? Comment la contourner ?
PS Je débute avec spip
PSS Mon site perso est http://sirateheme.free.fr et l’élément qui me pose problème est le plugin météo (rainette), sur la page d’accueil les infos ne sont pas automatiquement rafraichies alors qu’elles le sont sur la page dédiée http://sirateheme.free.fr/spip.php?page=meteo&ville=ITXX0086
Répondre à ce message
Petite question bete, J’arrive à reproduire le comportement d’un squelette personalisé de rubrique comme dans article-XX.html.
je dois mettre utiliser le article-XX.html à la racine de mon squelette « Z » et dans /contenu , /extra et cie ou il y a une methode plus élégante ?
Tu peux utiliser le suffixage -XX sur n’importe lequel des blocs, il n’est pas necessaire de le faire à la racine.
Par exemple
contenu/article-XX.htmlpermet de personaliser uniquement le contenu das articles de la rubrique concernée, les autres blocs étant inchangés.Je rappelle que SPIP nécessite que ce squelette soit dans ce cas dans le même répertoire que le
contenu/article.html, pour des raisons de performance. Il faut donc que tu copie ce dernier à côté de ta déclinaison pour la rubrique XX.en effet, c’est aussi simple que ça. Dans mon test, j’avais pas de article.html dans /contenu .
Merci :)
Répondre à ce message
À moins d’avoir mal compris, à priori, Zpip repose (impose) une organisation de langue par secteur. En effet une valeur lang=yy passée dans une url n’est pas retenue si on est dans une rubrique, un article... située dans un secteur de langue xx. C’est toujours la valeur xx du secteur qui est retenue.
L’utilisation de ZPIP est de ce fait assez contraignante. Peut-on contourner cette contrainte ? Où (= quel fichier modifier, adapter...) si on veut avoir une souplesse plus grande face au multilinguisme ?
Mais peut-être ai-je mal compris ou zappé quelque chose ?
Zpip ne repose/propose rien du tout en terme de multilinguisme.
Zpip n’est pas un squelette multifonctions, mais avant tout une organisation de squelette. Fonctionnellement, il reprend ni plus ni moins le squelettes-dist de SPIP.
Il faut le décliner en un squelette multilingue reposant sur Zpip. Mais l’expérience montre qu’en terme de multilinguisme, il y a autant de squelettes que de site, car tout repose sur les contenus.
@Manu
J’ai adapté un Zpip au multilinguisme, si tu cherches dans les vieux posts, j’y ai mis ce que j’ai utilisé pour l’adapter.
je suis confronté au meme problème
je ne retrouve pas ton commentaire sur la question ben
un lien ?
une explication succinte ?
merci d’avance
Salut Albert,
J’ai posté trop haut (pas en réponse)...
Trop de fatigue ;)
Répondre à ce message
Bonjour,
Pour l’instant, je suis assez satisfait des modifs pour le multilingisme. (Sur ce site : http://www.e-cosystems.org/)
Sans avoir forcement tout peaufiné, je me disais qu’il y a peut être des pistes dans les posts suivants, sur d’autres points que celui présenté :
Le 15 janvier à 14:20
Pour passer le plugin « slogan » passe avec la balise
Le 13 janvier à 22:13
Pour avoir le plugin menu qui gère les langues, il faut mettre les langues en secteur (un oubli d’article et ça ne marche pas).
Le petit problème par la suite, c’est que dans la sidebar de gauche, les rubriques indique « Français »
« Je ne me souviens plus trop comment j’ai géré pour ça, je pense que j’ai du mettre dans le code de sidebar Sous rubrique de la lang, plutot que la rubrique. Je peux regarder si tu es confronté à ce problème »
Le 13 janvier à 21:37
Pour avoir les derniers articles de la page « sommaire » dans la langue sélectionnée.
Pour mes autres posts, beaucoup étaient inutiles (pour enlever les numéros par exemple), car cela est paramétrable dans le plugin couteau suisse.
Le 12 janvier à 19:21
Pour avoir les menus dans la langue sélectionnée.
(Je ne sais plus si cela était toujours utile après la gestion du menu avec le plugin menu...)
Il y aurait sans doute d’autres trucs à voir, par exemple pour la sélection de la langue comme étant celle du navigateur par défaut, mais je me suis pas penché dessus...
Pour switcher la langue en cours d’article (ou secteur), je ne l’ai pas fait, pensant que les personnes choisissent leur langue au départ. Le lien vers les traductions de l’article permettant tout de même cette fonctionnalité.
Pour permettre de switcher la langue en cours d’article (ou secteur), peut être serait il possible de voir comment se fait la gestion du « switch » pour les « Toutes les versions de cet article » et de voir comment il est adaptable dans le choix de la langue sectorielle ?
En espérant que ma fatigue de la journée ne se ressente pas trop de la pseudo clarté de mon contenu ;)
Répondre à ce message
Bonjour,
Je voudrais savoir comment ajouter un module à zpip :
J’ai fait une page qui liste les 3 dernières brèves postées, et je voudrais pouvoir l’appeler avec une adresse du type spip.php ?dernieres_breves, si je le met dans le répertoire /squelettes/ quand je demande page=dernieres_breves il n’affiche que la page, sans l’inclure dans le reste du site.
J’ai essayé de le mettre dans /squelettes-dist, dans /zpip ou dans /zpip/contenu mais l’adresse spip.php ?dernieres_breves redirige toujours sur la page d’accueil.
Je cherche donc où placer le fichier dernieres_breves.html et comment l’apeller.
Merci d’avance.
Didi
L’article Zpip et la création rapide de pages répondra surement à ta question.
Merci d’avoir répondu si rapidement, c’était exactement ça que je cherchait.
Il faut donc nommer la page : page-nomdlapage.html dans le dossier /contenu/ pour l’appeler via l’adresse spip.php ?page=nomdlapage et ça marche !
Répondre à ce message
Bonjour,
merci pour ce squelette, tres pratique. Je voulais savoir si il y avait la possibilté de faire pour la page d’accueil,(que ce soit avec n’importe quel theme)un peu comme le fait un squelette que j’’utilise pour un autre site : beespip, a savoir :
- la page d’accueil n’affiche que les articles d’une rubrique spécifique, et non les derniers articles publiés.
- Je prefere ce type de présentation, de 1 a 4 articles maximum, qui donne une information sur le site et son contenant, les derniers news, et on accede aux articles via le menu rubrique.
- Je pense qu’il y moyen de faire ca en modifiant les boucles avec des mots-clés, mais j’avoue que je ne sais pas trop ou le faire, dans le repertoire zpip quels sont les fichiers a modifier ?
- Est-ce que je peux arriver a avoir cela avec Zpip ?
Merci d’avance,
Christian
Eh bien la réponse est simple : Zpip n’est rien d’autre qu’une (ré)-organisation des squelettes, scindés et ventilés de façon à pouvoir se concentrer sur les boucles et le contenu....
Dans ton cas, il te faut modifier le squelette /contenu/page-sommaire.html pour adapter cette portion de page à tes besoins... ZPIP ne fait en effet rien de particulier : c’est à toi d’adapter les fichiers à tes besoins... Comme pour tout bon squelette que tu veux personnaliser....
Merci Manu pour ta réponse, claire et rapide, je vais de ce pas m’y coller.
Cordialement.
Répondre à ce message
Bonjour,
Je trouvais dommage d’avoir les balises meta description et surtout la balises title si bas dans le code là où les moteurs préfèrent (peut être plus maintenant, ça change vite...) les avoir le plus haut possible.
J’ai alors monté la ligne #INCLUREfond=inc-theme-head,env dans le fichier inclure/head.html mais rien y fait.
Les autres modifications dans ce même fichier sont prises en compte sans soucis (ce qui me démontre que j’attaque bien le bon fichier) mais le bloc que je cherche à remonter persiste à passer en second.
Au delà de mon cas personnel, n’est-il pas mieux de trouver ces 2 balises essentielles tout en haut du code ?
Dans tous les cas je trouve ce plugin très utile car structurant, bravo !
Répondre à ce message
Bonjour,
Pour modifier l’entête zpip d’une page (body), on crée dans /head des squelettes article.html, page-objet.html, ...
function xxx_insert_head($flux){??<head>comme par exemple : supprimer le backend par défaut, modifier description et abstract, ... ?La partie de
<head>commune à toute les pages est définie parinclure/head.html.Il suffit de personnaliser ce squelette.
Ah c’est donc bien pour le
<head>du html alors...Mais alors où personnalise-t-on le
<div id="entete">alors ?Faut-il créer un dossier /entete ?
Lorsque l’on personnalise
<head>, peut-on encore lire les cookies ou bien des caractères ont-ils déjà été envoyés empêchant de relire l’entête http??Répondre à ce message
Bonjour,
Pour info, j’aime bien le plugin « crayons ». Mais avec Zpip, on ne peut pas éditer les rubriques, seulement les articles.
Du coup, ca marche en remplaçant dans contenu/rubrique.html
par
Bonne journée
PS : Je préférais quant il y avait des titres aux commentaires ;) pour la lisibilité
Il manque en effet une balise
#EDIT, c’est un oubli !Ah c’est donc bien pour le
<head>du html alors...Mais alors où personnalise-t-on le
<div id="entete">alors ?Faut-il créer un dossier /entete ?
Répondre à ce message
Bonjour,
Désolé mais je sèche sur le plugin menu dans Zpip, je cherche désespérément où se cache l’option permettant d’afficher ou non les sous-menus ?
Quelqu’un pourrai-il m’aider ?
Merci d’avance.
André
Pour les sous menus , c’est dans les thèmes.
On a pas toujours pris le temps de faire les sous menus. Faut que je m’y mette pour andrea, c’est fait sur arclite, pixel et sans doute d’autres.
le souci c’est que j’ai bien vu un fichier body.html commun aux thèmes, dans ceux-ci on a un appel vers barre-nav du plugin Zpip mais je n’arrive pas à comprendre (désolé) comment les sous-menus sont activés. Le fichier CSS y serait-il pour quelque chose ?
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 :
|
