Intestazione comprimibile in Markdown to html

Question

Il wiki interno di git-lab funziona con Markdown. Ho fatto diversi riepiloghi di articoli e voglio postarli nella nostra wiki, in modo tale che se faccio clic sull'intestazione, dovrebbe svolgersi e il testo dovrebbe diventare visibile, fondamentalmente come in questo example

Markdown ha questo espandere/comprimere/piegare la funzione?

Answer 1

Risposta breve: No, Markdown non offre una funzione del genere direttamente, ma con un po 'di lavoro potresti essere in grado di costruire qualcosa che funzioni.

per una funzione come quella di lavorare si avrebbe bisogno di un po 'di CSS e/o JavaScript per controllare le animazioni, ecc Mentre si potrebbe essere in grado di ottenere un tale funzionalità per lavorare su qualsiasi codice HTML, non è particolarmente facile su Markdown produzione.

Idealmente, ogni sezione comprimibile sarebbe stato avvolto in un div:

<div id="section1"> 
    <h1>Section 1</h1> 
    <p>Section 1 content</p> 
    <div id="section1-1"> 
    <h2>Section1-1</h2> 
    <p>section 1-1 content</p> 
    </div> 
    <div id="section1-2"> 
    <h2>Section1-2</h2> 
    <p>section 1-2 content</p> 
    </div> 
</div> 

Quindi è possibile utilizzare alcuni CSS/Javascript per comprimere le singole sezioni. Tuttavia, Markdown non ha un concetto di sezioni. Invece di quanto sopra, Markdown darebbe questo documento piatta:

<h1>Section 1</h1> 
<p>Section 1 content</p> 
<h2>Section1-1</h2> 
<p>section 1-1 content</p> 
<h2>Section1-2</h2> 
<p>section 1-2 content</p> 

Una soluzione richiederebbe scorrendo l'intero documento, rompendo in su nelle varie sezioni e avvolgere ogni sezione in div. È possibile trovare uno coupleexamples di questo come Estensioni al parser Python-Markdown. Tuttavia, con qualsiasi informazione relativa all'ambiente in cui stai lavorando, è un po 'più difficile indirizzarti nella direzione corretta. Inoltre, Stackoverflow non dovrebbe essere un sito di suggerimenti sugli strumenti. Tuttavia, osservando come gli altri hanno risolto il problema (negli esempi che ho indicato) dovresti essere in grado di trovare una soluzione simile.

Una volta che le sezioni sono state avvolte correttamente, un piccolo JavaScript per piegare/piegare le singole sezioni si prenderà cura di tutto il resto. Tuttavia, questo è un problema separato che è stato chiesto e risposto molte volte qui. Vedi alcune delle domande "Correlate" elencate nella barra laterale per le soluzioni a quella parte del problema.

È anche possibile che esistano alcune librerie JavaScript che prenderanno il semplice contenuto HTML, completeranno la sezione e implementeranno la funzione di piegatura/compressione tutto in uno. Tuttavia, una tale libreria potrebbe essere un po 'pesante e rallentare il tuo sito, quindi procedi con il catione.

Answer 2

Prova:

<details> 
    <summary>Your header here! (Click to expand)</summary> 
    Your content here... 
    > markup like blockquote's should even work on github! 
    more content here... 
</details> 

Si può provare questo genere di cose qui:

<details> 
 
     <summary>Your header here! (Click to expand)</summary> 
 
     Your content here...</br> 
 
     (markup only where supported)</br> 
 
     more content here...</br> 
 
    </details>

Questo funziona per me con Chrome, ma non può funzionare ancora per altri browser. Ci sono alcuni related posts at github.