Le Pic
Projet Internet et Citoyenneté

Accueil > LES OUTILS > SPIP, la doc du CMS > Des mises en pages personnalisées >

Fiche n° 7 - Habiller son site avec les modèles PDF

par manu

Comment permettre aux rédacteurs d’insérer des petites icônes à l’intérieur du texte afin d’habiller celui-ci ?


Objectif : Utiliser les modèles pour habiller son site

Créer ou utiliser des icônes d’habillage

Si vous n’êtes pas vous-même un artiste, allez voir sur http://www.openclipart.org: vous trouverez une grande série d’icônes libres de droits pouvant être utilisées à votre convenance.

Pour cet exemple, nous utiliserons le signe "warning " que vous pouvez télécharger ici : http://www.openclipart.org/image/300px/svg_to_png/104263/Warning.png

Mettre en place les fichiers et les répertoires

Créez un sous-répertoire appelé img dans votre répertoire squelettes.
Téléchargez le fichier et mettez-le dans ce répertoire. Appelez-le warning.png (il est préférable de mettre les noms de fichiers en minuscules).

Créez aussi un sous-répertoire appelé modeles.

Enfin, créez et téléchargez dans modeles un fichier appelé warning.html et contenant :

<img src="#CHEMIN{/img/w100.png}" width="#ENV{taille}" height="#ENV{taille}" alt="ATTENTION !" />

Vous devez donc avoir l’arborescence suivante dans votre squelette :

squelettes
squelettes/img
squelettes/img/warning.png
squelettes/modeles
squelettes/modeles/warning.html

Utiliser le modèle dans votre squelette

Le code suivant affichera le signe warning en 60x60 pixels :

[(#MODELE{warning,taille=60})]

Utiliser le modèle dans les articles

Mais le principal intérêt du modèle est qu’il peut être utilisé directement par les rédacteurs du site. Pour cela il suffit qu’ils insèrent dans leur article le texte :

<warning|taille=40>

(où la taille est à la discrétion du rédacteur, bien entendu).
Attention : N’oubliez pas de prévenir les rédacteurs de l’existence de votre modèle, et pensez à faire des modèles simples à utiliser. Par exemple dans le cas présent on a préféré utiliser un paramètre taille unique pour la largeur et la hauteur : il est ainsi plus simple à utiliser, et aussi plus sûr puisqu’on est assuré que le logo sera toujours carré !