Create a Table of Contents automatically | Community
Skip to main content

Create a Table of Contents automatically

  • August 18, 2016
  • 55 replies
  • 0 views

Show first post

55 replies

  • January 25, 2021

Experiencing the same issue as Jordan with the viewport being below the linked heading.

I'm also wondering what part of the code creates the numbering (1, 1.1, 1.1.1). I'd like to remove the numbering but keep everything else as is.


Jordan21
  • January 26, 2021

@Vladan Jovic I wish I could share our community link but it's a private comm 😞

I do have some good news though... I found some script that adjusts the top of the viewport for anchor links, and it's working marvelously. I did adjust the "100" to "80" and it's perfect for us. Here's the js snippet:

 

// The function actually applying the offset
function offsetAnchor() {
  if (location.hash.length !== 0) {
    window.scrollTo(window.scrollX, window.scrollY - 100);
  }
}

// Captures click events of all <a> elements with href starting with #
$(document).on('click', 'a[href^="#"]', function(event) {
  // Click events are captured before hashchanges. Timeout
  // causes offsetAnchor to be called after the page jump.
  window.setTimeout(function() {
    offsetAnchor();
  }, 0);
});

// Set the offset when entering page with hash present in the url
window.setTimeout(offsetAnchor, 0);

Source: https://stackoverflow.com/a/17535094/6084758

btw @Anum Awan ⬆︎  that should help you! Also, I'm not seeing 1.1 or 1.11, etc. we see an "unordered list" in our community. I wonder if you're seeing numbers as a result of custom styling in your community?

 


  • January 26, 2021

Wow thanks @Jordan Dayton that works really well.

I have my TOC working with nested bullet points for each heading level. Two things I'm curious if anyone knows:

  • how to edit the code so my TOC only displays all the <h2> from the article and not the rest of the headings.
  • how to add a title like 'Table of Contents' to appear above the TOC by default.

Thank you.


  • August 24, 2021

This thread has been super helpful, so thanks everyone who has contributed.

Like @Anum Awan, I'm also wanting to add a title to the TOC - Is someone able to point us in the right direction?


Sara24
  • September 6, 2023

Do you have any updated code for this? I only found one from this article and some things seem to be outdated. Thank you!https://support.zendesk.com/hc/en-us/community/posts/4408867942298-Tip-How-to-make-a-Table-Of-Contents-TOC-For-Article-Template