Automatically generate Table of Contents with Koenig Editor

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.

Here are some example implementations of per-page TOC:

http://pixelandkraft.com/blockster/demo/docs/#navwidget

http://scrollnav.com

2 Likes

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

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.

Here is a JQuery for this purpose:

http://gregfranko.com/jquery.tocify.js/

And here is a nice Ghost theme using it:

2 Likes