Syllene - Wiki

Cette page est en lecture seule. Vous pouvez afficher le texte source, mais ne pourrez pas le modifier. Contactez votre administrateur si vous pensez qu'il s'agit d'une erreur.
====== Les boucles de spip ======



===== html et boucles SPIP =====

<code html>
<BOUCLE_article_principal(ARTICLES){id_article}>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
 
  <head>
    <title>#TITRE - #NOM_SITE_SPIP</title>
	<meta name="description" content="#DESCRIPTION" />

    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<link rel="stylesheet" type="text/css" media="all" href="#CHEMIN{etud8/style.css}" />
  </head>
 
  <body>
	<!-- mon commentaire -->
	<div id="bandeau">
		[(#LOGO_SITE_SPIP|left|#URL_SITE_SPIP)]
	</div>
	<div id="filariane">
		<p>
		<BOUCLE_filariane(HIERARCHIE){id_article}{">>"}>
			#TITRE
		</BOUCLE_filariane>
		</p>
	</div>
	<div id="navigation">
		<B_navigation>
		<ul>
			<BOUCLE_navigation(RUBRIQUES){racine}>
				<li><a href="#URL_RUBRIQUE">#TITRE</a></li>
			</BOUCLE_navigation>
		</ul>
		</B_navigation>
			<p>Ceci s'affiche si la boucle ne renvoie rien</p>
		<//B_navigation>
	</div>
	<div id="corps">
		<h1>[(#TITRE|replace{super,zut})]</h1>
		#LESAUTEURS - [(#DATE|affdate{saison})]
		[Ce s'affiche avant (#TEXTE|image_reduire{500,0}) Ceci s'affiche après]
	</div>
	<div id="actualites">
		
	</div>
	<div id="pied">
		<p>
			<a href="http://www.spip.net">www.spip.net</a>
		</p>
	</div>
  </body>
</html>
</BOUCLE_article_principal>
</code>


===== Fichier CSS associé : mise en forme en 3 colonnes =====

<code css>
body {
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	margin-bottom: 20px;
	font-family: sans-serif;
	background-color: grey;
	width: 1004px;
}

#bandeau {
	height: 120px;
	margin: 5px;
	background-color: fuchsia;
}

#filariane {
	height: 20px;
	background-color: green;
}

#navigation {
	width: 250px;
	padding: 5px;
	background-color: silver;
	float: left;
}

#corps {
	width: 500px;
	padding: 10px;
	margin: 0 10px;
	background-color: red;
	float: left;
}

#actualites {
	width: 194px;
	padding:5px;
	background-color: yellow;
	float: right;
}

#pied {
	height: 20px;
	background-color: maroon;
	clear: both;
}

</code>




===== Exercices corrigés =====

<code html>
1. Ecrire une boucle qui affiche une liste de rubriques à la racine
 classées par ordre alphabétique de titre avec lien vers la page de la rubrique
 et qui affiche "Je n'ai rien trouvé" s'il n'y en a pas.

<B_1>
<ul>
	<BOUCLE_1(RUBRIQUES){racine}{par titre}>
	<li><a href="#URL_RUBRIQUE">#TITRE</a></li>
	</BOUCLE_1>
</ul>
</B_1>
<p>Je n'ai rien trouvé</p>
<//B_1>
 
 
2. Dans la même boucle, afficher pour chaque rubrique la liste des articles 
qu'elle contient, classés par date du plus récent au plus ancien,
avec un lien vers la page de l'article, sa date de création et 
ses auteurs.

<B_1>
<ul>
	<BOUCLE_1(RUBRIQUES){racine}{par titre}>
	<li><a href="#URl_RUBRIQUE">#TITRE</a>
	<B_2>
	<ul>
		<BOUCLE_2(ARTICLES){par date}{inverse}{id_rubrique}>
		<li><a href="#URL_ARTICLE">#TITRE</a> rédigé le #DATE_REDAC par #LESAUTEURS</li>
		</BOUCLE_2>
	</ul>
	</B_2>
	</li>
	</BOUCLE_1>
</ul>
</B_1>
<p>Je n'ai rien trouvé</p>
<//B_1>
3. Compléter le code suivant pour qu'il affiche "asca" si le titre
contient le mot labo et qui affiche "sourir" sinon.

[(#TITRE|match{labo}|?{asca,sourir})]
</code>
Syllene - Wiki

Outils pour utilisateurs

Outils du site

Outils de la page
