forem.dev Community

loading...

Oft-forgotten feature

link2twenty profile image Andrew Bone ・3 min read

Did you know every header you make in a post is an anchor you can be linked to be it from off site or in a Table of Contents? It's a feature I don't think we show off very well and, I've just noticed, our documentation on it is wrong.

There was a request a while ago about auto generating a ToC maybe as a sidebar. Is that the sort of thing you'd find helpful, how would you imagine it looking?

[Feature Request] autogenerated table of contents #1868

sw-yx avatar
sw-yx posted on

Is your feature request related to a problem? Please describe.

Markdown header tags now have anchor tags, so we can generate tables of contents for the articles.

this encourages more browsable longer form content on dev.to.

optionally, we can make the TOC float in a sidebar.

Describe the solution you'd like

possibly use a TOC generator like https://ecotrust-canada.github.io/markdown-toc/

Describe alternatives you've considered

not doing anything

Additional context

i last filed this request here https://github.com/thepracticaldev/dev.to/issues/183 at my old job's github account. a prerequesite was adding id's on every header, which was done in Nov. its time to revisit this idea!


ToC Demo

Table of Contents

Lorem ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus magna sed odio porttitor tempus. Curabitur ac diam tempus, cursus dui at, volutpat libero. Praesent volutpat interdum arcu, et pulvinar libero eleifend quis. Fusce porta finibus tempus. Aliquam quis viverra leo. Praesent sit amet fermentum urna, vitae iaculis lacus. Vestibulum vulputate placerat consequat. Sed quis iaculis magna, ut fermentum ex. Nulla ut urna id orci consequat semper. Vestibulum non est quis ex tempor vulputate et id enim. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum vitae nisl non augue suscipit porttitor at sed metus. Quisque non sapien arcu.

Sed fringilla

Sed fringilla, arcu eu tempor consectetur, nulla tortor condimentum dui, nec pulvinar eros lorem non enim. Aliquam at eros sit amet sem egestas viverra. Curabitur euismod, nunc quis rhoncus consequat, ex turpis tristique ipsum, egestas rhoncus augue lectus eget eros. Mauris enim quam, rutrum ut luctus a, convallis eleifend dui. Mauris ornare, tellus eget volutpat cursus, risus leo pulvinar ligula, blandit suscipit ex libero non nisl. Nunc fermentum nisl quis eros consequat cursus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Suspendisse pretium risus turpis, nec condimentum ipsum sodales molestie. Vivamus rhoncus condimentum sapien, vel faucibus lorem tincidunt eu. In imperdiet ultrices mauris. Curabitur sed ante quis purus mollis gravida. Proin sed justo varius, sollicitudin arcu a, accumsan risus. Pellentesque in leo congue, ultricies purus vel, suscipit purus. Duis congue sem vitae libero semper consectetur. Nunc dignissim rutrum mollis. Integer vitae sem rutrum, ultrices orci ac, volutpat nulla.

Pellentesque turpis sapien

Pellentesque turpis sapien, iaculis ut eleifend in, scelerisque quis nunc. Donec in lectus nec nunc vulputate iaculis nec ac quam. Sed eget porta tellus. Praesent diam elit, pretium rutrum gravida a, fermentum vel nulla. Vestibulum et varius nunc, sit amet sagittis quam. In eu posuere nisi. Quisque consequat, turpis eget dapibus mattis, dolor tortor condimentum neque, sed imperdiet nulla nulla eget massa. Mauris pretium, lacus quis semper molestie, dolor quam tincidunt mi, vel finibus eros libero eu nibh. Proin vehicula viverra dolor, in pharetra nibh maximus sed. Quisque non venenatis leo. Sed eu velit sed ex fermentum tempor. Donec tristique ornare odio, nec tincidunt mi pulvinar ac. Etiam id cursus nibh, sed aliquam nisl.

Maecenas dapibus nulla dui

Maecenas dapibus nulla dui, eget aliquet libero eleifend non. Mauris auctor sapien id nulla sollicitudin, at tempor libero interdum. Integer vehicula felis id turpis blandit, quis fermentum quam sollicitudin. Quisque nec lorem quis mi cursus malesuada quis in diam. Praesent auctor augue sed nisl lobortis efficitur. Vivamus non vulputate dolor, at ultrices erat. Sed id dolor quis est bibendum bibendum sed eu quam. Nullam commodo ultrices turpis, ut sodales tortor posuere laoreet. Aliquam ut leo nec mi feugiat eleifend. Fusce ut nulla euismod, gravida nibh eget, efficitur quam. Morbi sem erat, lobortis eget imperdiet at, molestie in risus. Vivamus viverra eros iaculis erat volutpat posuere. Morbi cursus tristique feugiat.

Proin semper sodales ultrices

Proin semper sodales ultrices. Donec egestas ante a eros dictum porttitor. Morbi vulputate diam non ex consectetur sagittis. Mauris placerat euismod nibh vitae accumsan. Quisque non ex ac arcu consequat euismod sed in risus. Donec et urna mollis, consectetur mi at, ornare odio. Sed varius erat eget ullamcorper feugiat. Aenean sollicitudin consequat metus, id maximus velit placerat in. Sed porta erat velit, nec sollicitudin purus sollicitudin et. Aliquam erat volutpat. Etiam nisl sem, dignissim vel auctor vitae, imperdiet in justo.

Discussion

pic
Editor guide
Collapse
pp profile image
Paweł Ludwiczak

👍 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse mollis urna iaculis ante dapibus bibendum. Vestibulum ultricies condimentum est, ac hendrerit elit commodo vel.

Collapse
link2twenty profile image
Andrew Bone Author

Cras ut tempor massa. Aenean eu sem cursus metus vehicula semper. Vestibulum et iaculis elit, ac scelerisque nisi. Vestibulum placerat et velit vitae rhoncus. Pellentesque vitae consectetur tellus. Donec non finibus turpis, et efficitur orci. Quisque ac lectus in leo dapibus malesuada.

Lorem ipsum