Blogger Website में Table Of Contents add कैसे करें

दोस्तों क्या आप अपनी Blogger Website में Table Of Contents Add करना चाहते हैं तो यह लेख आपके लिए है क्योंकि इस लेख में हम आपको बताने वाले हैं कि आप बिल्कुल आसानी से Blogger Website में Table Of Contents  कैसे जोड़ सकते हैं।

अगर आपकी वेबसाइट wordpress पर होस्ट है तो Table Of Contents को जोड़ने के लिए आप अपनी वेबसाइट पर plugin का इस्तेमाल कर सकते हैं लेकिन अगर आपकी वेबसाइट blogger.com  पर host है तो यहां पर आपको ऐसा कोई भी option नहीं मिलता जिसका इस्तेमाल करके आप Table Of Contents को अपनी blogger website में add कर सकें।

 तो अब हमें इस पोस्ट में आपको एक आसान तरीका बताएंगे जिसका इस्तेमाल करके आप Table Of Contents को blogger website में आसानी से add कर पाएंगे।

Table of Contents क्या है?

Table of Contents वेबसाइट में मौजूद heading और subheading की एक सूची है। यह आमतौर पर वेबसाइट post पर मौजूद topics की list होती है। Table of Contents का मुख्य उद्देश्य website user को किसी वेबसाइट में खोजी जा रही जानकारी को शीघ्रता से खोजने में मदद करना है। यह आमतौर पर किसी भी लेख में सबसे ऊपर देखने को  मिलता है।

यह user और search engines दोनों के लिए सहायक होती है, क्योंकि यह उपयोगकर्ताओं को उनके द्वारा खोजी जा रही जानकारी पर जल्दी से नेविगेट करने की अनुमति देती है, और यह खोज इंजन को website structure को समझने में मदद करता है।

आप TOC को आसानी से समझने के लिए इस पोस्ट में first heading के ऊपर toc  को देख सकते हैं

Table of Contents के लाभ क्या हैं?

जब आप 3000 से 4000 word का post लिखते हैं तो उसमें बहुत सी Heading और Subheading का इस्तेमाल करते हैं जिस कारण जब भी कोई User आपकी वेबसाइट के उस पोस्ट पर आता है तो वह उस पोस्ट के structure को आसानी से समझ नहीं पाता।

जिस कारण वह user आपकी वेबसाइट के उस पोस्ट को छोड़ कर चला जाता है। जिससे आपकी वेबसाइट का bounce rate बढ़ता है और आपकी वेबसाइट पर बुरा प्रभाव पड़ता है जिससे आपकी वेबसाइट की ranking down होती है। 

इसलिए आपको अपनी वेबसाइट में Table of Contents का इस्तेमाल करना चाहिए जिससे यूजर को  वेबसाइट post के structure को समझने में मदद मिलेगी और user जिस जानकारी को प्राप्त करने के लिए आपकी वेबसाइट पर आया है वह उसे आसानी से मिल जाएगी।

Table of Contents का इस्तेमाल करने से आपकी website को seo लाभ भी प्राप्त होता है क्योंकि इससे search engine bot को आपकी वेबसाइट के post structure को समझने में मदद मिलती है। 

स्कोर इस्तेमाल करने का एक अन्य लाभ यह है कि आपकी वेबसाइट प्रोफेशनल दिखाई देती है।

Table of Contents वेबसाइट के लिए बहुत ही महत्वपूर्ण है और आपको अपनी वेबसाइट में इसका इस्तेमाल अवश्य करना चाहिए।

आप अपनी वर्डप्रेस वेबसाइट में इसका इस्तेमाल plugin के द्वारा आसानी से कर सकते हैं लेकिन अगर आप इसका इस्तेमाल blogger.com पर host वेबसाइट में करना चाहे तो यह थोड़ा कठिन कार्य है लेकिन अब हम आपको बताने वाले हैं कि आप इसे आसानी से blogger website में कैसे add कर सकते हैं। 

Blogger में Table Of Contents कैसे जोड़ें (how to add table of contents in blogger in hindi)

इसका इस्तेमाल blogger वेबसाइट पर करना बहुत ही आसान है बस आपको कुछ code अपने blogger template में add करने होंगे।

सबसे पहले blogger.com पर जाएं और login करें।

इसके बाद लेफ्ट साइड में Theme पर क्लिक करें।

अब आपको Customise के सामने बने arrow पर क्लिक करना है और Edit HTML पर क्लिक कर देना है।

अब आपको </head> search करना है और नीचे दिए गए code को </head> tag के ठीक ऊपर paste कर देना है।

<script type='text/javascript'>              
//<![CDATA[           
//*************TOC plugin           
function mbtTOC() {var mbtTOC=i=headlength=gethead=0;           
headlength = document.getElementById("post-toc").getElementsByTagName("h2").length;for (i = 0; i < headlength; i++)           
{gethead = document.getElementById("post-toc").getElementsByTagName("h2")[i].textContent;document.getElementById("post-toc").getElementsByTagName("h2")[i].setAttribute("id", "point"+i);mbtTOC = "<li><a href='#point"+i+"'>"+gethead+"</a></li>";document.getElementById("mbtTOC").innerHTML += mbtTOC;}}function mbtToggle() {var mbt = document.getElementById('mbtTOC');if (mbt .style.display === 'none') {mbt .style.display = 'block';} else {mbt .style.display = 'none';}}           
//]]>              
</script>

अब आपको ]]></b:skin> search करना है और नीचे दिए गए CSS Code को ]]></b:skin> के ऊपर पेस्ट कर देना है।

.mbtTOC{border:5px solid #f7f0b8;box-shadow:1px 1px 0 #EDE396;background-color:#FFFFE0;color:#707037;line-height:1.4em;margin:30px auto;padding:20px 30px 20px 10px;font-family:oswald,arial;display:block;width:70%}.mbtTOC ol,.mbtTOC ul{margin:0;padding:0}.mbtTOC ul{list-style:none}.mbtTOC ol li,.mbtTOC ul li{padding:15px 0 0;margin:0 0 0 30px;font-size:15px}.mbtTOC a{color:#0080ff;text-decoration:none}.mbtTOC a:hover{text-decoration:underline}.mbtTOC button{background:#FFFFE0;font-family:oswald,arial;font-size:20px;position:relative;outline:none;cursor:pointer;border:none;color:#707037;padding:0 0 0 15px}.mbtTOC button:after{content:"\f0dc";font-family:FontAwesome;position:relative;left:10px;font-size:20px}

अंत में आपको <data:post.body/> search करना है और <data:post.body/> tag को नीचे दिए गए code से बदल देना है।

Note:- <data:post.body/> आपके blogger template में एक से अधिक हो सकते हैं और आपको सभी को नीचे दिए गए code से बदलना होगा।

<div id="post-toc"><data:post.body/></div>

अब आपको save पर क्लिक करके सेटिंग को सेव कर लेना है।

Blogger Blog Post में Table Of Contents कैसे दिखाएं?

Blogger Blog Post में TOC को दिखाने के लिए अपनी Blog post पर जाए और अपने post editor को HTML View में Switch करें।

अब नीचे दिए गए code को first heading के ठीक ऊपर paste कर दे।

<div class="mbtTOC">
<button onclick="mbtToggle()">Contents</button>
<ol id="mbtTOC"></ol>
</div>

इसके बाद नीचे दिए गए code को blog post के लास्ट में paste कर दे।

<script>mbtTOC();</script>

अब पोस्ट को अपडेट कर दें और आप देख पाएंगे कि first heading के ठीक ऊपर आपको Table Of Contents दिखाई देगा।

FAQ

इस लेख आपने क्या सीखा 

इस लेख में हमने आपको बताया है कि आप किस प्रकार से अपनी Blogger Website में Table Of Content add कर सकते हैं वह भी बिल्कुल आसान प्रक्रिया का पालन करके।

हमारे द्वारा इन code को ऐसा बनाया है कि आपकी वेबसाइट की स्पीड पर किसी प्रकार का भी प्रभाव नहीं पड़ेगा और आपकी वेबसाइट की स्पीड वैसी ही रहेगी जैसे पहले थी और हमने इस प्रक्रिया को जितना अधिक हो सके उतना अधिक सरल बनाया है।

अगर आपको हमारा यह पोस्ट पसंद आया हो तो इसे अपने दोस्तों के साथ शेयर करें। अगर आपका कोई  सवाल या सुझाव हो तो आप हमें कमेंट बॉक्स में कमेंट करके पूछ सकते हैं।