Accueil du site - Le squelette - Les versions

Squelette Epona 3.3.3

Publié le lundi 2 mars 2009.


Ce squelette généraliste s’applique à un site SPIP à partir de la version 2.0.

- il s’installe par simple dépôt de fichiers,
- il comporte des options gérables à 100% par SPIP,
- un outil permet d’automatiser l’activation de ces options,
- il est extensible (nouvelles présentations de pages) par simple ajout de fichier et mot clé,
- il ne demande qu’un changement de Logo pour être personnalisé,
- il fonctionne en Français, Anglais et Espagnol et est extensible par simple ajout de fichier
- les pages sont imprimables et conformes W3C ,
- il ne comporte ni n’exige aucun Plugin mais permet leur utilisation,
- il est sous licence GPL.


Les différences par rapport à Epona v3.3.2

Réincorporation de recherche.html qui avait disparu par erreur.


1. Présentation

Le menu de navigation

Ce menu de navigation dynamique, présent sur toutes les pages du site, est réalisé en CSS sans Javascript [1]. Le menu de base permet de naviguer dans les rubriques du site et d’accèder à l’agenda s’il existe, mais on peut le personnaliser.

Note : Internet Explorer, ne sait pas rendre exactement l’image présentée au dessus mais le menu reste parfaitement exploitable.

L’agenda (optionnel)

L’agenda affiche des événements définis par une journée ou une plage de journées (3 semaines maximum), cela sous forme de calendriers mensuels et annuels, avec des possibilités de sélection et de navigation par mois ou années.

Chaque événement est représenté par un article, lui-même attaché à un mot-clé, un secteur, ou une combinaison des deux, d’après un choix d’installation :

sélection par
mot-clé
sélection par
emplacement
Agenda mot oui -
Agenda secteur - oui
Agenda complet oui oui

- l’agenda mot permet la sélection d’événements par mot-clé uniquement, quelle que soit leur rubrique de rattachement.

- l’agenda secteur permet la sélection d’événements situés dans une rubrique du secteur Agenda (un secteur est une rubrique placée à la racine du site, avec des sous-rubriques éventuelles), qu’il y ait ou pas des mot-clés associés aux événements.

- l’agenda complet : combine les 2 précédents en permettant la sélection d’événements par mot-clé pour les articles du secteur Agenda.

Un secteur Agenda est donc nécessaire pour les agendas secteur et complet tandis que un ou plusieurs mot-clés sont nécessaires aux agenda mot et complet ; ils seront à créer lors de la personnalisation du squelette.

Ici l’agenda miniature tel qu’il apparaît en page d’accueil. Les jours à événement contiennent un lien direct vers l’article-événement s’il est unique, ou alors vers la vue mensuelle lorsqu’il y a plusieurs événements.

Ci dessous, la vue mensuelle de l’agenda complet qui permet une navigation de mois en mois et aussi un Menu de sélection (positionné sur "Tout") qui va permettre un choix de mot clé et, tout en bas, les îcônes de sélection de branche (sous-secteur).

PNG - 34.4 ko

Dans la vue annuelle, on retrouve le même principe de navigation qu’en mode mensuel. Cette présentation en liste permet le copier/coller. Les pages peuvent être présentées sous formes d’années scolaires.

PNG - 24.2 ko

Album (optionnel)

Ceci concerne les articles ayant des images (jpg, gif, png) en mode "Document" [2].

L’album propose 2 présentations pouvant cohabiter sur un même article :

- album simple : 1 seule image par page ;
- album à vignettes : chaque page de l’album contient 1 bloc de vignettes et une image.

On peut ajouter à chaque article un (ou plusieurs) mot-clé, ce qui provoque l’insertion, dans l’article public, d’une (ou plusieurs) invite à l’ouverture d’album, chaque mot-clé correspondant à un type d’album différent comme dans cet exemple. Cet album est lui-même extensible comme décrit plus loin.

Le configurateur (optionnel)

Il permet au choix de créer l’Agenda et tous les mot-clés et de gérer le type de menu voulu.

Il ne peut être utilisé que par un administrateur SPIP et peut être appelé à tout moment car il fonctionne sur la base des éléments qu’il détecte, même si dans la pratique il ne sert qu’une seule fois.

Pour ceux qui préfèrent, la configuration peut être faite à la main, via SPIP, comme décrit en Annexe.

Extension du squelette

1) Tout Plugin d’origine externe pourra être inséré.

2) On peut ajouter des fichiers de langues (1 fichier par langue) pour de nouvelles traductions du squelette, automatiquement prises en compte par le multilinguisme Spip.

3) Le squelette lui même peut être enrichi sans avoir à modifier les fichiers existants. Il suffit de déposer un fichier respectant une convention de nommage et de l’activer par la partie privée de Spip au moyen de mots-clés.

Spip permet déjà de créer des variantes d’articles ou de rubriques s’ils sont localisés dans une rubrique ou branche XX particulière (Cf. article=XX.html). Le squelette étend cette notion aux mot-clés, le principe étant d’utiliser un mot-clé pour faire appel à une variante, ç’est à dire une mise en forme particulière. La première application de ce principe est pour le squelette lui-même qui propose des variantes intégrées :

- livre : similaire à la page article ordinaire, sauf qu’il n’y a pas de possibilité de réponse sur un message déposé ; c’est le principe d’un livre d’or

- album2 : similaire à la page article ordinaire, mais les documents joints seront traités sous forme d’album comme expliqué ci-desssus

- petition : pour présenter un article qui comporte une pétition

- par_titre : variante de rubrique qui affiche les articles de la rubrique par ordre alphabétique et non chronologique comme pour la rubrique ordinaire.

Autres fonctions

1) Les pages du squelettes sont valides HTML transitional et imprimables (media print CSS) et disponibles en Français, Anglais et Espagnol (fichiers local_*)

2) Les articles qui auront été marqués avec le mot clé cacher n’apparaîtront pas à la une.

3) Les sites qui auront été marqués avec le mot clé sommaire apparaîtront à la une, en plus de leur page rubrique de rattachement.

4) Autres pages spécifiques à ce squelette :

- tous les articles (avec choix de critères statistiques)
- tous les forums,
- page équipe (liste des auteurs avec leur publications).
- plan de site

5) La pagination s’applique à toutes les pages susceptibles de générer des listes volumineuses (utilisation de la fonction pagination de Spip)


2. Première Installation

Zip - 60.8 ko
Le squelette 3.3.3

Tout d’abord, SPIP (v2.0 minimum) doit avoir été installé sur votre site, de préférence sans squelette particulier (dossier squelettes vide).

- si votre base n’est pas vierge, vérifiez qu’il n’y a pas de conflit de noms avec les éléments présents dans la base de donnée ; au besoin, renommez les. Il s’agit du secteur Agenda et des groupes de mots Agenda, _Agenda, Epona, Album, _Article, _Rubrique

- Placez l’archive décompressée à la racine du site ; Le squelette est alors opérationnel et fonctionne à ce stade sans Agenda ni mot-clés. il y a eu création des éléments suivants :

Nom description
squelettes dossier contenant le squelette
epona_conf.php le configurateur, qui vient dans le dossier ecrire/exec déjà existant

- Vous pouvez appeler le configurateur http://.../ecrire/?exec=epona_conf pour activer les options qui vous conviennent parmi celles proposées.


3. Mise à jour d’une ancienne version Epona

Important : Pensez à sauvegarder les éléments de votre personnalisation (images bandeau ...) car celle ci sera à refaire.

Mise à jour depuis Epona v2

- ôter l’ancien squelette et le dossier epona-sq

- Installez SPIP (v2.0 minimum). Il doit fonctionner avec son squelette "dist", après avoir vidé le cache Spip

- renommez le mot clé Agenda du groupe Agenda avec agenda_secteur ou agenda_complet suivant que vous aviez un agenda "simple" ou "complet".

- Placez l’archive décompressée à la racine du site. Le squelette fonctionne après avoir vidé le cache Spip

- appeler le configurateur http://.../ecrire/?exec=epona_conf pour créer les groupes et mot-clés qui manquent.

- ajouter à tous vos articles d’album le mot-clé album2 du groupe _Articles.

Mise à jour depuis Epona v3.0 / v3.1.x

- ôter l’ancien squelette en supprimant le dossier squelettes/epona et supprimez le fichier ecrire/mes_options.php3 ou tout au moins la ligne $GLOBALS[ 'dossier_squelettes' ] = "squelettes/epona" ;

- Installez SPIP (v2.0 minimum). Il doit fonctionner avec son squelette "dist", après avoir vidé le cache Spip

- Placez l’archive décompressée à la racine du site. Le squelette fonctionne après avoir vidé le cache Spip

- si vous utilisiez l’album Epona v3.0, ajouter à tous vos articles d’album le mot-clé album2 du groupe _Articles.

Mise à jour depuis Epona v3.2.x ou v3.3.x

- ôter l’ancien squelette en supprimant le dossier squelettes

- Installez SPIP (v2.0 minimum), Il doit fonctionner avec son squelette "dist", après avoir vidé le cache Spip

- Placez l’archive décompressée à la racine du site. Le squelette fonctionne après avoir vidé le cache Spip.


4. Personnalisation

Rien de ce qui suit n’est obligatoire si ce n’est l’adaptation du Logo. D’une manière générale, les fichiers du squelette sont commentés pour vous aider à aller plus loin.

Le Logo

Fichier pour personnaliser
inc-logo.html Adapter éventuellement
logo.jpg Remplacer l’image
inc-bandeau.html Adapter éventuellement
gauche.jpg Remplacer l’image
droit.jpg Remplacer l’image

inc-logo.html contient l’image en haut à gauche et le nom du site. Veuiller à ne pas dépasser la largeur d’origine (165px), faute de quoi il faudrait retoucher les CSS.

inc-bandeau.html est le logo horizontal ; respecter la hauteur (147 pixels max). On peut se contenter d’une seule image centrale si elle est assez large. On peut supprimer le bandeau de la page d’accueil en modifiant sommaire.html par suppression de la ligne qui contient inc-bandeau, et changer id="second" en id="principal". Inversement on peut ajouter le bandeau sur les autres pages par une opération symétrique.

Styles et textes

Si vous souhaitez d’autres formes et couleurs (celles d’origine sont #FFFFE0 pour le fond jaune clair et #CC4F4F pour le menu en bordeaux), vous pourrez modifier les feuilles de styles communes habillage.css, agenda.css et spip_formulaires.css qui sont clairement commentées. Les styles spécifiques (plan, album, pétition...) sont directement insérés dans leurs propres fichiers html. Epona utilise également le fichier standard prive/spip_style.css dont les définitions peuvent être changées : en préalable il faudra soit copier les styles voulus dans habillage.css soit copier le fichier spip_styles.css dans le dossier squelettes.

Les libellés du squelette sont rassemblés dans des fichiers de langue (local_fr.php pour le Français) et sont référencés dans les pages du squelette par les balises de langues, telle que <:credit:>. Spip saura quel fichier utiliser suivant le contexte.

Agenda

Si vous avez opté pour l’agenda complet ou l’agenda mot, vous devez créer dans le groupe _Agenda (ne pas confondre avec Agenda également utilisé) les mots clés qui correspondent à vos besoins de sélection : ils apparaitront directement dans le menu de sélection. Ainsi, sur un site hippique, ce menu proposerait ’Tout’, ’Poney’ et ’Cheval’. Ces deux derniers choix étant les mot-clés du groupe _Agenda.

Pour disposer d’un agenda scolaire (présentation annuelle à cheval sur 2 années) il suffira de commenter et décommenter quelques lignes répérées dans agen_an_php.html à chaque indication ’variante scolaire’.

Le menu de navigation

Le menu initialement installé est automatique ; il présente les rubriques par ordre alphabétique, tant qu’elles ne sont pas vides d’articles. C’est un fichier Spip classique nommé inc-menu.html que vous pourrez adapter avec d’autres boucles, critères et filtres.

Le configurateur vous permet :

- d’obtenir un menu identique au menu automatique inc-menu.html mais en pur HTML ; il s’agit d’un menu statique mais facile à modifier puisqu’il s’agit de balises ul / li présentées avec l’indentation qu’il faut. C’est indispensable pour ceux qui, comme moi, ne souhaitent pas un menu plaqué exclusivement sur les rubriques. Le prix à payer est que inc-menu.html sera ensuite à maintenir à la main (on peut facilement oublier d’y faire figurer une rubrique qu’on aura créé après coup).

- de revenir à tout instant au menu automatique de base (simple copie de inc-menu_def.html dans inc-menu.html).

Extension de squelette

- Pour ajouter une variante d’article, placez la nouvelle page article-XYZ.html dans le dossier squelettes et ajoutez le mot-clé XYZ dans le groupe de mot-clé _Article.

- Pour ajouter une variante de rubrique, placez votre nouvelle page rubrique-XYZ.html dans le dossier squelettes et ajoutez le mot-clé XYZ dans le groupe de mot-clé _Rubrique.

- Pour ajouter au squelette une nouvelle page de présentation XYZ.html de type album2, il faut juste la placer dans le dossier squelettes et ajouter le mot-clé XYZ dans le groupe de mot-clé Album.

- Pour ajouter un fichier de langue, il suffit de s’inspirer de ceux qui existent, par exemple local_fr.php3 ou local_en.php3.


5. Pour les rédacteurs

Ce qui suit s’applique aux options Epona installées.

Utilisation de l’agenda

Vous devez au minimum avoir saisi un article (avec le bouton valider) pour qu’il soit connu de SPIP, en veillant à :

- le placer dans le secteur réservé à l’Agenda si vous avez un agenda secteur ou un agenda complet
- indiquer "N jours" quelque part dans le sous-titre de l’article si l’événement s’étale sur N jours consécutifs.

Effectuer ensuite ces actions, sans ordre particulier :

- renseigner la "date antérieure" de l’article avec la date de l’événement (déplier le menu, cocher Afficher puis renseigner J-M-A) [3]

- pour l’agenda mot ou l’agenda complet : donner à l’article un ou plusieurs des mot-clés du groupe "_Agenda" ; ceux ci ont été créés par le Webmestre lors de la personnalisation.

Si votre article ne s’affiche pas dans l’agenda après publication et recalcul de page, vérifiez bien tous les points ci-dessus.

Utilisation des variantes

Pour utiliser une variante existante, sélectionnez le mot-clé correspondant. Ceux qui existent déjà sont : livre, petition, et album2 dans le groupe _Article et par_titre dans le groupe _Rubrique.

Pour la variante album2 il faut choisir la présentation par un ou deux des mots-clés du groupe Album : album_simple ou vignettes_images, ce dernier choix n’ayant un sens que pour les documents à vignette.

La variante petition doit être utilisée conjointement avec le menu SPIP "activer la pétition" de gestion de votre article.

Autres mot-clé (groupe mot Epona)

Utilisez le mot-clé cacher pour exclure un article de la page d’accueil.

Utilisez le mot-clé sommaire, pour afficher un site en page d’accueil.


6. Références

Mes sources d’inspiration :

- Les squelettes de la distribution SPIP,
- SPIP-Contrib ("Agenda" , "Menu", "Album").

j’en remercie bien sincèrement leurs auteurs, ainsi que Jacques PYRAT qui m’a aidé à rendre générique l’installation de l’agenda.

Un merci aussi à tous ceux qui m’ont écrit et aidé par leur commentaires à améliorer le squelette, à ceux de la liste et en particulier : Juan (traduction Espagnol) et Roland (media-print)

Autres liens

- la FAQ
- des sites avec Epona
- toutes les versions du squelette (les futures y seront)
- guide d’installation en local
- et moi


Annexe

Ceci s’adresse aux Webmestres qui ne veulent pas utiliser le configurateur pour activer les options. Il faudra d’abord autoriser l’utilisation des mot-clés dans la configuration SPIP.

Groupes et mot-clés à créer

- groupe Album : album_simple, vignettes_image (lier à des articles)
- groupe Epona : cacher, sommaire (lier à des articles et sites)
- groupe _Article : livre, petition, album2, (lier à des articles)
- groupe _Rubrique : par_titre (lier à des rubriques)

Agenda

Pour créer l’un des 3 agendas il faudra au préalable :

- autoriser la publication des dates antérieures
- autoriser la configuration précise des mots clés
- créer un groupe de mots Agenda pour rubrique

Agenda secteur

- ajouter le mot-clé agenda_secteur dans groupe de mots Agenda
- créez un secteur Agenda à lier au mot-clé agenda_secteur

Agenda mot

- ajouter le mot-clé agenda_mot dans groupe de mots Agenda
- créer le groupe de mots _Agenda
- ajouter vos mot-clés de personnalisation dans le groupe _Agenda

Agenda complet

- ajouter le mot-clé agenda_complet dans groupe de mots Agenda
- créez un secteur Agenda à lier au mot-clé agenda_complet
- ajouter vos mot-clés de personnalisation dans le groupe _Agenda

[1] Le petit script qui accompagne le menu n’est qu’une béquille pour aider Internet Explorer à comprendre le CSS, les autres navigateurs n’en ont pas besoin.

[2] SPIP permet de saisir des images en mode "Document" (avec ou sans vignettes) ou en mode "Image" (pas de vignettes)

[3] Le fait d’utiliser la date antérieure pour un événement futur est un détournement d’usage a priori sans conséquence et de toute manière limité aux articles de l’ Agenda ; de même pour le champ Sous-titre


Répondre à cet article