जेकिल ब्लॉग पोस्ट में सामग्री की एक तालिका कैसे बनाएं?

Question

यदि मेरे पास हेडर्स के साथ जैकिल में कोई पृष्ठ/पोस्ट है, तो क्या नेविगेशन के लिए तालिका-सार-सामग्री/रूपरेखा स्वत: उत्पन्न करना संभव है? विकिपीडिया लेख के शीर्ष मामले के समान कुछ।

Answer 1

यह मार्कअप पार्सर का कार्य है।

Markdown वाक्य रचना किसी एक एक्सटेंशन में के मामले में Automatic generation of the table of contents परिभाषित करता है:

* This will become a table of contents (this text will be scraped). 
{:toc} 

यह Maruku और kramdown में काम करता है।

Answer 2

मुझे लगता है कि आप सामग्री में सभी एच 1, एच 2 तत्वों आदि की एक सूची का मतलब है? मुझे नहीं लगता कि जैकिल के पास इसे संभालने के लिए कुछ भी अंतर्निहित है। मुझे संदेह है कि जावास्क्रिप्ट को पृष्ठ के एक बार प्रस्तुत करने के बाद, this jQuery plugin, या many other plugins/snippets में से एक का उपयोग करके, आपके लिए यह उत्पन्न करने का सबसे आसान तरीका है।

Answer 3

आप अपनी सामग्री से पहले इस code का उपयोग कर सकते हैं।

<link rel="stylesheet" href="http://yandex.st/highlightjs/6.2/styles/googlecode.min.css"> 

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> 
<script src="http://yandex.st/highlightjs/6.2/highlight.min.js"></script> 

<script>hljs.initHighlightingOnLoad();</script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
     $("h2,h3,h4,h5,h6").each(function(i,item){ 
     var tag = $(item).get(0).localName; 
     $(item).attr("id","wow"+i); 
     $("#category").append('<a class="new'+tag+'" href="#wow'+i+'">'+$(this).text()+'</a></br>'); 
     $(".newh2").css("margin-left",0); 
     $(".newh3").css("margin-left",20); 
     $(".newh4").css("margin-left",40); 
     $(".newh5").css("margin-left",60); 
     $(".newh6").css("margin-left",80); 
     }); 
}); 
</script> 
<div id="category"></div> 

Answer 4

मैं Jekyll ब्लॉग जो विकिपीडिया टीओसी

के समान दिखता है तो सब मेरी Jekyll पदों सामग्री अनुभाग की एक टेबल है के लिए टीओसी की है। यह सिर्फ क्रैमडाउन का उपयोग करके किया जा सकता है।

उपयोग अपनी पोस्ट जहाँ आप चाहते हैं के अंदर इस कोड को टीओसी दिखाई

* Do not remove this line (it will not be displayed) 
{:toc} 

और विकिपीडिया टीओसी है जैसे कि यह शैली

// Adding 'Contents' headline to the TOC 
#markdown-toc::before { 
    content: "Contents"; 
    font-weight: bold; 
} 


// Using numbers instead of bullets for listing 
#markdown-toc ul { 
    list-style: decimal; 
} 

#markdown-toc { 
    border: 1px solid #aaa; 
    padding: 1.5em; 
    list-style: decimal; 
    display: inline-block; 
} 

उपयोग उचित रंग है कि सूट अपने ब्लॉग इस सीएसएस का उपयोग करें।

यही है!

टीओसी jekyll-table-of-contents की सहायता से भी किया जा सकता है, यदि किसी भी मामले में उपर्युक्त विधि काम नहीं करती है। यह Jquery और एक जेएस फ़ाइल का उपयोग करता है।

यहाँ कैसे मैंने किया के बारे में विस्तृत गाइड है: Jekyll TOC