Blogger Website Me Table Of Content kaise add Kare in hindi

Namkar Dosto Apka Swagat Hamari Ek New Post Me Aj Ham Jane Ge Ki Kis Tarah Ham Blogger website Me table of content add kar shakate hai.Ap Janate Hoge ki Ap Ki website Wordpress Par Hai To aap Asani Che Plugin Install Karake Kar shakate Ho Lekin BAt Ati Hai Jab Hamari Website Blogger plate Form Par bild Kiya Jata Hai Tab Ham Kai Apni Post Me Table of Conent Use Kar Shake Hai.

table of content kaise add kare,blogger me table of content,how to add table of content in blogger,blogger me table of content show kaise kare
Blogger Website Me Table Of Content kaise add Kare in hindi
Jaise Ki Aap Koi Books Me Dekhe Hogi Ki Sharu Me Kaise Ek index List Diya Jata Hai Ki Aapko YAh Book Me Konse Page Me Kya Milane Vale usi Tarah Hamari Post Ya Article Me Bhi Table Of Conent Add Kara ke User Ko Bata Dete Hai Aapko Yah Post Me Kya Milane Vala Hai.Taki User Ko Bhi article Ke Bare Me Pahale Che Pata Chal Jaye.table of content ki help che reader bahot Help Mil Jati Hai.

Table of contents kya hai?




Jab Ap Bahot BAda Article likhate ho tab reader Ko padhane me Mushakeliya Aati Hai.uska nivaran ke liya table of content taiyar kiya jata hai. Table of content post ke main topic ki reader Ko list miljata Hai.esake liye Table of content me post me diya gya Sub-heading or (H1,H2,H3,H4) sabhi Ki ek list Hoti hai taki User Ko paa chale ki Akhir yah post kiya topic ke bare me likha gya hai.

Table of content me diya gya topic pe click karane che reader ko us topic ke upar pahoch jata hai.aab apko pata chal gya hoga ki aap ki aakhir kya hota hai table of contents.

Blogger Website Me Table Of Content kaise add Kare?

Blogger me table of content add karane ke liye aapko niche diye gaye step folow karana padega.


1.Sabase pahale aapko blogger deshbord me login Ho jana hai.
2.usake bad teame me jane bad aapako karana hai edit HTML.
3.Edit HTML karane ke bad aapo Crtl+F Karake Find Karana Hai </head>.

4.Ab APko Just </head> Ke upar Niche diye Gaye code ko Paste Kar Dena Hai.


<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[           
//*************TOC plugin by 
MyBloggerTricks.com           
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>
     
Note :Note :Agar aapki post me H2 Heading Ka use kiya hai To apko kaoi change karane ko jarurat nahi hai Lekin H3 Heading ka use Kiya hai to apko H2 Ki Jagah H3 Replace karna hai.

5.usake bad apko fir che template code me </b:skin> Find karana hai.

6.ab apko </b:skin> ke just upar niche diya gaya code paste karana hai.


/*####Automatic TOC Plugin by
 MyBloggerTricks####*/          
.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;}
     


7. Fir che aaapko yah code <data:post.body/> ctrl+f karake find karana hai.

---> yah Code aapko template me 3 se 4 bar mil jayege sabhi ke niche niche diya code ko replace karana hai..

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


8.aab aapko aapni template ko save kar dena hai.


Post me table of content kaise show kare?



Sabase pahale aapko post me edit html me open kar lena hai.uske bad bad aapko jaha par table show karana chahate ho vaha niche diya gya code paste kar de.

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


Agar Table show nahi karata To ol ki jagah ul  repalce kar de.

Ab apko post ke end me niche diya gye code
ko paste karana hai.
<script>mbtTOC();</script>


code source:MyBloggerTricks.com

Last Word:

Apne yah Article me shikha ki kis tarah ham apane blogger post me table of content show karava shakate hai.yah information aapko acchi lage to dosto ke sath share jarur kare.

Post a Comment

10 Comments

  1. This is a wonderful article, Given so much info in it, These type of articles keeps the users interest in the website, and keep on sharing more ... good luck. khatri885

    ReplyDelete
  2. This is also a very good post which I really enjoyed reading. It is not every day that I have the possibility to see something like this.. mankhatri885

    ReplyDelete
  3. Gangaur Realtech is a professionally managed organisation specializing in real estate services where integrated services are provided by professionals to its clients seeking increased value by owning, occupying or investing in real estate. The Hyde price

    ReplyDelete
  4. Just saying thanks will not just be sufficient, for the fantasti c lucidity in your writing. I will instantly grab your rss feed to stay informed of any updates. Avenue South Residence floor plan

    ReplyDelete
  5. Customer care helpline number.
    __9144142055
    Any problems call my agent (24*7) hours available
    Contact hair
    Toll free -1800300800
    Contect hair-8167767782
    Online problem balance deducted and balance pending and any problems call my assistance
    Contact hair-9144142055

    Customer care helpline number.
    __9144142055
    Any problems call my agent (24*7) hours available
    Contact hair
    Toll free -1800300800
    Contect hair-8167767782
    Online problem balance deducted and balance pending and any problems call my assistance
    Contact hair-9144142055

    Customer care helpline number.
    __9144142055
    Any problems call my agent (24*7) hours available
    Contact hair
    Toll free -1800300800
    Contect hair-8167767782
    Online problem balance deducted and balance pending and any problems call my assistance
    Contact hair-914414205
    Customer care helpline number.
    __9144142055
    Any problems call my agent (24*7) hours available
    Contact hair
    Toll free -1800300800
    Contect hair-8167767782
    Online problem balance deducted and balance pending and any problems call my assistance
    Contact hair-9144142055

    ReplyDelete
  6. Thank you so much for sharing the information which is helpful to us. We have a website the knowledge in Hindi where we are sharing the informative blogs which is related in our daily life and few kinds of technical term.

    ReplyDelete
  7. Thanks a lot Bro it is a working of table of contant code Dofollow

    ReplyDelete
  8. Thanks a lot Bro it is a working of table of contant code Dofollow

    ReplyDelete
  9. working - Thanks sir for sharing good information with Us.

    ReplyDelete
  10. I think this is an informative post and it is very useful and knowledgeable. therefore, I would like to thank you for the efforts you have made in writing this article. content marketing agency

    ReplyDelete