// 2007/08/04 01:33 / 86.220.199.82

Permettre d'ajouter à la demande une Table des matières automatique.

Utilisation


La table des matière (toc pour Table Of Content) rassemble dans une boite et de manière hiérarchisée, l'ensemble des titres de votre page.
Pour inclure une toc dans une page, il vous suffit d'ajouter le terme TOC n'importe ou dans celle-ci. Je conseille quand même :
Pour gérer le positionnement et le style de la boite, voir les fichiers template et style.

Modifications


Voici les modifications à apporter à une version 2.21 :

index.php


création des ancres


ligne 230 remplacer :
$CONTENT = preg_replace('/^!!!(.*)(\n)/Um', '<h1>$1</h1>$2', $CONTENT);
$CONTENT = preg_replace('/^!!(.*)(\n)/Um', '<h2>$1</h2>$2', $CONTENT);
$CONTENT = preg_replace('/^!(.*)(\n)/Um', '<h3>$1</h3>$2', $CONTENT);

par
$CONTENT = preg_replace('/^!!!(.*)$/Um', '<a name="$1"><h1>$1</h1></a>', $CONTENT);
$CONTENT = preg_replace('/^!!(.*)$/Um', '<a name="$1"><h2>$1</h2></a>', $CONTENT);
$CONTENT = preg_replace('/^!(.*)$/Um', '<a name="$1"><h3>$1</h3></a>', $CONTENT);

calcul de la toc


ligne 257 avant
$CONTENT = substr($CONTENT, 6, strlen($CONTENT) - 6);

ajouter :
// TOC
if (strpos($CONTENT,"TOC"))
{
   $CONTENT = preg_replace("/TOC/Um","",$CONTENT,1);
   $nbAncres = preg_match_all('/<a name="(.+)">(.+)<\/a>/Ums',$CONTENT,$matches_ancres);
   //~ print "<pre>".htmlentities(var_dump($matches_ancres,TRUE))."</pre>"; //DBG
   $toc = "<div id=toc>";
   for ($i=0;$i<$nbAncres;$i++) $toc .= '<a href="#'.$matches_ancres[1][$i].'">'.$matches_ancres[2][$i].'</a> ';
   $toc .= "</div>";
}
else
   $toc = "";

remplacement dans le template


ligne 270 après
$html = preg_replace('/{ IP }/', $_SERVER['REMOTE_ADDR'], $html);

ajouter (sans les espaces)
$html = str_replace('{ TOC }', $toc, $html);


template.html


Balise


ligne 27 après :
<td id="mainContent" colspan="3">

ajouter (sans les espaces) :
{ TOC }


style.css, ajouter :


/* Table Of Content */
#toc {
	 border: 1px dashed #11141A;
	 float:right;
	 padding-right: 2em;
}
#toc h1 {
	 font-size: 10px;
	 padding-left: .5em;
}
#toc h2 {
	 font-size: 9px;
	 padding-left: 1.5em;
}
#toc h3 {
	 font-size: 8px;
	 padding-left: 2em;
}


Demo


Voir la page actuelle :) et TestToc

Todo


<a name="Titre"><h1>Titre</h1></a>