La Compilation des pages par le Noisetier (doc de dév)

Attention :

Cette page est un début de documentation du projet « Noisetier » en cours de développement. Les éléments ci-dessous ne sont pas figés et peuvent être amenés à évoluer au cours du développement du projet.

Nous rappelons que ce projet étant en cours de développement, certaines fonctions n’ont pas encore été codées. Il faut éviter d’installer le Noisetier sur un site en production tant qu’une première version ne sera pas finalisée.

La construction des pages du site, dans le cadre du projet Noisetier, résulte d’une communication entre le thème et le Noisetier. Chaque page est découpée en plusieurs zones. C’est le thème qui gère le positionnement des différentes zones, ainsi que l’habillage CSS des pages. Le noisetier, quant à lui, remplit chaque zone avec les noisettes et les textes qui lui ont été déclarés et passe les variables d’environnement et les paramètres nécessaires au fonctionnement de chaque noisette.

Les pages gérées par le Noisetier

Première étape, définir les pages qui seront gérées par le Noisetier. Ces pages appelleront les fichiers noisetier-body et noisetier-head situé dans le thème.

Le squelette des pages gérées par le Noisetier ont une forme générique. Par exemple, pour la page sommaire :

#CACHE{86400}
[(#REM) Déclaration du type de document, indispensable pour le navigateur web ]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="#LANG_DIR" lang="#LANG">
<head>
[(#REM) Appel du modèle d'en-tête du plugin de thème]
<INCLURE{fond=noisetier-head}{env}{page=sommaire}>
</head>
<body id="sommaire" class="page_sommaire">
[(#REM) Appel du modèle de corps du plugin de thème ]
<INCLURE{fond=noisetier-body}{env}{page=sommaire}>
[(#REM) Balises html de fermeture de la page]
</body>
</html>

Télécharger

Vous noterez que la variable page doit être passée manuellement car en fonction du type d’URL utilisé sur le site, elle ne se trouve pas toujours dans le contexte courant.

Certaines pages, telles que la page article, n’ont pas le même affichage selon qu’un id correct leur soit passé en paramètre ou non. Pour ces dernières, nous allons créer des pages virtuelles. Par exemple, voici le squelette de la page article :

#CACHE{86400}
<BOUCLE_article_principal(ARTICLES){id_article}>
[(#REM) Page affichée en cas d'id correct ]
[(#REM) Déclaration du type de document, indispensable pour le navigateur web ]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="#LANG_DIR" lang="#LANG">
<head>
[(#REM) Appel du modèle d'en-tête du plugin de thème]
<INCLURE{fond=noisetier-head}{env}{page=article}>
</head>
<body id="article" class="page_article">
[(#REM) Appel du modèle de corps du plugin de thème ]
<INCLURE{fond=noisetier-body}{env}{page=article}>
[(#REM) Balises html de fermeture de la page]
</body>
</html>
</BOUCLE_article_principal>
[(#REM) Page affichée en cas d'id incorrect ]
[(#REM) Déclaration du type de document, indispensable pour le navigateur web ]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="#LANG_DIR" lang="#LANG">
<head>
[(#REM) Appel du modèle d'en-tête du plugin de thème]
<INCLURE{fond=noisetier-head}{env}{page=articles}>
</head>
<body id="articles" class="page_articles">
[(#REM) Appel du modèle de corps du plugin de thème ]
<INCLURE{fond=noisetier-body}{env}{page=articles}>
[(#REM) Balises html de fermeture de la page]
</body>
</html>
<//B_article_principal>

Télécharger

Si un id_article correct est passé, alors le Noisetier est appelé en lui demandant de construire la page article. En l’absence d’id_article ou en cas d’id_article incorrect, le noisetier est appelé en lui demandant de construire la page articles (notez le s). La page articles ne dispose pas d’un squelette de page en propre. Il s’agit donc d’une page virtuelle. Simplement, noisetier-body et noisetier-head sont appelés en forçant la valeur de la variable page à articles.

Pages livrées avec le Noisetier

Le plugin Noisetier est livré avec les pages suivantes :

404
accueil
article
auteur
breve
forum
login
mot
plan
recherche
rubrique
site
sommaire

Créer de nouvelles pages

De nouvelles pages peuvent être créées pour interagir avec le Noisetier. Pour cela, il suffit de se baser sur les squelettes génériques ci-dessus dans son répertoire squelettes ou bien à la racine d’un plugin.

Cependant, il est nécessaire de déclarer ces pages pour que l’interface de gestion du Noisetier puisse les prendre en compte. La déclaration est la même qu’il s’agisse d’une page virtuelle ou non. Elle se fait dans le fichier mes_options.php du site ou du plugin considéré.

Cette déclaration sera de la forme :

//Définition des pages gérées par le noisetier
global $noisetier_pages, $noisetier_description_pages;
if (!isset($noisetier_pages)) $noisetier_pages = array();
$noisetier_pages[]='article';
$noisetier_pages[]='articles';
$noisetier_description_pages['articles']="<multi>[fr]Cette page est renvoyée lorsque le squelette {article} est appelé sans id_article ou avec un id_article incorrect.[en]This page...</multi>";
$noisetier_pages[]='rubrique';
$noisetier_pages[]='rubriques';
$noisetier_description_pages['rubriques']="<multi>[fr]Cette page est renvoyée lorsque le squelette {rubrique} est appelé sans id_rubrique ou avec un id_rubrique incorrect.[en]This page...</multi>";
$noisetier_pages[]='breve';
$noisetier_pages[]='breves';
$noisetier_description_pages['breves']="<multi>[fr]Cette page est renvoyée lorsque le squelette {breve} est appelé sans id_breve ou avec un id_breve incorrect.[en]This page...</multi>";
$noisetier_pages[]='sommaire';
$noisetier_pages[]='accueil';

Télécharger

$noisetier_pages est un tableau listant simplement les pages interagissant avec le noisetier. La déclaration des pages dans ce tableau est obligatoire.

$noisetier_description_pages permet d’attribuer à chaque page un descriptif. Ce dernier est optionnel.

Le fichier noisetier-head

Comme nous l’avons vu ci-dessus, le squelette de page appelle les fichiers noisetier-body et noisetier-head qui sont situés à la racine du plugin de thème.

Le fichier noisetier-head se présente sous une forme comme celle-ci :

#CACHE{86400}
<INCLURE{fond=noisetier-compilateur-tete}{env}>
[(#REM)
Entete standard de toutes les pages ; les elements specifiques
(title, description) sont inseres vias une noisette
]
[(#REM) Lien vers l'icone destinee a la barre de bookmarks ]
[<link rel="shortcut icon" href="(#CHEMIN{favicon.ico})" />]
[(#REM) Lien vers le flux RSS du site ]
[<link rel="alternate" type="application/rss+xml" title="<:syndiquer_site:>" href="(#URL_PAGE{backend})" />]
[(#REM) Feuille de style par defaut pour le code genere par SPIP ]
[<link rel="stylesheet" href="(#CHEMIN{spip_style.css}|direction_css)" type="text/css" media="all" />]

Télécharger

Le fichier noisetier-head doit tout d’abord appeler le noisetier-compilateur-page situé à la racine du plugin Noisetier, puis il peut faire ses propres déclarations à placer dans le <head>.

Si un thème gère un switcher de CSS, c’est dans ce fichier que sera placé le code permettant de charger la bonne CSS.

Le fichier noisetier-body

En voici un exemple :

#CACHE{86400}
[
(#ENV{page}|!={'login'}|?{' ',''})
<div id='page'>
<div id='entete'>
<INCLURE{fond=noisetier-compilateur-page}{env}{zone=entete}>
</div>
<div id='hierarchie'>
<INCLURE{fond=noisetier-compilateur-page}{env}{zone=soustete}>
</div>
<div id='conteneur'>
<div id='contenu'>
<INCLURE{fond=noisetier-compilateur-page}{env}{zone=contenu}>
<div class='contre-encart'>
<INCLURE{fond=noisetier-compilateur-page}{env}{zone=infosgauche}>
</div>
<div class='encart'>
<INCLURE{fond=noisetier-compilateur-page}{env}{zone=infosdroite}>
</div>
<INCLURE{fond=noisetier-compilateur-page}{env}{zone=souscontenu}>
</div>
</div>
<div id='pied'>
<INCLURE{fond=noisetier-compilateur-page}{env}{zone=pied}>
</div>
</div>
]
[
(#ENV{page}|=={'login'}|?{' ',''})
<div id='mini_pres'>
<INCLURE{fond=noisetier-compilateur-page}{env}{zone=contenu}>
</div>
]

Télécharger

Ce fichier définit la structure des pages. Il appelle Définir les particularités d’un thème : le fichier options_noisetier.php

Pour que l’interface de gestion du Noisetier puisse s’adapter aux différents thèmes, il est nécessaire que le thème déclare les zones qu’il gère et sur quelle page celles-ci apparaissent. Cette déclaration se fera dans un fichier options_noisetier.php situé à la racine du plugin de thème.


Ce fichier sera de la forme suivante :
<?php
 
global $theme_titre, $theme_descriptif, $theme_zones;
 
$theme_titre = 'Fraichdist';
$theme_descriptif = '<multi>[fr]Th&egrave;me bas&eacute; sur les squelettes fournis en standard avec SPIP.</multi>';
$theme_zones = array();
 
$theme_zones['entete']['nom'] = "entete";
$theme_zones['entete']['titre'] = "<multi>[fr]En-t&ecirc;te de la page</multi>";
$theme_zones['entete']['pages_exclues'] = "login";
 
$theme_zones['soustete']['nom'] = "soustete";
$theme_zones['soustete']['titre'] = "<multi>[fr]Sous l'en-t&ecirc;te</multi>";
$theme_zones['soustete']['descriptif'] = "<multi>[fr]Situ&eacute;e sous l'en-t&ecirc;te de page, cette zone peut servir &agrave; afficher l'arborescence des pages ou bien un menu horizontal.</multi>";
$theme_zones['soustete']['pages_exclues'] = "login";
 
$theme_zones['navigation']['nom'] = "navigation";
$theme_zones['navigation']['titre'] = "<multi>[fr]Navigation</multi>";
$theme_zones['navigation']['descriptif'] = "<multi>[fr]Colonne de navigation dans le site. Elle est, selon le style s&eacute;lectionn&eacute;, affich&eacute;e sur la droite ou sur la gauche de la zone contenu.</multi>";
$theme_zones['navigation']['pages_exclues'] = "login";
 
$theme_zones['contenu']['nom'] = "contenu";
$theme_zones['contenu']['titre'] = "<multi>[fr]Contenu de la page</multi>";
$theme_zones['contenu']['descriptif'] = "<multi>[fr]Cette zone est destin&eacute;e &agrave; l'affichage du contenu principal de la page.</multi>";
 
$theme_zones['infosgauche']['nom'] = "infosgauche";
$theme_zones['infosgauche']['titre'] = "<multi>[fr]Infos &agrave; gauche</multi>";
$theme_zones['infosgauche']['descriptif'] = "<multi>[fr]Informations compl&eacute;mentaires dans une colonne &agrave; gauche.</multi>";
$theme_zones['infosgauche']['pages_exclues'] = "login";
$theme_zones['infosgauche']['insere_avant'] = "<div style='width:245px; float:left;'>";
$theme_zones['infosgauche']['insere_apres'] = "</div>";
 
$theme_zones['infosdroite']['nom'] = "infosdroite";
$theme_zones['infosdroite']['titre'] = "<multi>[fr]Infos &agrave; droite</multi>";
$theme_zones['infosdroite']['descriptif'] = "<multi>[fr]Informations compl&eacute;mentaires dans une colonne &agrave; droite.</multi>";
$theme_zones['infosdroite']['pages_exclues'] = "login";
$theme_zones['infosdroite']['insere_avant'] = "<div style='width:245px; float:right;'>";
$theme_zones['infosdroite']['insere_apres'] = "</div>";
 
$theme_zones['souscontenu']['nom'] = "souscontenu";
$theme_zones['souscontenu']['titre'] = "<multi>[fr]Sous-contenu</multi>";
$theme_zones['souscontenu']['descriptif'] = "<multi>[fr]Informations compl&eacute;mentaires affich&eacute;es sous le contenu principal et sous les bo&icirc;tes d'infos.</multi>";
$theme_zones['souscontenu']['pages_exclues'] = "login";
$theme_zones['souscontenu']['insere_avant'] = "<div style='width:100%; float:left;'>";
$theme_zones['souscontenu']['insere_apres'] = "</div></div>";
 
$theme_zones['pied']['nom'] = "pied";
$theme_zones['pied']['titre'] = "<multi>[fr]Pied de page</multi>";
$theme_zones['pied']['pages_exclues'] = "login";
$theme_zones['pied']['insere_avant'] = "<div style='width:100%; float:left;'>";
$theme_zones['pied']['insere_apres'] = "</div></div>";
 
?>
Télécharger
ATTENTION : un nom de zone ne doit pas contenir le caractère - (tiret), ni d’accent. De plus, head est un nom de zone réservée puisque le noisetier gère une zone pour les en-têtes HTML de la page.
$theme_titre permet de définir le nom du thème. On peut utiliser les raccourcis SPIP en particulier la balise <multi></multi>.
$theme_descriptif permet de donner un descriptif au thème. Les raccourcis de SPIP sont utilisables.
$theme_zones définit les différentes zones utilisées dans le plugin. Elles doivent correspondre à celle du fichier noisetier-body.html. Elles seront affichées dans l’espace privé dans l’ordre où elles auront été ici définies.
 nom correspond au nom stocké dans la base et utilisé par noisetier-body.html. Cette entrée du tableau est obligatoire.
 titre peut utiliser les raccourcis typographiques de SPIP. Il permet de nommer de manière plus explicite la zone, tandis que nom est d’un usage technique. Si titre n’est pas présent, nom sera affiché à la place.
 descriptif est optionnel. Il est permet de décrire la zone.
 pages est optionnel. Il prend la valeur toutes ou bien une liste de nom de pages séparés par une virgule. Cela permet de spécifier qu’une zone n’est affichée que par certaines pages. Ce paramètre ne sert que pour l’espace privé. Le fichier noisetier-body.html doit être cohérent avec ce qui est déclaré ici.
 pages_exclues permet de spécifier qu’une zone ne doit pas être affichée sur certaines pages. De la même manière que pages, il s’agit du nom d’une page ou d’une suite de noms séparés par des virgules (sans espaces). En règle général, pour une même zone, on utilisera ou pages ou pages_exclues.
 insere_avant permet de spécifier, dans l’espace privé, les balises HTML à insérer avant le formulaire de zone afin de personnaliser l’affichage. Il est possible de spécifier une balise spécifique pour l’affichage de cette zone sur la page truc avec insere_avant:truc. Si insere_avant:truc est présent, c’est insere_avant:truc qui sera utilisé, sinon c’est insere_avant. Si rien n’est déclaré, aucune balise HTML ne sera insérée.
 insere_apres fonctionne de la même manière que insere_avant sauf qu’il s’agit des balises HTML à insérer après la zone.
Le compilateur d’en-tête : noisetier-compilateur-tete.html
Voici son code :
#CACHE{86400}
[(#REM) Preciser le charset ]
<meta http-equiv="Content-Type" content="text/html; charset=#CHARSET" />
[(#REM) Fierement fabrique avec SPIP ]
<meta name="generator" content="SPIP[ (#SPIP_VERSION)]" />
[(#REM) Inclusion dans le head pour les noisettes le nécessitant]
<BOUCLE_noisettes_avec_entete(NOISETTES){page IN #ENV{page},'toutes'}{exclue != #ENV{page}}{actif=oui}{par position}>
        <BOUCLE_entetes_noisettes(PARAMS_NOISETTES){type=head}{id_noisette}>
                [(#DESCRIPTIF)
                ]
        </BOUCLE_entetes_noisettes>
</BOUCLE_noisettes_avec_entete>
[(#REM) Inclusion des noisettes d'en-têtes]
#SET{selection_page,#ENV{page}|noisetier_selection_page}
#SET{selection_exclue,#ENV{page}|noisetier_selection_exclue}
<BOUCLE_noisettes(NOISETTES){page==#GET{selection_page}}{exclue!==#GET{selection_exclue}}
{zone=head}{actif=oui}{par position}>
[(#TYPE|=={'noisette'}|?{' ',''})
        <INCLURE{fond=noisette}{id_noisette=#ID_NOISETTE}{env}>
]
[(#TYPE|=={'texte'}|?{' ',''})
        [(#DESCRIPTIF**)]
]
</BOUCLE_noisettes>
[(#REM) Balise permettant aux plugins d'inserer des appels javascript ou css ]
#INSERT_HEAD
Télécharger
Il insère d’une part les noisettes de la zone head [1], puis il insère les déclarations spécifiques des noisettes ayant besoin d’une entrée dans l’en-tête HTML. Ceci ne sera plus nécessaire si les balises #DEBUT_TEXTE_HEAD et #FIN_TEXTE_HEAD intègrent le core.
Le compilateur de page : noisetier-compilateur-page.html
Voici son code :
#CACHE{86400}
#SET{selection_page,#ENV{page}|noisetier_selection_page}
#SET{selection_exclue,#ENV{page}|noisetier_selection_exclue}
<BOUCLE_noisettes(NOISETTES){page==#GET{selection_page}}{exclue!==#GET{selection_exclue}}
{zone=#ENV{zone}}{actif=oui}{par position}>
[(#TYPE|=={'noisette'}|?{' ',''})
        <INCLURE{fond=noisette}{id_noisette=#ID_NOISETTE}{env}>
]
[(#TYPE|=={'texte'}|?{' ',''})
        [(#DESCRIPTIF)]
        [(#NOTES)]
]
</BOUCLE_noisettes>
Télécharger
On sélectionne les noisettes et les textes actifs et on les inclue dans le bon ordre. Afin de passer les bonnes variables d’environnement et les paramètres adéquat, les noisettes sont inclues dynamiquement via le fond noisette auquel on passe le bon id_noisette.
Le code de noisette est le suivant :
<BOUCLE_noisette(NOISETTES){id_noisette}>
<?php
        $contexte_noisette = array();
        $contexte_noisette['fond'] = 'noisettes/#FOND';
        $contexte_noisette['id_noisette'] = '#ID_NOISETTE';
        <BOUCLE_env(PARAMS_NOISETTES){id_noisette}{type=env}>
                $contexte_noisette['#TITRE'] = $contexte_inclus['#TITRE'];
        </BOUCLE_env>
        <BOUCLE_param(PARAMS_NOISETTES){id_noisette}{type=param}>
                $contexte_noisette['#TITRE'] = '[(#VALEUR|addslashes)]';
        </BOUCLE_param>
        $contexte_inclus = $contexte_noisette;
        include (_DIR_RESTREINT_ABS.'public.php');
?>
</BOUCLE_noisette>
Télécharger
Et le tour est joué !!

SPIP-Contrib

La Compilation des pages par le Noisetier (doc de dév)

Les pages gérées par le Noisetier

Pages livrées avec le Noisetier

Créer de nouvelles pages

Le fichier noisetier-head

Le fichier noisetier-body

PHANTOM (HTML5UP)

Galleria (fr)

ScolaSPIP 4

Newsletters

SPIP 3.2, Agenda et FullCalendar

SPIP Blog

SPIP - Seenthis

SPIP Forums

SPIP-Zone

SPIP SVN

La Compilation des pages par le Noisetier (doc de dév)

Les pages gérées par le Noisetier

Pages livrées avec le Noisetier

Créer de nouvelles pages

Le fichier noisetier-head

Le fichier noisetier-body

Le compilateur d’en-tête : noisetier-compilateur-tete.html

Le compilateur de page : noisetier-compilateur-page.html

Notes

Rubriques

Derniers commentaires

Compatibilité

Noisetier (abandonné)

Répondre à cet article

Ça discute par ici

Ça spipe par là

SPIP-Zone