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é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';
$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ème basé 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ê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ête</multi>";
$theme_zones['soustete']['descriptif'] = "<multi>[fr]Située sous l'en-tête de page, cette zone peut servir à 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électionné, affiché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ée à l'affichage du contenu principal de la page.</multi>";
$theme_zones['infosgauche']['nom'] = "infosgauche";
$theme_zones['infosgauche']['titre'] = "<multi>[fr]Infos à gauche</multi>";
$theme_zones['infosgauche']['descriptif'] = "<multi>[fr]Informations complémentaires dans une colonne à 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 à droite</multi>";
$theme_zones['infosdroite']['descriptif'] = "<multi>[fr]Informations complémentaires dans une colonne à 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émentaires affichées sous le contenu principal et sous les boî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é parnoisetier-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 quenom
est d’un usage technique. Sititre
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 valeurtoutes
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 fichiernoisetier-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 quepages
, 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 oupages
oupages_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 avecinsere_avant:truc
. Siinsere_avant:truc
est présent, c’estinsere_avant:truc
qui sera utilisé, sinon c’estinsere_avant
. Si rien n’est déclaré, aucune balise HTML ne sera insérée. -
insere_apres
fonctionne de la même manière queinsere_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é !!
Aucune discussion
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 : |