PRTICE.INFO

Accueil > Sites web sous SPIP > Guides pour l’administrateur > Personnalisation de l’apparence en modifiant le squelette

Personnalisation de l’apparence en modifiant le squelette

mercredi 7 avril 2010

Il faut savoir que modifier les modèles de pages du squelette nécessite souvent de réitérer l’opération à chaque mise à jour de ce squelette.

Pour limiter les risques de perte des modifications lors de la mise à jour du squelette ScolaSpip, il faut créer un dossier "squelettes" à la racine du site. Ce dossier "squelettes" doit se trouver dans le même répertoire que "ecrire", "IMG", "plugins"... En plaçant les fichiers dans ce dossier, ils auront priorité sur les autres éléments du squelette puisque ce dossier est lu en dernier par le moteur de SPIP.

Je vous propose dans la suite de cet article quelques modifications mineures (le but n’étant pas de réécrire le squelette) qui agrémentent l’apparence globale du site. Vous pouvez voir le résultat de ces modifications sur le site de mon établissement scolaire.

- Transformer les rubriques en rubriques non cliquables, dans le menu
Si une rubrique contient plusieurs rubriques, celle-ci possède un "+" devant elle. Si vous cliquez sur le nom de la rubrique, cela déroule le menu ET ouvre la rubrique correspondante. La modification que je vous propose ne fera QUE dérouler le menu.

  • téléchargez et ouvrez avec un éditeur de texte comme Notepad++, le fichier "inc-rubriques.html", situé dans le dossier "scolaspip"
  • aux lignes 19 et 20 (environ) du fichier, localisez le texte suivant :
    <span  ........ /> </span>
    <a href="#URL_RUBRIQUE" [.......</a>
  • déplacez la balise "span" après la balise "a"
  • supprimez le texte "href=’#URL_RUBRIQUE’" :
    <span  ........ />
    <a [ .......</a>
    </span>
  • enregistrez votre fichier et envoyez-le dans le dossier "squelettes"

- Afficher une icône devant le nom des rubriques, dans le menu
Si une rubrique possède un logo (défini dans l’espace privé), celui-ci s’affiche devant le nom de la rubrique. Pour une apparence agréable, il faut définir un logo pour chaque rubrique.

  • téléchargez et ouvrez avec un éditeur de texte comme Notepad++, le fichier "inc-rubriques.html", situé dans le dossier "scolaspip".
  • aux lignes 20 et 25 (environ) du fichier, localisez le texte suivant :
    [(#TITRE|supprimer_numero|couper{50})]
  • Devant ce texte, ajoutez les informations suivantes aux lignes 20 et 25 (environ) :
    [(#LOGO_RUBRIQUE|left||image_reduire{80,20})]
  • enregistrez votre fichier et envoyez-le dans le dossier "squelettes"

- Afficher un logo en face des derniers articles affichés sur la page d’accueil
Pour égayer la page d’accueil, je vous propose d’ajouter en face du titre des articles, un logo (icône) qui correspondra, soit au logo de l’article (s’il est défini), sinon au logo de la rubrique.

  • téléchargez et ouvrez avec un éditeur de texte comme Notepad++, le fichier "articles.html", situé dans le dossier "scolaspip"
  • à la ligne 7 (environ), localisez le texte suivant :
    [(#LOGO_ARTICLE|right||image_reduire{80,40})]
  • ajoutez "_RUBRIQUE" et modifiez si vous le souhaitez la taille du logo (ici 32 pixels) pour obtenir ceci :
    [(#LOGO_ARTICLE_RUBRIQUE|right||image_reduire{80,32})]
  • enregistrez votre fichier et envoyez-le dans le dossier "squelettes"

- Afficher directement le seul article d’une rubrique
Seules les rubriques et sous-rubriques s’affichent dans le menu de navigation du site. Si les rubriques ne contiennent qu’un seul article, il est absurde d’avoir à faire deux clics pour accéder à cet unique article. Il est possible d’automatiser l’affichage de cet article lorsqu’on clique sur une rubrique qui n’en contient qu’un seul.

  • téléchargez et ouvrez avec un éditeur de texte comme Notepad++, le fichier "rubrique.html", situé dans le dossier "scolaspip"
  • ajoutez en tête de ce fichier les lignes suivantes :
    <BOUCLE_rubrique_principale(RUBRIQUES) {id_rubrique}><BOUCLE_nb_article(ARTICLES){id_rubrique}><?php $k="#URL_ARTICLE"; ?></BOUCLE_nb_article><?php if ('#TOTAL_BOUCLE'==1) header("location:$k");?></B_nb_article>
    </BOUCLE_rubrique_principale>
  • enregistrez votre fichier et envoyez-le dans le dossier "squelettes"

| Plan du site | Mentions légales | Suivre la vie du site RSS 2.0 | Haut de page | SPIP | ScolaSPIP
PRTICE.Info (PRTICE.info)
Directeur de publication : Julien Delmas