local.php
, acl.auth.php
, dokuwiki.php
, entities.conf
etc…Par défaut, lorsque l'on arrive sur une page de DokuWiki, la table des matières est dépliée. Nous allons voir comment inverser ce comportement : le contenu de la table des matières sera alors invisible au chargement de la page et c'est l'utilisateur qui devra cliquer sur l'entête de la table des matières pour afficher son contenu.
Cette astuce est directement repiquée du thème Typo de Michael Klier.
1) Dans le répertoire de configuration de DokuWiki1), créez un fichier userscript.js
contenant ceci :
addInitEvent(function() { var toc = $('toc__inside'); if(toc) { toc.style.display = 'none'; } });
Alternativement, vous pouvez aussi mettre ce code dans le fichier script.js
du répertoire de votre thème.
2) Videz le cache manuellement ou attendez qu'il expire automatiquement pour voir le résultat.
div.dokuwiki #toc__inside { border: 1px solid __border__; background-color: __background__; text-align: left; padding: 0.5em 0 0.7em 0; }
display:none;
à la fin pour obtenir div.dokuwiki #toc__inside { border: 1px solid __border__; background-color: __background__; text-align: left; padding: 0.5em 0 0.7em 0; display:none; }
lib/scripts/script.js
/** * Adds the toggle switch to the TOC */ function addTocToggle() { if(!document.getElementById) return; var header = $('toc__header'); if(!header) return; var obj = document.createElement('span'); obj.id = 'toc__toggle'; obj.innerHTML = '<span>−</span>'; obj.className = 'toc_close'; obj.style.cursor = 'pointer'; prependChild(header,obj); obj.parentNode.onclick = toggleToc; try { obj.parentNode.style.cursor = 'pointer'; obj.parentNode.style.cursor = 'hand'; }catch(e){} } /** * This toggles the visibility of the Table of Contents */ function toggleToc() { var toc = $('toc__inside'); var obj = $('toc__toggle'); if(toc.style.display == 'none') { toc.style.display = ''; obj.innerHTML = '<span>−</span>'; obj.className = 'toc_close'; } else { toc.style.display = 'none'; obj.innerHTML = '<span>+</span>'; obj.className = 'toc_open'; } }
/** * Adds the toggle switch to the TOC */ function addTocToggle() { if(!document.getElementById) return; var header = $('toc__header'); if(!header) return; var obj = document.createElement('span'); obj.id = 'toc__toggle'; obj.innerHTML = '<span>−</span>'; obj.className = 'toc_open'; obj.style.cursor = 'pointer'; prependChild(header,obj); obj.parentNode.onclick = toggleToc; try { obj.parentNode.style.cursor = 'pointer'; obj.parentNode.style.cursor = 'hand'; }catch(e){} } /** * This toggles the visibility of the Table of Contents */ function toggleToc() { var toc = $('toc__inside'); var obj = $('toc__toggle'); if(toc.style.display == 'block') { toc.style.display = ''; obj.innerHTML = '<span>−</span>'; obj.className = 'toc_open'; } else { toc.style.display = 'block'; obj.innerHTML = '<span>+</span>'; obj.className = 'toc_close'; } }
— Laynee 2008/08/13 15:43
Cette méthode n'est pas compatible avec les greffons qui génèrent autre chose que du html (par exemple le greffon odt)
Créer ou éditer le fichier entities.local.conf
dans le répertoire de configuration de dokuwiki2) et mettre le code suivant dedans. Attention, tout doit tenir sur une seule ligne
~~closetoc~~ <script language="javascript" type="text/javascript">addInitEvent(function(t){if(t=$('toc__inside'))t.style.display='none';});</script>
~~closetoc~~ <script language="javascript" type="text/javascript">jQuery(function(){jQuery('div\x23toc__header').click();});</script>
Ensuite, il suffit d'écrire ~~closetoc~~
dans une page pour que celle ci apparaisse avec une table des matières initialement repliée.
— schplurtz 2011/06/25 12:56
Ce sujet est-il toujours à jour ? La modification simple dans userscript.js ne fonctionne pas.
— karibou 2013/12/30 23:22