2

I am pretty new to Sphinx and HTML, CSS, etc.., in general.

In this example the following code:

.. toggle-header::
    :header: Example 1 **Show/Hide Code**

        Content for header

Generates this HTML code:

<div class="toggle-header open">
    <p>Example <strong>Show/Hide Code</strong></p>
</div>
<div class="toggle-content docutils container">
    Content for header
</div>

I was wondering if i could generate my own HTML code in some similar way. So that for example this piece of code:

.. mybutton::
    :id: Demo

    Attribute
    Content

Would generate this HTML:

<button onclick="myFunction('Demo')" class=" w3-button w3-border w3-border-light-black w3-block w3-light-grey w3-left-align">
Attribute
</button>  
            
<div id="Demo" class="w3-animate-opacity w3-hide w3-container">
  <p>Content</p>
</div>
bad_coder
  • 11,289
  • 20
  • 44
  • 72
Situ
  • 21
  • 4
  • 1
    Not out of the box. You would have to write a custom directive. See https://www.sphinx-doc.org/en/master/extdev/markupapi.html – Steve Piercy Oct 23 '20 at 20:25

0 Answers0