# Automatically generate Table of Contents with Koenig Editor **URL:** \ **Category:** Ideas\ **Created:** [December 4, 2019, 12:28am UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624 "2019-12-04T00:28:39Z")\ **Posts on this page:** 11\ **Page:** 1
**Author:** ![MLFromScratch](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/mlfromscratch/32/2278_2.png) [@MLFromScratch](https://forum.ghost.org/u/MLFromScratch)\ **Post date:** [December 4, 2019, 12:28am UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/1 "2019-12-04T00:28:39Z")
Hey, I was just wondering if someone thought of this? This could be a simple card that you could add, along side the HTML, markdown and other cards in the Koenig Editor. Would this be something that the ghost team want in the Koenig editor? I’m open to make a contribution, I do need some guidance on where in the ghost core this should be implemented. Some basic jquery can get all the header elements and then you would just need to format the output: `$("h1, h2, h3, h4, h5, h6")` Edit: I use a table of contents for pretty much every post on my website. It’s really useful for the user and myself as well - it just makes it easier to navigate long form articles. The problem is that I can spend a good 5 minutes doing this manual task for every post, but it’s not that hard to automate. ---
**Author:** ![denvergeeks](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/denvergeeks/32/7401_2.png) [@denvergeeks](https://forum.ghost.org/u/denvergeeks)\ **Post date:** [December 5, 2019, 12:33am UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/2 "2019-12-05T00:33:43Z")
Here are some example implementations of per-page TOC: [http://pixelandkraft.com/blockster/demo/docs/#navwidget](http://pixelandkraft.com/blockster/demo/docs/#navwidget) [http://scrollnav.com](http://scrollnav.com) ---
**Author:** ![MLFromScratch](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/mlfromscratch/32/2278_2.png) [@MLFromScratch](https://forum.ghost.org/u/MLFromScratch)\ **Post date:** [December 5, 2019, 6:44pm UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/3 "2019-12-05T18:44:16Z")
Hi denvergeeks, this was not what I was looking / aiming for. The following picture is what I’m imaging, i.e. not a fixed TOC following you all the way, but a static one that you put at the top of your post. Check it out here: [https://mlfromscratch.com/web-scraping-machine-learning/#tableofcontentsclicktoscroll](https://mlfromscratch.com/web-scraping-machine-learning/#tableofcontentsclicktoscroll) ![image](https://us1.discourse-cdn.com/flex015/uploads/ghost2/original/2X/a/a350df40f85d2318a2a6bbcd234fdc9735ac6bbe.png) ---
**Author:** ![denvergeeks](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/denvergeeks/32/7401_2.png) [@denvergeeks](https://forum.ghost.org/u/denvergeeks)\ **Post date:** [December 5, 2019, 7:03pm UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/4 "2019-12-05T19:03:37Z")
Thank you for clarifying @MLFromScratch. I agree that adding an automating component to the editor itself for a TOC is a great idea. If that is implemented it would be great to provide both a fixed and a static option. ---
**Author:** ![denvergeeks](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/denvergeeks/32/7401_2.png) [@denvergeeks](https://forum.ghost.org/u/denvergeeks)\ **Post date:** [December 9, 2019, 3:43pm UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/5 "2019-12-09T15:43:25Z")
Here is a JQuery for this purpose: [http://gregfranko.com/jquery.tocify.js/](http://gregfranko.com/jquery.tocify.js/) And here is a nice Ghost theme using it: > **[GitHub - huangyuzhang/Fizzy-Theme: 🥤A tasty blogging theme for Ghost.](https://github.com/huangyuzhang/Fizzy-Theme)** > > 🥤A tasty blogging theme for Ghost. Contribute to huangyuzhang/Fizzy-Theme development by creating an account on GitHub. ---
**Author:** ![denvergeeks](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/denvergeeks/32/7401_2.png) [@denvergeeks](https://forum.ghost.org/u/denvergeeks)\ **Post date:** [December 12, 2019, 12:03am UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/6 "2019-12-12T00:03:06Z")
Here is another alternative to Tocify that does not depend on JQuery: > **[GitHub - tscanlin/tocbot: Build a table of contents from headings in an HTML...](https://github.com/tscanlin/tocbot)** > > Build a table of contents from headings in an HTML document. - GitHub - tscanlin/tocbot: Build a table of contents from headings in an HTML document. ---
**Author:** ![denvergeeks](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/denvergeeks/32/7401_2.png) [@denvergeeks](https://forum.ghost.org/u/denvergeeks)\ **Post date:** [February 15, 2020, 4:09am UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/7 "2020-02-15T04:09:23Z")
I have implemented the [tocbot](https://github.com/tscanlin/tocbot) script on an instance of the docuhub theme [https://docuhub.t2themes.com](https://docuhub.t2themes.com) ![Screenshot 2019-12-13 at 3.20.04 PM](https://us1.discourse-cdn.com/flex015/uploads/ghost2/original/2X/7/7f4c6d0c50bd33aafd8ab8017eb3dfd35636612f.jpeg) ![Screenshot 2019-12-13 at 3.19.31 PM](https://us1.discourse-cdn.com/flex015/uploads/ghost2/original/2X/1/16052965cc6d4efb2ff6d9e2391d4f33cb5db39b.jpeg) ---
**Author:** ![gregpozo](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/gregpozo/32/3395_2.png) [@gregpozo](https://forum.ghost.org/u/gregpozo)\ **Post date:** [February 16, 2020, 6:55pm UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/8 "2020-02-16T18:55:12Z")
Sounds like a good idea. In my opinion, sometimes TOCs are just distracting and kill the “excitement”, but they are handy and i agree with this idea to have the option. Voted 🙂 ---
**Author:** ![MLFromScratch](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/mlfromscratch/32/2278_2.png) [@MLFromScratch](https://forum.ghost.org/u/MLFromScratch)\ **Post date:** [February 16, 2020, 9:46pm UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/9 "2020-02-16T21:46:47Z")
It really depends on what type of website you are running. I write comprehensive articles where I teach Machine Learning, i.e. I explain certain conceps, and it’s really nice to have a roadmap for each article. ---
**Author:** ![gregpozo](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/gregpozo/32/3395_2.png) [@gregpozo](https://forum.ghost.org/u/gregpozo)\ **Post date:** [February 16, 2020, 9:58pm UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/10 "2020-02-16T21:58:17Z")
You are totally right. Having the option doesnt hurt in my opinion. Let’s see what the team thinks. ---
**Author:** ![DavidDarnes](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/daviddarnes/32/3533_2.png) [@DavidDarnes](https://forum.ghost.org/u/DavidDarnes)\ **Post date:** [February 17, 2020, 2:36pm UTC](https://forum.ghost.org/t/automatically-generate-table-of-contents-with-koenig-editor/10624/11 "2020-02-17T14:36:48Z")
Incase anyone here missed this in the other thread, I’ve written a tutorial on how to add a table of contents to their Ghost site: > [@Here is a way to do Table of Contents (ToC)](https://forum.ghost.org/t/here-is-a-way-to-do-table-of-contents-toc/5419/15): > > Hey all wave, we’ve recently put together a new tutorial to show you how to add a Table Of Contents to your Ghost site. Take a look, hope this helps: [https://ghost.org/tutorials/adding-a-table-of-contents/](https://ghost.org/tutorials/adding-a-table-of-contents/) PS. If you have any feedback let us know! [https://ghost.org/tutorials/adding-a-table-of-contents/](https://ghost.org/tutorials/adding-a-table-of-contents/)