sphinx documentation: collapse content

Sometimes, the list of entries on a single page gets very long. For quick navigation, you may either add a table of contents or collapse all content. In order to do so, add the following line to your layout.html template:

{% set script_files = script_files + [pathto("_static/collapse.js", 1)] %}

Now the referenced JavaScript file is missing. You have to add it to your _static folder; sphinx will automatically copy the file to the appropriate destination. The following code will expand a section when you click on the title or in case a anchor is defined in the URL as this is the way sphinx creates permalinks.

function collapse_dd(){
        if ($(this).hasClass('collapsed')) {
        } else {
        return false;
$(document).ready(function() {
    $('dl.class > dd').hide()
    $('dl.method > dd').hide()
    $('div.section > dl.function > dd').hide()
    $('div.section > dl.function').addClass('collapsed').click(collapse_dd)

    $('a').click(function(e) {

    if (window.location.hash.length != 0) {
        base = window.location.hash.replace(/\./g, '\\.');
        base = $(base);

You may also like...

Leave a Reply

Your email address will not be published.