Digital GuruJi Technical Tips in Hindi

  • Tools
    • FB Font Generator
    • Voice 2 Text Generator
    • Corona
  • Blogging
    • WordPress
    • Affiliate marketing
    • Hosting
  • Tech Tips
    • Technology
    • Android Trick
    • software
  • Make money online
  • SEO
    • Email Marketing
Home / Blogging / Blogger Post मे Automatic Table of Contents(TOC) कैसे लगाए - 2020

Blogger Post मे Automatic Table of Contents(TOC) कैसे लगाए - 2020

लेखक: Swarn Jainश्रेणी: Bloggingसमय: 9 मिनट

Hello Friends Welcome to Digital GuruJi

आज में आपको बताउगा की अपनी Website में Blogger मे Table of Contents कैसे लगा सकते है। अपनी websites में Table of Content(TOC) लगाना बहुत ही जरुरी होता है क्योकि अगर आपकी Post बहुत लंबी या फिर बड़ी है तो यूजर आपकी पोस्ट को पड़ते-पड़ते परेशान हो जायेगा और बिना आपकी Post पड़े वापिस चला जायेगा।

यदि आपकी blogger me table of content kaise add kare नहीं है तो   जल्द ही अपनी site पर TOC add कर ले, क्योंकि टेबल ऑफ कंटेन्ट होने से यूजर अपने मतलब की जानकारी आसानी से देख कर पड़ सकता है। जिससे user को परेशानी भी नहीं होगी और वो अपने मतलब की जानकारी आसानी से बिना समय बर्बाद किये पढ़ सकता है। 

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

Dosto, Table of Content 2020 में बहुत ही माना गया है क्योकि इससे आपकी वेबसाइट का On-Page SEO भी अच्छा हो जाता है और आपकी Blogger Website का Look भी अच्छा लगने लगता है। तो चलिए शुरू करते है- How to Create a Table of Contents For Blogger in Hindi.

अगर WordPress की बात करे तो Table of Content के लिए WordPress में बहुत से Plugins होते है जिससे Plugin को install करते ही आपकी पूरी वेबसाइट की Post और Pages में add हो जाता है लेकिन Blogger में ये काम आपको खुद से ही करना पड़ेगा। 

  • Top 5 SEO Optimized Themes For Blogger
  • अपने Blog पर Services को sell करके पैसे कमाए

अनुक्रम

  • 1 Table of Content Blogger में कैसे लगते है??
    • 1.1 Table of Content HTML Code 1
    • 1.2 Add Table Of Contents In Blogger Post
    • 1.3 आज आपने क्या सीखा?

Table of Content Blogger में कैसे लगते है??

Table of Content को Blogger में लगाने के लिए आपको कुछ Code की जरूरत होगी, जो की में आपको आज provide करुगा। जिससे आप Blogger में आसानी से लगा पाओगे, इसके लिए आपको Post को अंत तक पड़ना होगा।

blogger me table of content kaise add kare

तो दोस्तों सबसे पहले आपको अपनी वेबसाइट के Theme section पर जाना है फिर Edit HTMLकोड ओपन करना है और फिर आपको ctrl + f  दबाना है उसके बाद आपको Search Box में टाइप करना है </head> और फिर आपको मैंने जो निचे HTML Code 1 दिया है इस कोड को आपको </head> कोड के ऊपर पेस्ट कर देना है।

Table of Content HTML Code 1

<link href='http://fortawesome.github.io/Font-Awesome/assets/font-awesome/css/font-awesome.css' rel='stylesheet'/>           

<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>


<script type='text/javascript'>              

//<![CDATA[                      

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>
उसके बाद आपको आपको दोबारा से ctrl + f प्रेस करना है और इस बार आपको Search Box में नीचे दिए गए Code 2 को टाइप करके Search करना है - 
how to add table of contents in blogger
Code 2
]]></b:skin>
ये कोड सर्च करने के बाद आपको निचे दिए गए Code 3 को उसके (]]></b:skin>) ऊपर पेस्ट कर देना है -
Code 3
.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;}
 
ऊपर के दोनों कोड पेस्ट करने के बाद आपको फिर से एक और कोड को अपनी थीम में पेस्ट करना है अब आपको अपनी Theme के html कोड में नीचे दिए गए Code 4 को Search करना है और code 4 को हटा कर उसकी जगह पर दूसरा Code 5 पेस्ट करना है।
  • अपने Blog के लिए Sponsored Posts ले और $100 कमाए
 
Note: ये Code आपकी Theme में 2 या उससे ज्यादा बार हो सकता है और आपको सारे Code 4 की जगह code 5 को Paste करना है। 
Code 4
<data:post.body/>
Code 5
<div id="post-toc"><data:post.body/></div>
ये तीनो कोड अपने Blogger की थीम में पेस्ट करने के बाद आपको Save Theme के बटन पर क्लिक कर देना है | 
 

Add Table Of Contents In Blogger Post

अब दोस्तों आप अपने जिस भी पोस्ट में Table of Content Add करना चाहते है आपको उस पोस्ट के html कोड में जाना है और उसके बाद आपको अपनी Post के सभी heading के ऊपर निचे दिए गए Code 6 को पेस्ट करना है Ex. </br>Code<br>
  • For Bloggers-Quora को use करने के फायदे
 
Code 6
<div class="mbtTOC"> 
    <button onclick="mbtToggle()">Table Of Contents</button> 
    <ul id="mbtTOC"></ul> 

    </div>
अब दोस्तों आपको अपनी Post के बिलकुल नीचे एक </div> code दिखेगा उसके के ऊपर Code 7 को पेस्ट करना है जो की नीचे दिया गया है -
 
Code 7
<script>mbtTOC();</script>
अब दोस्तों आपका काम हो गया है अब आप अपनी पोस्ट चेक करेंगे तो आपको अपनी वेबसाइट में Table of Content मिल जायेगा | जो भी अपने Heading बनाई होगी वो आपको पोस्ट में दिखने लगेंगी|
 
अगर आपको अभी भी अपने Blogger की Websites में Table of Content add करने में परेशानी आ रही है तो आप ऊपर दी गयी वीडियो में देख कर आसानी से कर सकते है।
 
 

आज आपने क्या सीखा?

Blogger Post मे Automatic Table of Contents(TOC) कैसे लगाए ओर किसी भी Website/Blog मे TOC लगाना जरूरी क्यों है। 
 
आप से रिक्वेस्ट है कि इसे अपने जानने वालों में Whatsaap, Facebook और Twitter के माध्यम से जरूर शेयर करें यदि आपके पास इस Article को लेकर कोई सवाल है तो उसे कमेंट बॉक्स में लिखें।

टैग: blogger me table of content kaise add kare how to add automatic table of contents in google blogger how to add table of contents in blogger post How to Create a Table of Contents In Blogger table of contents widget for blogger

शेयर करें
  • Facebook
  • Twitter
  • Pin It
  • Email
  • LinkedIn
  • WhatsApp
« Previous 2 Min मे कोई भी Movie Download Kaise Kare?
Next » MoviesFlix 2021-New Bollywood Movie Downloading Website

लेखक: Swarn Jain

मैं Digital GuruJi (digitalgurujie.com) ब्लॉग का संस्थापक और एक Professional Blogger or Digital Marketer हूं। यहाँ पर मैं नियमित रूप से अपने पाठकों के लिए SEO, Technology or Internet se judi jankari share karta hu.

Reader Interactions

टिप्पणियाँ(1)

टिप्पणियाँ दिखाएं

Comments

  1. Tech8G

    Nice post thanks dear.

    जवाब दें

अपनी प्रतिक्रिया दें। Cancel reply

आपको ये भी पढना चाहिए

  • DISABLE COPY-PASTE IN BLOGGER(हिंदी)
  • flyout sponsored post
    अपने Blog के लिए Sponsored Posts ले और $100 कमाए
  • free online plagiarism checker software
    Best Free Plagiarism Checker Online Software for English or Hindi

Primary Sidebar

Follow Us

  • Facebook
  • Instagram
  • LinkedIn
  • Pinterest
  • Twitter

Letest Posts

  • Mumbai Saga Full Movie Download Leaked By Filmywap 720p
  • Pagglait Full Movie Download Leaked by Filmyzilla 720p
  • Cool and Best Instagram Bio For Girls in Hindi 2021
  • Top Skills to become a successful LIC Agent
  • The Girl On The Train 2021 Movie Downlaod Filmyzilla 720p
  • PUBG Mobile बैन के बाद कैसे खेले ओर Download करे
  • Stylish Name Generator For Facebook, Instagram, Pubg

Categories

  • Adsense
  • Affiliate marketing
  • Android Trick
  • Blogging
  • Cryptocurrency
  • Domian
  • Email Marketing
  • English
  • Facebook
  • Featured
  • Games
  • Hosting
  • Insurance
  • Internet
  • Jobs
  • Make money online
  • Movies
  • Plugin
  • PM Yojana
  • SEO
  • Share Market
  • software
  • Tech Tips
  • Technology
  • Template
  • Themes
  • Tips & Tricks
  • WordPress
  • ज्ञान की बाते

Footer

थोडा हमारे बारे मे

Digital GuruJi एक हिन्दी ब्लॉग है। यहाँ पर मैं नियमित रूप से अपने पाठकों के लिए SEO, Technology or Internet se judi jankari share karta hu.

ईमेल [email protected]

हमसे सोशल मीडिया पर जुड़ें

  • Facebook
  • Instagram
  • LinkedIn
  • Pinterest
  • Twitter

Copyright © 2017-2020 DMCA.com Protection Status About Us Contact US Privacy Policy Disclaimer