Sphinx，重组文本显示/隐藏代码段

Question

我一直在记录一个软件包 狮身人面像 和 重组文本.

在我的文档中，有一些长代码段。我希望能够将它们隐藏为默认值，并带有一些“显示/隐藏”按钮，可以扩展它们（例子).

有这样做的标准方法吗？

Answer 1

我认为最简单的方法是创建一个自定义的狮身人面像主题，在该主题中，您告诉某些HTML元素具有此功能。一点jQuery会在这里走很长一段路。

但是，如果您希望能够在重组文字标记中指定此内容，则需要

• 在狮身机构本身或
• 在Sphinx/Docutils扩展程序中实现它...然后创建一个了解此功能的狮身人面像主题。

这将有更多的工作，但会给您带来更大的灵活性。

Answer 2

您不需要自定义主题。使用内置指令 container 这使您可以将自定义的CSS类添加到块中并覆盖存在主题，以添加一些JavaScript以添加show/hide-unctionality。

这是 _templates/page.html:

{% extends "!page.html" %}

{% block footer %}
 <script type="text/javascript">
    $(document).ready(function() {
        $(".toggle > *").hide();
        $(".toggle .header").show();
        $(".toggle .header").click(function() {
            $(this).parent().children().not(".header").toggle(400);
            $(this).parent().children(".header").toggleClass("open");
        })
    });
</script>
{% endblock %}

这是 _static/custom.css:

.toggle .header {
    display: block;
    clear: both;
}

.toggle .header:after {
    content: " ▶";
}

.toggle .header.open:after {
    content: " ▼";
}

这添加到 conf.py:

def setup(app):
    app.add_stylesheet('custom.css')

现在，您可以显示/隐藏一个代码块。

.. container:: toggle

    .. container:: header

        **Show/Hide Code**

    .. code-block:: xml
       :linenos:

       from plone import api
       ...

我在这里使用非常相似的东西： https://training.plone.org/5/mastering_plone/about_mastering.html#Escises

Answer 3

Cloud Sphinx主题具有自定义指令 html-toggle 提供可切换的部分。引用他们的 网页:

您可以标记部分 .. rst-class:: html-toggle, ，这将使该部分默认为在HTML下折叠，并带有“显示部分”切换链接到标题的右侧。

这里 是他们的测试演示页面的链接。

Answer 4

有一个非常简单的扩展，确切地提供了该功能： https://github.com/scopatz/hiddencode

它对我来说很好。