The CSS Code for the ToC
Add the following CSS code in your theme’s stylesheet file. Alternatively, you can inject this CSS code using a custom CSS plugin like this one.
#toc_container background: #f9f9f9 none repeat scroll 0 0; border: 1px solid #aaa; display: table; font-size: 95%; margin-bottom: 1em; padding: 20px; width: auto; .toc_title font-weight: 700; text-align: center; #toc_container li, #toc_container ul, #toc_container ul li list-style: outside none none !important;
The HTML Code for the ToC
Now that the CSS code is in place, you can use simple HTML code like the following example to create a ToC in any page.
You are basically making a list of links that are in the page.
Now, assign the “id” parameter in your heading tags to connect the links from the above list. The following example shows how you can assign an “id” to any heading tags in your page.
First Point Header
That should do it.