Automatically Create Table of Contents in Blogger Post in Hindi: आज इस पोस्ट में हम आपको बताने जा रहे हैं की आप अपने Blogger Post में Automatic Table of Contents कैसे Add करेंगे।


Blogger Post में कैसे Add करें Automatic Table of Contents (TOC)
Blogger Post में कैसे Add करें Automatic Table of Contents (TOC)

How to Add Automatically Create Table of Contents in Blogger


अगर आपकी Website एक ब्लॉगर पर हैं तो आपको Table of Contents के बारे मे जरूर मालूम होगा तो इस पोस्ट में हम आप लोगो को Table Of Contents से जुड़ी सभी पुछे जाने वाले सभी प्रश्न के उत्तर भी जानेंगे जैसे Table of Contents क्या होता है?, Table of Contents कैसे Add करे ? , इसके क्या फायदे क्या हैं  ?, इसे अपने Blogger के पोस्ट में कैसे Implement करते हैं ?

अगर आप अपने Blogger के Post में Table of
Contents को Add करतें हैं तो इससे आपके पोस्ट पर आने वाले Visiters और आपको दोनों को फायदा होने
वाला है क्योकि Blogger Post के Article मे Table of Contents को Add करेंगे तो Short या Long post में Visitors को मालूम हो जाता है की आपके पोस्ट मे कौन – कौन से Topic पर Article लिखी हुई है और उन्हें अपने अनुसार उस topic पर click कर के पहुँचने में आसानी होती है।

Table of Contents (TOC) क्या होता है?

Table of Contents (TOC) किसी Article में
लिखी गयी Topics का एक एक Summarized
Overview होता है । Table of Contents को Short में TOC कहा जाता है । Table of Contents आपके पोस्ट में डाले गए Major Heading (H1), Heading (H2) Subheading(H3), Minor Heading(H4) को Target करता है और आप जिस स्थान पर Table of Contents को Set करते हैं वहाँ इसी को Show करता हैं इसलिए अपने पोस्ट के
Heading, Subheading Minor Heading को ठीक तरह से लिखा जाता है।

Table of Contents Add करने से क्या फायदा है ?

आप सभी Top Blogger के Post में Table of
Contents देखने के लिए मिल जाएगा, आज मैं इस पोस्ट मैं इसके सभी फायदे के बारे में बता रहा हूँ ।

Table of Contents Add करने के फायदे :-


  • आपके Blog की SEO Improve होता है।
  • Search Engine मे Ranking में भी फायदा होता है।
  • Search Engine में Post के Title के साथ-साथ Headings और Subheadings भी Rank करता है।
  • Post में जिस Topic को पढ़ना चाहते है, TOC के मदद से सीधे उस Topic पर जा सकते हैं।
  • आपके Post को आसानी से Navigate किया जा सकता है।
  • Visiters को Post पढ़ने में सरल और आसान बनाता है।
  • Visiters को एक अच्छा User Experience देता है।
  • इसके Structure Overview से Articles और ज्यादा Professional और Attractive दिखता है।

    Blogger Post Automatic Table of Contents कैसे लगाएँ ?

    आपको अपने Blog के post मे Automatic Table of Contents add करने से पहले आपको अपने Blogger Template मे कुछ Code को add करना होगा इसके लिए आपको Html की Basic Knowledge है तभी आप कर सकते हैं अब हम नीचे जो Steps बताएं हैं उन्हें Follow किजिये:-


    Step1– 

    • Blogger मे Login कीजिये
    • Theme पर Click कीजिये
    • Theme का Backup ले लें ताकि अगर आपसे editting के समय कोई दिक्कत हो जाए तो आप उस Backup Theme से वापस Theme को Fix कर सकते हैं ।
    • अब Edit Html पर Click करना है ।

    Step2–

    • अब जो आपके सामने Edit HTML Box खुला है उसमे कहीं पर Click कीजिये ।
    • अगर आप PC/Computer से कर रहे हैं तो
    • Keyboard मे Ctrl+F Press करना है और अगर मोबाइल का use कर रहे हैं तो आपको Manually Code पहचान कर Add करना होगा या फिर QuickEdit App को Install करके Downloaded Theme को Edit करके Upload करना होगा ।
    • अब नीचे दिये गए Code को </head> से पहले Paste करना है

    Paste this Code Before </Head> tag 
    <style> /* TOC by AHP (hindimeworld.com) */ .table-of-contents{flex:auto;width:fit-content;background:#eee;font-size:14px;padding:11px;margin:8px 0 30px 0} .table-of-contents li{margin:0 0 0.25em 0} .table-of-contents a{color:#2a5365} .table-of-contents h4{margin:0;cursor:pointer} .table-of-contents h4:before{font-family:FontAwesome;content:"\f0c9";padding-right:7px;} /* For Fontaweosme 5 .table-of-contents h4:before{font-family:'Font Awesome 5 Free';content:"\f0c9";padding-right:7px;} */ </style>


    Step3– 
    अब नीचे दिये गए JavaScript Code को </html> से पहले Paste कर देना है फिर Save कर देना है।



    Paste this Code Before </HTML> tag 
    <script async='async' defer='defer'> var head,newLine,el,title,link,ToC=&quot;<nav class='table-of-contents' role='navigation'><h4 onclick='toc()'>Table of Contents</h4><ul style='display:none'>&quot;;$(&quot;article h2, article h3, article h4, article h5&quot;).attr(&quot;id&quot;,function(arr){return &quot;point&quot; + arr;});$(&quot;article h2, article h3, article h4, article h5&quot;).each(function(){el=$(this),title=el.text(),link=&quot;#&quot;+el.attr(&quot;id&quot;),ToC+=newLine=&quot;<li><a href='&quot;+link+&quot;'>&quot;+title+&quot;</a></li>&quot;}),ToC+=&quot;</ul></nav>&quot;,$(&quot;.toc-pro&quot;).prepend(ToC);function toc() {$(&quot;.table-of-contents ul&quot;).toggle();} </script>

    अब आपके Blogger मे Automatic Table of
    Contents का Setup Complete हो गया है
    अब आप जिस post मे जहां पर Table of Contents
    को Show कराना चाहते हैं वहाँ पर Html View मे एक
    Code Add करना होगा आप नीचे Screenshots को देखकर समझ सकते हैं




    Automatic Table of Contents को Show करने के लिए ये Code है 


    Paste Code In Post Html 
    <div class='toc-pro'></div>


    ये Automatic Table of Contents (TOC) है आपको
    अपने पोस्ट मे जहा भी Table of Contents को Show
    कराना चाहते हैं वहाँ पर ये छोटा सा Code को Paste
    कर दे फिर आपका Code Box बन के Ready हो जाएगा।

    Conclusion:

    तो दोस्तो हमे आशा है की आपको समझ में आ गया होगा की Blogger Post Automatic Table of Contents (TOC)
    कैसे Add करते हैं ऊपर बताए गये  सभी Steps को ठीक से Follow करने पर भी कोई Problem आ रहा हो तो आप हमे comment box में जरूर बताए।
    मैं उम्मीद करता हूँ की आप लोगों को ये Article पसंद आया होगा
    और अगर आपके मन में कोई सवाल है या समस्या या सुझाव है तो हमे Comment में जरूर बताइएगा