• MG Creats
  • Privacy Policy
  • Terms and Conditions
  • About Us
Wednesday, May 10, 2023
  • Login
www.mgcreats.com
  • Contact
  • Business
    • Google Adsense
    • Finance
      • Make-Money_Online
    • Insurance
    • Packaging
      • cardboard boxes
      • Cosmetic boxes custom cosmetic boxes custom printed display boxes cardboard boxes
      • custom printed muffin boxes
      • customized muffin boxes
      • Muffin Boxes
      • muffin boxes wholesale
      • Pie Boxes custom pie boxes
    • Sales
  • Education
    • Animation
    • Biograpgy
    • Games
    • schools
    • universities
  • Fashion
    • Beauty
  • Health
    • Diseases
    • Food
    • Fitness
      • Yoga
    • Hospitals
    • Virus
    • Weight-Loss
  • home-And-Family
    • HelpFul
    • Photography
    • Tools
    • Travel
  • News
    • Entertainment
      • Films
    • General
    • Misc
    • Stories
    • The-Daily-Pakistan
    • Trending
    • Youtube Most Viewed Video
  • Sports
    • FootBall Schedule
  • Technology
    • Apps
    • computer
    • Crystal Reports hosting
    • Email Marketing
    • Instagram
    • Internet
      • Hosting
      • Premium Blogger Templates
    • Mobiles
      • Apple
      • iPad
      • iphone
      • nokia
      • Whatsapp
    • PDF
    • SEO
      • Keywords
    • Software
    • TechZone
    • Windows
No Result
View All Result
  • Contact
  • Business
    • Google Adsense
    • Finance
      • Make-Money_Online
    • Insurance
    • Packaging
      • cardboard boxes
      • Cosmetic boxes custom cosmetic boxes custom printed display boxes cardboard boxes
      • custom printed muffin boxes
      • customized muffin boxes
      • Muffin Boxes
      • muffin boxes wholesale
      • Pie Boxes custom pie boxes
    • Sales
  • Education
    • Animation
    • Biograpgy
    • Games
    • schools
    • universities
  • Fashion
    • Beauty
  • Health
    • Diseases
    • Food
    • Fitness
      • Yoga
    • Hospitals
    • Virus
    • Weight-Loss
  • home-And-Family
    • HelpFul
    • Photography
    • Tools
    • Travel
  • News
    • Entertainment
      • Films
    • General
    • Misc
    • Stories
    • The-Daily-Pakistan
    • Trending
    • Youtube Most Viewed Video
  • Sports
    • FootBall Schedule
  • Technology
    • Apps
    • computer
    • Crystal Reports hosting
    • Email Marketing
    • Instagram
    • Internet
      • Hosting
      • Premium Blogger Templates
    • Mobiles
      • Apple
      • iPad
      • iphone
      • nokia
      • Whatsapp
    • PDF
    • SEO
      • Keywords
    • Software
    • TechZone
    • Windows
No Result
View All Result
www.mgcreats.com
No Result
View All Result
Home Blog

How To Add Automatic Table Of Contents In Google Blogger

mgcreats by mgcreats
May 17, 2021
in Blog
0
149
SHARES
1.4k
VIEWS
Share on FacebookShare on Twitter

Table of Contents

  • How To Add Automatic Table Of Contents In Google Blogger
    • step 1
        • Search     ]]></b:skin>   code and just above it paste the following CSS code:
        • Search for <data:post.body/> and replace it with the code below:
        • Goto your blogger post. Then switch to “HTML” mode and then paste the following HTML code just before the first heading.

How To Add Automatic Table Of Contents In Google Blogger

Add Automatic Table Of Contents In Blogger Posts. Please don’t forget to Like, Share, Comment and Subscribe to our Technical MA Channel for more videos.

Add Automatic Table Of Contents In Blogger Posts

Watch Video:

code

Table Of Contents Code:

Be sure to backup the Blogger template

step 1


Copy and Paste above</head> tag in your HTML Code of Blogger

 <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>  
<script type='text/javascript'>
//<![CDATA[
//*************TOC Plugin V2.0
function mbtTOC2(){var a=1,b=0,c="";document.getElementById("post-toc").innerHTML=
document.getElementById("post-toc").innerHTML.replace(/<h([d]).*?>(.*?)</h([d]).*?>/gi,
function(d,e,f,g){return e!=g?d:(e>a?c+=new Array(e-a+1).join("<ol class='point"+a+"'>"):e<a&&(c+=new Array(a-e+1).join("</ol>
</li>")),b+=1,c+='<li><a href="#point'+b+'">'+f+"</a>",a=parseInt(e),"<h"+e+" id='point"+b+"'>"+f+"</h"+g+">")}),
a&&(c+=new Array(a+1).join("</ol>")),document.getElementById("mbtTOC2").innerHTML+=c}function mbtToggle2(){var a=document.getElementById("mbtTOC2"),b=document.getElementById("Tog");"none"===a.style.display?(a.style.
display="block",b.innerHTML="hide"):(a.style.display="none",b.innerHTML="show")}
//]]>
</script>

Search     ]]></b:skin>   code and just above it paste the following CSS code:

 /*####TOC Plugin V2.0*/  
.mbtTOC2{
border:5px solid #0008FC ;
border-radius: 10px 50px 10px 50px;
box-shadow:5px 5px 5px 5px grey;
border-style:dashed;
background-color:#ACDEFB;
color:#707037;
line-height:1.4em;
margin:30px auto;
padding:20px 30px 20px 10px;
font-family:Oswald, arial;
display: block;width: 70%;
}
.mbtTOC2 button{
background:#ACDEFB;
font-family:oswald, arial; font-size:22px;
position:relative;
outline:none;
border:none;
color:#2E2E2E;
padding:0 0 0 15px;
}
.mbtTOC2 button a {
color:#FF0313;
padding:0px 2px;
cursor:pointer;
}
.mbtTOC2 button a:hover{
text-decoration:underline;
}
.mbtTOC2 button span {
font-size:15px; margin:0px 10px;
}
.mbtTOC2 li{margin:10px 0; }
.mbtTOC2 li a {
color:#EA1414;
text-decoration:none;
font-size:18px;
text-transform:capitalize;
}
.mbtTOC2 li a:hover {
text-decoration: underline;
}
.mbtTOC2 li li {margin:14px 0px;}
.mbtTOC2 li li a{
color:#040404;
font-size:15px;
}
.mbtTOC2 ol{counter-reset:section1;list-style:none}
.mbtTOC2 ol ol{counter-reset:section2}
.mbtTOC2 ol ol ol{counter-reset:section3}
.mbtTOC2 ol ol ol ol{counter-reset:section4}
.mbtTOC2 ol ol ol ol ol{counter-reset:section5}
.mbtTOC2 li:before{content:counter(section1);counter-
increment:section1;position:relative;padding:0 8px 0 0;font-size:18px}
.mbtTOC2 li li:before{content:counter(section1) "." counter
(section2);counter-increment:section2;font-size:14px}
.mbtTOC2 li li li:before{content:counter(section1) "."counter(section2) "."
counter(section3);counter-increment:section3}
.mbtTOC2 li li li li:before{content:counter(section1) "."counter(section2) ".
"counter(section3) "." counter(section4);counter-increment:section4}
.mbtTOC2 li li li li li:before{content:counter(section1) "."counter(section2) ".
"counter(section3) "." counter(section4)"." counter(section5);counter-i
ncrement:section5}
/*
.point2 {list-style-type:lower-alpha}
.point3 {list-style-type:lower-roman}
.point4 {list-style-type:disc}
*/

Search for <data:post.body/> and replace it with the code below:

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

Goto your blogger post. Then switch to “HTML” mode and then paste the following HTML code just before the first heading.

 <div class="mbtTOC2">   
<button>Contents <span>[<a onclick="mbtToggle2()" id="Tog">hide</a>]</span></button>
<div id="mbtTOC2"></div>
</div>

5) Paste this code in the Html view of your blogger post in the last.

 <script>mbtTOC2();</script>  

NOTE: Follow the 4th and 5th steps for each post to show the table of contents in your blogger post.



Quries :
how to add automatic table of contents in google blogger,
Add Automatic Table Of Contents In Blogger Posts,
how to add table of contents in blogger,
table of content generator for blogger,
how to make table of contents in blog,
how to create table of contents in blogger post,
table of content blogger

See also  How to Build an Influencer Marketing Strategy
Previous Post

We’re Working on Setting You Up Google AdSense

Next Post

Some Highest CPC Keywords and Best Adsense Niches For Your New Blog In USA

Next Post

Some Highest CPC Keywords and Best Adsense Niches For Your New Blog In USA

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Tarkov Cheats

The Ultimate List of Escape from Tarkov Cheats: How to Gain an Unfair Advantage

May 9, 2023
handbags

Beautiful handbags that retro lovers need to have

May 4, 2023
Tips on advancing your nursing career

Tips on advancing your nursing career

March 15, 2023
Why is cultural competency important in social work, and what are the best strategies for developing it?

Why is cultural competency important in social work, and what are the best strategies for developing it?

March 1, 2023
Prioritizing self-care while getting your online nursing degree

Prioritizing self-care while getting your online nursing degree

February 23, 2023
How technology is transforming nursing and how nurses can fully leverage healthcare tech

How technology is transforming nursing and how nurses can fully leverage healthcare tech

February 14, 2023

About

www.mgcreats.com

Games

The Ultimate List of Escape from Tarkov Cheats: How to Gain an Unfair Advantage

May 9, 2023
Finance

Beautiful handbags that retro lovers need to have

May 4, 2023
Medical

Tips on advancing your nursing career

March 15, 2023
Games

The Ultimate List of Escape from Tarkov Cheats: How to Gain an Unfair Advantage

May 9, 2023
Tarkov Cheats

Escape from Tarkov is a thrilling first-person shooter game that challenges players to survive in a post-apocalyptic world filled with...

Read more
by varsha
0 Comments
  • MG Creats
  • Privacy Policy
  • Terms and Conditions
  • About Us

Copyright © 2022 All Rights Reserved | Powered by Mgcreats

No Result
View All Result
  • Contact
  • Business
    • Google Adsense
    • Finance
      • Make-Money_Online
    • Insurance
    • Packaging
      • cardboard boxes
      • Cosmetic boxes custom cosmetic boxes custom printed display boxes cardboard boxes
      • custom printed muffin boxes
      • customized muffin boxes
      • Muffin Boxes
      • muffin boxes wholesale
      • Pie Boxes custom pie boxes
    • Sales
  • Education
    • Animation
    • Biograpgy
    • Games
    • schools
    • universities
  • Fashion
    • Beauty
  • Health
    • Diseases
    • Food
    • Fitness
      • Yoga
    • Hospitals
    • Virus
    • Weight-Loss
  • home-And-Family
    • HelpFul
    • Photography
    • Tools
    • Travel
  • News
    • Entertainment
      • Films
    • General
    • Misc
    • Stories
    • The-Daily-Pakistan
    • Trending
    • Youtube Most Viewed Video
  • Sports
    • FootBall Schedule
  • Technology
    • Apps
    • computer
    • Crystal Reports hosting
    • Email Marketing
    • Instagram
    • Internet
      • Hosting
      • Premium Blogger Templates
    • Mobiles
      • Apple
      • iPad
      • iphone
      • nokia
      • Whatsapp
    • PDF
    • SEO
      • Keywords
    • Software
    • TechZone
    • Windows

Copyright © 2022 All Rights Reserved | Powered by Mgcreats

Welcome Back!

Login to your account below

Forgotten Password?

Retrieve your password

Please enter your username or email address to reset your password.

Log In