How to Use the Table of Contents (TOC) Tool
This tool helps you quickly create a Table of Contents (TOC) for your webpage. You can paste content from either an HTML code or MS Word/website, select the headings you want to include in the TOC, and then generate both a visual TOC and the corresponding HTML code for use on your website.
1. Choose Your Content Type
You can choose between two types of content:
-
Paste HTML Code: If you already have HTML content (including headings) that you want to use, simply paste the HTML code into the field.
-
Paste MS Word or Website Content: If you have content from a Word document or a website, select and copy it, then paste it into the field. This tool will retain the formatting, including headings.
To switch between these options, select the appropriate option (either "Paste HTML Code" or "Paste MS Word or Website Content") and paste your content into the designated area.
2. Paste Your Content
Once you've selected the content type:
-
For HTML code: Paste the HTML content directly into the textarea.
-
For Word or website content: Copy the content from your Word document or website, then paste it into the textarea. The tool will preserve your headings, lists, and other formatting.
3. Select Headings for Your TOC
Once the content is pasted, you will see the list of available headings (e.g., h1, h2, h3) in the content. Choose which headings you want to include in your Table of Contents. You can select multiple headings as needed.
4. Generate the TOC
Click on the "Generate TOC" button to create the Table of Contents. You will see:
-
A Visual TOC: This is the clickable Table of Contents, where each heading links to its respective section on the page.
-
Plain HTML Code: Below the visual TOC, you will see the raw HTML code for the TOC, formatted as a list of links (<ul><li><a href="#heading">Heading Text</a></li></ul>). This code can be copied and used directly on your website.
5. Copy the HTML Code
To use the generated TOC on your website, simply copy the HTML code and paste it into the appropriate place on your webpage. The HTML code is ready to be used and will display the Table of Contents with clickable links to each heading.