Voici un exemple de squelette sommaire.html simplissime qui va afficher une liste des cinq derniers articles publiés sur le site que nous allons monter pas à pas et commenter, dans l'optique où l'intégrateur part de zéro en lançant son éditeur de code.
La gestion du cache
#CACHE{7200}
On déclare grâce à la balise SPIP #CACHE la durée en seconde durant laquelle le visiteur recevra dans son navigateur la page générée disponible dans le cache propre à SPIP au lieu de la page recalculée. C'est important pour les perfomances de votre hébergement, l'intégrateur aura intérêt à augmenter significativement cette valeur s'il produit un article tous les mois.
Les entêtes http
#HTTP_HEADER{Content-Type: text/css}
La balise SPIP #HTTP_HEADER permet de les préciser. Cela peut être utilisé sur un serveur mal configuré n'envoyant pas le bon type MIME par exemple.
Le DOCTYPE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Là c'est vous qui choisissez. Relisez avec intérêt l'article d'Alsacréations pour bien choisir (Les DTD HTML4.01 et XHTML1.0 : comment choisir ?). Notez toutefois que le code généré par SPIP respecte les règles syntaxique propres à xhtml, donc le choix est limité.
Les attributs de html
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="#LANG" lang="#LANG">
La langue de traitement du contenu de votre document html est précisée dans les attributs lang et xml:lang de l'élément html. L'administrateur du site a dû préciser la langue principale du site dans l'interface privé. La balise SPIP correspondante est #LANG.
Soigner le head du document
Quelques balises SPIP obligatoires et utiles pour le head de votre document.
<meta http-equiv="Content-Type" content="text/htm; charset=#CHARSET" />
L'encodage des caractères utilisé par votre site est défini dans l'espace privé et correspond à la balise #CHARSET.
Le titre du document
<title>#NOM_SITE_SPIP</title>
Dans le cas d'une page d'accueil on peut indiquer le titre du site grâce à #NOM_SITE_SPIP
Le lien vers une feuille de style
<link rel="stylesheet" type="text/css" href="#CHEMIN{mafeuille.css}" />
Un jeu de squelettes SPIP est placé dans un dossier situé à la racine du site. Si le dossier est nommé "squelettes" (au pluriel) il est automatiquement reconnu et utilisé par le moteur pour afficher les pages. Pour toujours retrouver des fichiers situés dans ce dossier comme une feuille de style, des éléments graphiques etc. l'intégrateur dispose de la balise #CHEMIN qui permet en cas de renommage du dossier "squelettes" de toujours fonctionner.
Des balises hors boucle
<h1>#NOM_SITE_SPIP</h1>
<p>#DESCRIPTIF_SITE_SPIP</p>
Les éléments de la base de données que l'on souhaite afficher dans une page doivent en général être sélectionnés via une boucle SPIP (voir ci-dessous). Cependant des balises SPIP sont utilisables directement dans des squelettes. C'est le cas de #NOM_SITE_SPIP qui correspond au nom du site et #DESCRIPTIF_SITE_SPIP pour la description de votre site.
Consulter Les balises propres au site.
Des boucles dans le body
<ul>
<BOUCLE_mesarticles(ARTICLES){!par date}{0, 5}>
<li><a href="#URL_ARTICLE">#TITRE</a></li>
</BOUCLE_mesarticles>
</ul>
La boucle précédente affiche sous forme de liste les titres des 5 derniers articles publiés avec un lien vers l'article.
Une boucle commence par être ouverte par <BOUCLE_nomdelaboucle etc.> et doit impérativement être fermée de la même manière qu'une balise html par </BOUCLE_nomdelaboucle>
La BOUCLE ouvrante permet de lui donner un nom (unique dans un squelettes), de choisir le TYPE d'objet éditorial (ici ARTICLES, en majuscules et au pluriel et placé entre parenthèses) et de trier et sélectionner les éléments à afficher grâce à des critères, notés entre accolades. Dans l'exemple {!par date} trie par date inverse (du plus récent au plus ancien), {0, 5} est un critère sélectionant cinq éléments.
Pour afficher le titre de l'article, on insère entre les balises <li> la balise SPIP #TITRE qui renvoie le titre de l'article (notez que cette balise est commune à plusieurs types d'objets éditoriaux, la valeur renvoyé dépend du contexte de la boucle.
Pour créer un lien vers l'article, on renseigne l'attribut href du lien par la balise SPIP #URL_ARTICLE.
Le squelette reconstitué :
#CACHE{7200}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="#LANG" lang="#LANG">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=#CHARSET" />
<meta http-equiv="Content-Language" content="#LANG" />
<title>
#NOM_SITE_SPIP
</title>
<link rel="stylesheet" type="text/css" href="#CHEMIN{mafeuille.css}" />
</head>
<body>
<!--balises propres au site-->
<h1>#NOM_SITE_SPIP</h1>
<p>#DESCRIPTIF_SITE_SPIP</p>
<ul>
<!--Boucle affichant les 5 derniers articles publiés-->
<BOUCLE_mesarticles(ARTICLES){!par date}{0, 5}>
<!--Balise affichant le titre des articles dans le contexte de la boucle-->
<li><a href="#URL_ARTICLE">#TITRE</a></li>
</BOUCLE_mesarticles>
</ul>
</body>
</html>