Le blog du pangolin

Accueil > SPIP > Squelettes - Lister les rubriques et leurs articles

Squelettes - Lister les rubriques et leurs articles

mercredi 27 juillet 2011, par Super Pangolin

Nous allons créer une boucle qui permet de lister nos rubriques et voir ce que l’on peut en faire.

Pour rappel : une boucle se code ainsi :

<BOUCLEnomboucle (type de boucle){option1}{option2}>
     Affichage
</BOUCLEnomboucle>

Ainsi, pour faire une boucle avec les rubriques, on fait :

<BOUCLErubriques(RUBRIQUES)>

</BOUCLErubriques>

Pour afficher un tableau contenant des informations sur les rubriques, on codera :

<table border="1">
    <BOUCLE_rubriques(RUBRIQUES)>
         <tr>
              <td>
                   #ID_RUBRIQUE
              </td>
              <td>
                   #TITRE
              </td>
         </tr>
    </BOUCLE_rubriques>
</table>

Enregistrons ce texte dans un fichier tableauRubriques.html dans le répertoire « squelettes » à la racine de spip. Nous pouvons y accéder grâce à l’url

http://monsite/spip.php?page=tableauRubriques

Nous pouvons faire la même chose pour n’avoir que les rubriques à la racine :

<table border="1">
   <BOUCLE_rubriquesRacine(RUBRIQUES){racine}>
        <tr>
             <td>
                  #ID_RUBRIQUE
             </td>
             <td>
                  #TITRE
             </td>
        </tr>
   </BOUCLE_rubriquesRacine>
</table>

C’est un peu facile tout ça. Passons à une boucle récursive.
Autre rappel : comment faire une boucle récursive :

<BOUCLEnomboucle (type de boucle){option1}{option2}>
     Affichage
     <BOUCLEnomSousBoucle (BOUCLEnomboucle )/>
</BOUCLEnomboucle>

On appelle donc une nouvelle boucle mais au lien de passer un type de données en paramètre, on redonne le nom de notre boucle principale. Petite précision : pour accéder à une variable de la boucle principale, on appelle

#BOUCLEnomboucle:variable (ex : #BOUCLErubriquesRacine:TITRE)

Nous allons donc parcourir les rubriques en récursif et créer une liste :

<ul>
 <li>#NOM_SITE_SPIP</li>
 <ul>
   <BOUCLE_rubriquesParentUL(RUBRIQUES){racine}>
   <!-- Liste des sous rubriques -->
     <li>
            #ID_RUBRIQUE - #TITRE
     </li>
       <ul>
         <BOUCLE_sousRubriquesParentUL(RUBRIQUES){id_parent}>
           <li>
             #ID_RUBRIQUE - #TITRE (parent : #ID_PARENT)
           </li>
           <B_sousrubriquesul>
           <ul>
           <BOUCLE_sousrubriquesul(BOUCLEsousRubriquesParentUL) />
           </ul>
           </B_sousrubriquesul>
         </BOUCLE_sousRubriquesParentUL>
       </ul>
   </BOUCLE_rubriquesParentUL>
 </ul>
</ul>

Petit rappel encore : ici,

<B_sousrubriquesul>

permet de n’afficher la balise UL que s’il y a des éléments dans la boucle <BOUCLE_sousrubriquesul>

Nous pouvons maintenant afficher les articles de chaque rubrique :

<ul>
 <li>#NOM_SITE_SPIP</li>
 <ul>
   <BOUCLE_rubriquesParentUL(RUBRIQUES){racine}>
   <!-- Liste des sous rubriques -->
     <li id="RubriqueBase#ID_RUBRIQUE">
            #ID_RUBRIQUE - #TITRE
     </li>
       <ul>
         <B_articles>
         <BOUCLE_articles(ARTICLES){id_rubrique=#ID_RUBRIQUE}>
           <li id="ArticleBase#ID_ARTICLE"><font color='blue'>#TITRE</font></li>
         </BOUCLE_articles>
         </B_articles>
         <BOUCLE_sousRubriquesParentUL(RUBRIQUES){id_parent}>
           <li>
             #ID_RUBRIQUE - #TITRE (parent : #ID_PARENT)
           </li>
           <B_articles_sous_rub>
           <ul>
             <BOUCLE_articles_sous_rub(ARTICLES){id_rubrique=#ID_RUBRIQUE}>
               <li id="Article#ID_ARTICLE"><font color='blue'>#TITRE (Rubrique #ID_RUBRIQUE)</font></li>
             </BOUCLE_articles_sous_rub>
           </ul>
         </B_articles_sous_rub>
           <B_sousrubriquesul2>
           <ul>
           <BOUCLE_sousrubriquesul2(BOUCLE_sousRubriquesParentUL) />
           </ul>
           </B_sousrubriquesul2>
         </BOUCLE_sousRubriquesParentUL>
       </ul>
   </BOUCLE_rubriquesParentUL>
 </ul>
</ul>

Ajoutons les liens vers les articles / rubriques :

<ul>
 <li><a href="#URL_SITE_SPIP">#NOM_SITE_SPIP</a></li>
 <ul>
   <BOUCLE_rubriquesParentUL(RUBRIQUES){racine}>
   <!-- Liste des sous rubriques -->
     <li id="RubriqueBase#ID_RUBRIQUE">
            <a href="#URL_RUBRIQUE">#ID_RUBRIQUE - #TITRE</a>
     </li>
       <ul>
         <B_articles>
         <BOUCLE_articles(ARTICLES){id_rubrique=#ID_RUBRIQUE}>
           <li id="ArticleBase#ID_ARTICLE">
             <font color='blue'><a href="#URL_ARTICLE">#TITRE</a></font>
           </li>
         </BOUCLE_articles>
         </B_articles>
         <BOUCLE_sousRubriquesParentUL(RUBRIQUES){id_parent}>
           <li>
             <a href="#URL_RUBRIQUE">#ID_RUBRIQUE - #TITRE (parent : #ID_PARENT)</a>
           </li>
           <B_articles_sous_rub>
           <ul>
             <BOUCLE_articles_sous_rub(ARTICLES){id_rubrique=#ID_RUBRIQUE}>
               <li id="Article#ID_ARTICLE">
                 <a href="#URL_ARTICLE"><font color='blue'>#TITRE (Rubrique #ID_RUBRIQUE)</font></a>
               </li>
             </BOUCLE_articles_sous_rub>
           </ul>
         </B_articles_sous_rub>
           <B_sousrubriquesul2>
           <ul>
           <BOUCLE_sousrubriquesul2(BOUCLE_sousRubriquesParentUL) />
           </ul>
           </B_sousrubriquesul2>
         </BOUCLE_sousRubriquesParentUL>
       </ul>
   </BOUCLE_rubriquesParentUL>
 </ul>
</ul>

Et voila !! Il ne vous reste plus qu’à appliquer le css qui vous correspond !!
Pour avoir un aperçu de ce que l’on peut faire avec cette boucle, vous pouvez cliquer sur ce lien.

Un message, un commentaire ?

Qui êtes-vous ?
Votre message

Pour créer des paragraphes, laissez simplement des lignes vides.