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

Publié le : 17 juin 2007 – Dernière modification le 21 décembre 2021 – par Joseph

1
2
3
4
5
1 vote

Ceci est une archive périmée mais qui reste intéressante, parfois autant pour l’article que les commentaires associés.

Attention, cette contribution est EN CHANTIER : elle n’est peut-être pas fonctionnelle.

Nota : une contrib au développement arrêté par son créateur, pour laisser la place au noiZetier.

Cette page vise à décrire comment le Noisetier génère les pages finales d’un site et précise ce qu’est un thème.

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>

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>

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&eacute;e lorsque le squelette {article} est appel&eacute; 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&eacute;e lorsque le squelette {rubrique} est appel&eacute; 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&eacute;e lorsque le squelette {breve} est appel&eacute; sans id_breve ou avec un id_breve incorrect.[en]This page...</multi>";
$noisetier_pages[]='sommaire';
$noisetier_pages[]='accueil';

$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" />]

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>
]

Ce fichier définit la structure des pages. Il appelle <div> englobant adéquat pour le thème en cours avec les bonnes déclarations CSS (id ou class).

Les noms de zones peuvent différer de ceux des CSS. On essaiera, tant que faire se peut, d’utiliser des noms de zones suffisamment générique d’un thème à l’autre.

On s’aperçoit également que ce fichier peut faire des affichages conditionnels. Dans cet exemple, la page login a une structure différentes des autres.

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>";

?>

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

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>

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>

Et le tour est joué !!

Notes

[1] Note : cette zone n’a pas à être déclarée par le thème car il s’agit d’une zone générique directement gérée par le Noisetier.

Discussion

5 ans 1 an 3 mois Sans limite
par date
Filtrer

Aucune discussion

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

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.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom