-
Checklist
How did you create the site?Generated from DescriptionIs there a way to enable all h2~h6 headeres in TOC section? Operations you have already tried
Anything else?No response |
Beta Was this translation helpful? Give feedback.
Replies: 3 comments 4 replies
-
Beta Was this translation helpful? Give feedback.
-
|
Hi, thanks for replying, Since i'm using the would you like to provide more detailed guidance/refer? |
Beta Was this translation helpful? Give feedback.
-
|
@opabravo In case of Create a file !function(){
"use strict";
document.querySelector("main h2, main h3")&&tocbot.init({
tocSelector:"#toc",
contentSelector:".content",
ignoreSelector:"[data-toc-skip]",
headingSelector:"h2, h3, h4, h5, h6",
orderedList:!1,
scrollSmooth:!1
})}();Since custom scripts are being executed later, it overrides configuration successfully. However, I'm not sure this will work stable for 100%, but it seems to work. |
Beta Was this translation helpful? Give feedback.
-
|
@kungfux Perhaps I didn't make myself clear earlier. Please allow me to restate it.
I have created a file
So I followed the solution you mentioned later. I create a new file !function(){
"use strict";
document.querySelector("main h2, main h3")&&tocbot.init({
tocSelector:"#toc",
contentSelector:".content",
ignoreSelector:"[data-toc-skip]",
headingSelector:"h2, h3, h4, h5, h6",
orderedList:!1,
scrollSmooth:!1,
collapseDepth:6,
})}();I want the post to display all TOC without animation. After creating this file, and run So it seems like this method isn't effective, or perhaps I missed something. Do I need to insert Could you provide more specific details? I'm not familiar with javascript, any suggestions would be greatly appreciated. Relevent link: #1616 |
Beta Was this translation helpful? Give feedback.
-
|
@huanyushi I gave it a try and it didn't work for me either anymore. I found no changes that may break it, so I have no ideas to share at the moment. |
Beta Was this translation helpful? Give feedback.
-
|
@kungfux Thanks for your reply sincerely, maybe I should create a new discussion later. |
Beta Was this translation helpful? Give feedback.
-
|
Here is the working solution. Create a file <script type="text/javascript" src="/assets/js/toc.js" defer></script>Then, create a javascript file document.querySelector("main h2, main h3")&&tocbot.refresh({
tocSelector:"#toc",
contentSelector:".content",
ignoreSelector:"[data-toc-skip]",
headingSelector:"h2, h3, h4, h5, h6",
orderedList:!1,
scrollSmooth:!1,
collapseDepth: 6
});Here is tocbot documentation regarding available options. FYI @huanyushi @opabravo |
Beta Was this translation helpful? Give feedback.
Here is the working solution.
Create a file
_includes/metadata-hook.htmlwith the following content (this file is completely empty in Chirpy repo and is made specifically to include extra information into the<head>section without the need to modify and support other files likehead.html):Then, create a javascript file
assets/js/toc.jsto overrides TOC configuration e.g.: