Passer à Zpip (pratique)

  Réponses à quelques questions, pour bien faire.

On vous a vanté (ou imposé) l’usage de Zpip, indispensable pour utiliser le thème de la mort qui a "tapé dans l’oeil" de la communication...
Zpip ou Z, Zcore et Thèmes

Et maintenant ?
Il faut convertir sa pratique de squelettes à Zpip !

Article publié le 5 janvier 2013, et actualisé en juin 2017

   
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

En un mot, le fonctionnement avec ZPIP est exactement le meme qu’avec SPIP et la dist, y compris les variantes de squelettes ; la surcharge de vos squelettes et/ou noisettes se fait en respectant les sous-dossiers à re-créer dans ./squelettes...

Vous avez lu la documentation sur Zpip [1] ; installé Zpip !
Alors, au travail [2] !

 Comment se décompose mon squelette de page

Au lieu d’utiliser un squelette nouveau par page appelée (mais en respectant toujours les standards SPIP pour La construction des URL),
Zpip automatise la re-composition de la page éclatée en sous-blocs tirés
(en standard) des sous-dossiers suivants :

  • contenu/ extra/ navigation/ : pour les blocs affichés
  • head/ : pour les partie spécifiques dans <HEAD  />
    avec une partie commune placée dans inclure/

avec deux répertoires réservés aux fichiers communs :

  • inclure/ : pour toutes les noisettes communes ou utilitaires
    en particulier les entete et pied communs
  • img/ : pour les images d’habillage dans les squelettes [3]
    certains ajouteront aussi css/ ou js/ qui ne sont pas pris en compte directement.

Zpip utilise le nom type du squelette appelé (en standard ou en page=) pour appeler les blocs correspondants dans chaque dossier, et s’il n’y trouve pas son bonheur, il va prendre par défaut dans ce dossier le squelette nommé dist

Respectez strictement ces principes de localisation de vos fichiers ;
il vous semblera souvent facile de bricoler une autre solution la première fois, qui ne sera qu’un hack tordu, et très prochainement vous vous retrouverez coincé !

Pour vous faciliter la tache : installez le plugin SkelEditor, et éventuellement recopiez les squelettes HTML contenus dans le plugin Zpip (surtout dans ses sous-dossiers ./contenu et ./inclure), dans votre dossier squelettes, ce qui vous créera les sous-dossiers indispensables [4].

Si ça marche pas !! Zpip vous demande seulement de préciser le paramètre {env} dans toutes vos instructions d’appels <INCLURE{fonds=...}{env}> à vos sous squelettes !

 Comment s’appelle mon squelette

Il faut préciser la question exacte ! Demandez-vous :
- le nom du squelette principal d’objet éditorial type ou de la page nommée composition => voir l’URL-page en fonction de l’appel
- le nom de la noisette concernée => utilisez var_mode=inclure ou Skeleditor

Zpip gère le nom de page-type (selon la nomenclature des Squelettes de la "dist"), sinon il présuppose un type de page quelconque, et gère les compositions...
Comme il traite explicitement chaque type de page dans les squelettes et noisettes, vous pourriez tester la page courante avec les balises SPIP sur les variables d’environnement correspondantes.... Euhh, c’est pas très clair ! ;-)
Alors, voici déjà une ligne de code que vous pouvez rajouter dans le body.html de vos squelettes Z pour voir l’interprétation de votre URL-page :

  1.   [<p> type:#ENV{type}  / composition: #ENV{composition} :
  2.     (#AUTORISER{webmestre})   #SELF  </p>]

Télécharger

Mais heureusement Zpip propose un simple balise #SI_PAGE{page}, qui permet de tester facilement dans les squelettes internes que l’on est sur une page donnée (sans tester type et composition expliqués ci-dessous) [5]
Ainsi, pour respecter l’organisation un peu particulière de la page d’accueil de SPN, sans avoir à resserrer tous les ’wrapper’, le source body contient :

<div id="page">
 <div id="entete">
   <INCLURE{fond=inclure/entete,env}>
          [<p> type:#ENV{type} &nbsp;  / page: #ENV{page} / composition: #ENV{composition} : #SELF (#AUTORISER{webmestre})</p>]
 </div>
[  (#SI_PAGE{sommaire}|non)
<div class="wrapper col2">
 <div id="breadcrumb">
   <div id="nav">
     <div id="navigation">
     <INCLURE{fond=navigation/#ENV{type},env}>
     </div navigation>
   </div nav>
 </div>
</div wrapper col2>
] [  (#ENV{composition}|=={sommaire}|oui)
  <INCLURE{fond=navigation/#ENV{type},env}>
]

Les variables internes correspondantes interprétées par Zpip sont respectivement :
- le type de page accessible dans #ENV{type},
- et pour une page non-standard [6] :

  • imaginons de nommer le squelette principal : page-avril pour pouvoir définir un appel par l’URL ?page=avril que vous placerez peut-etre dans un squelette avec <a href="#URL_PAGE{avril}">Page Anniversaire</a>
  • creons le seul squelette de contenu,
    dans le sous-dossier contenu/
    au nom page-avril.html
    contenant juste la boucle [7] Articles qui va bien !
    Pour le fun, on va même rajouter deux lignes pour proposer au lecteur des #TRI et #PAGINATION par auteur, titre date ou date..

C’est fait ! Votre page anniversaire est déjà intégrée au site.
Et personne ne doutera qu’il s’agit d’une page rajoutée,
à un site dont vous ignorez totalement la présentation et les CSS !

 Un design à 7 blocs

Mais si, c’est possible : en deux mots,
- vous rajoutez vos blocs en <div.. dans le body.html,
sur le modèle de         <INCLURE{fond=panel/#ENV{type},env}>,
- vous créez les sous-dossiers correspondants dans./squelettes/
- vous aurez aussi à spécifier la suite des noms de nouveaux blocs : voir la doc : une ligne dans mes_fonctions :
$GLOBALS['z_blocs']=array('contenu','navigation','extra','pied','titre','panel','flottant'); ;.

Ensuite, écrivez vos noisettes dans les dossiers, prévoyez au moins des dist.html
par défaut, sans oublier quelques déclarations de CSS dans perso.css !

 Header spécifique ?

je voudrais inclure un head différent pour la page sommaire, mais la balise #INSERT_HEAD ne semble pas permettre de sélection , comment faudrait-il procéder ?

En Zpip, il suffit de créer dans squelette un dossier ./head
et d’y coller pour le sommaire (pas page-sommaire pour des objets traditionnels de Spip ),
un fichier homonyme, déduit du head/dist.html qui se trouvait dans /plugins/auto/zpip/...

Bon attention tout de meme, car le header, c’est l’exemple exceptionnel qui :
- est construit par zpip_../structure et non par body

  1. <INCLURE{fond=head/#ENV{type},env}>
  2. <INCLURE{fond=inclure/head}>

Télécharger


- donc utilise une partie mutualisée, depuis inclure/head
- doit utiliser une partie spécifique pour afficher le <TITLE> de la page (et les métas)
- utilise aussi les ajouts de #INSERT_HEAD et #INSERT_CSS
- peut donc récupérer les inc-insert-head introduits par les plugins et les thèmes.

 Et pour changer de thème

Rappelons qu’un thème se limite strictement à l’habillage graphique du site. [8]

Vous pouvez utiliser le plugin ZenGarden, ou bien, dans mes_options :

  1. if (!_DIR_RACINE)  {
  2.   $GLOBALS['dossier_squelettes'] .= ':theme/mon_taime';}

Télécharger

Et vous pouvez admirer l’effet du thème que vous avez copié dans ./themes/mon_taime Sous réserve de changement possible, car on a parlé de ré-intégrer les thèmes dans les plugins : pour l’instant les deux fonctionnent sous Zpip.....


Merci de nous signaler les coquilles, imprécisions ou erreurs qui figureraient dans cette page.

[2] Ou, comment en faire le moins possible !

[3] Ne pas confondre avec les [logos] ou Images et Multimédias d’illustration à chaque article ou document editorial !

[4] Vous penserez ensuite à y supprimer tous les fichiers que vous n’auriez pas modifiés depuis l’origine !

[5] Pour la petite histoire, relisez https://contrib.spip.net/3256#forum...cette balise m’était sorti de la tete au moment de convertir le sommaire en Z, d’où les tests et explications ci-dessus !

[6] , son nom est accessible dans #ENV{composition}.

Pour changer de Layout ?

Deux fichiers seulement à modifier surcharger :
- copiez la noisette zpip_../body body dans votre dossier squelettes (et encore.. seulement si vous voulez modifier le regroupement des trois blocs contenu, navigation et extra )
- redéfinissez (surchargez) les définitions des div de classe/id #contenu, #navigation, #extra, et celles de #page #body etc... dans une feuille de style perso.css dans ce meme dossier !

Dans les variantes de pages ?

Les variantes de squelettes permettent de faire choisir un squelette différent, en fonction de certaines rubriques ou branches : le squelette de la rubrique ou de l’article est suffixé du nombre-clé identifiant la rubrique, par exemple article=33.html.
La bonne nouvelle, c’est que Zpip respecte ces variantes optionnlles, à la seule condition que tant le squelette general que ses variantes, soient copiés au même niveau dans votre sous-dossier de squelettes où vous introduisez une variante !

Créer une nouvelle page

Vous devez écrire en urgence un nouveau squelette pour afficher une boucle un peu spéciale ! Prenons en exemple une page anniversaire de tous les articles des années passes au 1° du mois[[D’avril, bien entendu

[7] D’accord, il faut retrouver les trois lignes : Pour TROUVER DES BOUCLES, cherchez dans une Bouclo-thèque !

[8] Au contraire de l’usage plus confus sur d’autres CMS, modifiant tant les graphismes que la présentation des données !!


Liens A2A visibles seulement pour les inscrits.
Liens visibles seulement pour les inscrits.
   

Article publié le 5 janvier 2013, et actualisé en juin 2017 .

Répondre à cet article