Ceci est une ancienne révision du document !
Table des matières
Numérotation des titres par CSS uniquement (remplace numberedheadings)
Voici l'approche CSS pure pour la numérotation des titres.
Le code CSS qui suit numérote tous les titres du wiki, ainsi que ceux de la table des matières.
Placez-le dans l'un des CSS du répertoire user de votre thème (ainsi qu'à nouveau dans le print.css pour avoir la numérotation lors de l'impression)
Pour le modèle default :
- /lib/tpl/default/user/screen.css
.dokuwiki .page {counter-reset: level1;} .dokuwiki #dw__toc:before, .dokuwiki #dw__toc:after {counter-reset: level1; content: "";} .dokuwiki #dw__toc h3:before{content: ""} .dokuwiki .page h1, .dokuwiki ul.toc li.level1 {counter-reset: level2;} .dokuwiki .page h2, .dokuwiki ul.toc li.level2 {counter-reset: level3;} .dokuwiki .page h3, .dokuwiki ul.toc li.level3 {counter-reset: level4;} .dokuwiki .page h4, .dokuwiki ul.toc li.level4 {counter-reset: level5;} .dokuwiki .page h5, .dokuwiki ul.toc li.level5 {} .dokuwiki .page h1:before, .dokuwiki ul.toc li.level1 a:before { content: counter(level1) " "; counter-increment: level1; } .dokuwiki .page h2:before, .dokuwiki ul.toc li.level2 a:before { content: counter(level1) "." counter(level2) " "; counter-increment: level2; } .dokuwiki .page h3:before, .dokuwiki ul.toc li.level3 a:before { content: counter(level1) "." counter(level2) "." counter(level3) " "; counter-increment: level3; } .dokuwiki .page h4:before, .dokuwiki ul.toc li.level4 a:before { content: counter(level1) "." counter(level2) "." counter(level3) "." counter(level4) " "; counter-increment: level4; } .dokuwiki .page h5:before, .dokuwiki ul.toc li.level5 a:before { content: counter(level1) "." counter(level2) "." counter(level3) "." counter(level4) "." counter(level5) " "; counter-increment: level5; }
Pour les autres thèmes, il faut remplacer chaque occurrence de .page par la “boîte entourant le contenu” du thème (“#content” ou similaire).
Par exemple pour le thème vector :
- lib/tpl/vector/user/screen.css
/* Automatically numbering Headings via CSS https://philarcher.org/diary/2013/headingnumbers/ */ body {counter-reset: h2} h2 {counter-reset: h3} h3 {counter-reset: h4} h4 {counter-reset: h5} h5 {counter-reset: h6} h2:before {counter-increment: h2; content: counter(h2) ". "} h3:before {counter-increment: h3; content: counter(h2) "." counter(h3) ". "} h4:before {counter-increment: h4; content: counter(h2) "." counter(h3) "." counter(h4) ". "} h5:before {counter-increment: h5; content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) ". "} h6:before {counter-increment: h6; content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "." counter(h6) ". "} h2.nocount:before, h3.nocount:before, h4.nocount:before, h5.nocount:before, h6.nocount:before, #dw__toc h3:before, #panel h5:before { content: ""; counter-increment: none } /* Automatically numbering Table of Contents (TOC) via CSS https://www.freecodecamp.org/news/numbering-with-css-counters/ */ #dw__toc ul ul { list-style-type: none; counter-reset: css-counters 0; /* intializes counter, set -1 for zero-based counters */ } #dw__toc ul ul li div.li:before { counter-increment: css-counters; content: counters(css-counters, ".") " "; /* generates inherited counters from parents */ }
- /doc/lib/tpl/monobook/user/screen.css
.dokuwiki #content {counter-reset: level1;} .dokuwiki #dw__toc:before, .dokuwiki #dw__toc:after {counter-reset: level1; content: "";} .dokuwiki #dw__toc h3:before{content: ""} .dokuwiki #content h1, .dokuwiki ul.toc li.level1 {counter-reset: level2;} .dokuwiki #content h2, .dokuwiki ul.toc li.level2 {counter-reset: level3;} .dokuwiki #content h3, .dokuwiki ul.toc li.level3 {counter-reset: level4;} .dokuwiki #content h4, .dokuwiki ul.toc li.level4 {counter-reset: level5;} .dokuwiki #content h5, .dokuwiki ul.toc li.level5 {} .dokuwiki #content h1:before, .dokuwiki ul.toc li.level1 a:before { content: counter(level1) " "; counter-increment: level1; } .dokuwiki #content h2:before, .dokuwiki ul.toc li.level2 a:before { content: counter(level1) "." counter(level2) " "; counter-increment: level2; } .dokuwiki #content h3:before, .dokuwiki ul.toc li.level3 a:before { content: counter(level1) "." counter(level2) "." counter(level3) " "; counter-increment: level3; } .dokuwiki #content h4:before, .dokuwiki ul.toc li.level4 a:before { content: counter(level1) "." counter(level2) "." counter(level3) "." counter(level4) " "; counter-increment: level4; } .dokuwiki #content h5:before, .dokuwiki ul.toc li.level5 a:before { content: counter(level1) "." counter(level2) "." counter(level3) "." counter(level4) "." counter(level5) " "; counter-increment: level5; }
</WRAP>
Pré-requis
Installation
Modification pour exclure de la numérotation le premier h1 (titre de la page)
- /lib/tpl/monobook/user/screen.css
.dokuwiki #content {counter-reset: level1;} .dokuwiki #dw__toc:before, .dokuwiki #dw__toc:after {counter-reset: level1; content: "";} .dokuwiki #dw__toc h3:before{content: ""} .dokuwiki #content h1, .dokuwiki ul.toc li.level1 {counter-reset: level2;} .dokuwiki #content h2, .dokuwiki ul.toc li.level2 {counter-reset: level3;} .dokuwiki #content h3, .dokuwiki ul.toc li.level3 {counter-reset: level4;} .dokuwiki #content h4, .dokuwiki ul.toc li.level4 {counter-reset: level5;} .dokuwiki #content h5, .dokuwiki ul.toc li.level5 {} .dokuwiki #content h1:before, .dokuwiki ul.toc li.level1 a:before { content: counter(level1) " "; counter-increment: level1; } .dokuwiki #content h1.sectionedit1:before, .dokuwiki ul.toc li.level1:first-child a:before { content: none; } .dokuwiki #content h2:before, .dokuwiki ul.toc li.level2 a:before { content: counter(level1) "." counter(level2) " "; counter-increment: level2; } .dokuwiki #content h3:before, .dokuwiki ul.toc li.level3 a:before { content: counter(level1) "." counter(level2) "." counter(level3) " "; counter-increment: level3; } .dokuwiki #content h4:before, .dokuwiki ul.toc li.level4 a:before { content: counter(level1) "." counter(level2) "." counter(level3) "." counter(level4) " "; counter-increment: level4; } .dokuwiki #content h5:before, .dokuwiki ul.toc li.level5 a:before { content: counter(level1) "." counter(level2) "." counter(level3) "." counter(level4) "." counter(level5) " "; counter-increment: level5; }
Variante
Placez le fichier suivant dans l'un des CSS de votre thème (template) (ainsi que dans le print.css pour avoir la numérotation lors de l'impression) ou dans un userstyle.css dans votre répertoire ./conf :
Pour le thème monobook :
- /doc/lib/tpl/monobook/user/screen.css
/* Place for user defined CSS rules (screen media) - this file can safely be preserved when updating. See README for details. Note: All example files are delivered with the ".dist" extensions to make sure your changes do not get overwritten when updating the template. Just remove the ".dist" extension to use them. */ /* headlines */ div#content .dokuwiki h1, div#content .dokuwiki h2 { font-weight: bold; } div#content .dokuwiki h3, div#content .dokuwiki h4, div#content .dokuwiki h5, div#content .dokuwiki h6 { font-weight: normal; } div#content .dokuwiki {counter-reset: level1;} .dokuwiki #dw__toc:before, .dokuwiki #dw__toc:after {counter-reset: level1; content: "";} .dokuwiki #dw__toc h3:before{content: ""} div#content .dokuwiki h1, .toc-body ul.toc li.level1 {counter-reset: level2;} div#content .dokuwiki h2, .toc-body ul.toc li.level2 {counter-reset: level3;} div#content .dokuwiki h3, .toc-body ul.toc li.level3 {counter-reset: level4;} div#content .dokuwiki h4, .toc-body ul.toc li.level4 {counter-reset: level5;} div#content .dokuwiki h5, .toc-body ul.toc li.level5 {} div#content .dokuwiki h1:before, .dokuwiki ul.toc li.level1 a:before { content: counter(level1) ". "; counter-increment: level1; } div#content .dokuwiki h1.sectionedit1:before, .dokuwiki ul.toc li.level1 a:before { content: none; } div#content .dokuwiki h2:before, .dokuwiki ul.toc li.level2 a:before { content: counter(level2) ". "; counter-increment: level2; } div#content .dokuwiki h3:before, .dokuwiki ul.toc li.level3 a:before { content: counter(level2) "." counter(level3) ". "; counter-increment: level3; } div#content .dokuwiki h4:before, .dokuwiki ul.toc li.level4 a:before { content: counter(level2) "." counter(level3) "." counter(level4) ". "; counter-increment: level4; } div#content .dokuwiki h5:before, .dokuwiki ul.toc li.level5 a:before { content: counter(level2) "." counter(level3) "." counter(level4) "." counter(level5) ". "; counter-increment: level5; }
Configuration
Ce CSS fonctionne avec monobook :
- screen.css
div.dokuwiki {counter-reset: level1;} div.dokuwiki #dw__toc:before, div.dokuwiki #dw__toc:after {counter-reset: level1; content: "";} div.dokuwiki #dw__toc h3:before{content: ""} div.dokuwiki h1, .toc-body ul.toc li.level1 {counter-reset: level2;} div.dokuwiki h2, .toc-body ul.toc li.level2 {counter-reset: level3;} div.dokuwiki h3, .toc-body ul.toc li.level3 {counter-reset: level4;} div.dokuwiki h4, .toc-body ul.toc li.level4 {counter-reset: level5;} div.dokuwiki h5, .toc-body ul.toc li.level5 {} div.dokuwiki h1:before, div.dokuwiki ul.toc li.level1 a:before { content: counter(level1) ". "; counter-increment: level1; } div.dokuwiki h1.sectionedit1:before, div.dokuwiki ul.toc li.level1 a:before { content: none; } div.dokuwiki h2:before, div.dokuwiki ul.toc li.level2 a:before { content: counter(level1) "." counter(level2) ". "; counter-increment: level2; } div.dokuwiki h3:before, div.dokuwiki ul.toc li.level3 a:before { content: counter(level1) "." counter(level2) "." counter(level3) ". "; counter-increment: level3; } div.dokuwiki h4:before, div.dokuwiki ul.toc li.level4 a:before { content: counter(level1) "." counter(level2) "." counter(level3) "." counter(level4) ". "; counter-increment: level4; } div.dokuwiki h5:before, div.dokuwiki ul.toc li.level5 a:before { content: counter(level1) "." counter(level2) "." counter(level3) "." counter(level4) "." counter(level5) ". "; counter-increment: level5; }