How to Create an easy table of contents with two lines of codes?
When you are going to composing lengthier posts or articles. The users get bore reading complete articles or posts. Or a user wants to go on a certain page, Then you must insert the table of contents on your page or post. You don't know to code even, don't worry, I will explain to you to make a table of contents in an easy way. Just follow me up.
Let's create a new post and Edit it. And create a table of content and details of the post here is a demo example.
Now click on HTML view, Follow the red circle, Click on this icon.
Now click on HTML view
And After click on HTML view, and I make this code view easier by pressing the Enter key. Now illustrate the following screenshot, it is differentiating between composing and HTML content.
This is the table of content,
This is the Table of content,
These two lines are our main focus to make them clickable and go on the target link below. Now we need two lines of code to add our table of content.
Like this
<a href="#tableofcontent1" style="color: blue;"> This is the table of content </a>
<a href="#tableofcontent2" style="color: blue;"> This is the table of content </a>
Deep look at the following screenshot.
Now the last line of code: <div id="tableofcontent1"> </div>
<div id=" id should be same "> id can't be changed, if you put id name in above code, you can use the same id name. You can't change it. and at the last the closing tag of div. </div>
that's it.
To view this result, publish the post and view your blog and check your table of content.
I tried my best to explain the table of content with every single step and line of code. I thought you have zero knowledge about the codes. Whatever if you have any questions regarding this post, I will be very happy to help you. And I can make the table of content free for you. Just let me know in the comment box below. THANKS, And cheers. 😊😊
1 Comments
Thanks
ReplyDelete