I have successfully deployed my website using hugo theme JuiceBar via github. It cost me a week and I am so delighted! My problem is: in JuiceBar developer’s demopage, there is a list of heading on the right side bar, which is built on the heading markdown order in the article.md.

However, even though I applied headings such as #, ##, and ### in my article.md, my website doesn’t show the same sidebar as the developer’s demo site. And in my VS code I can still see my headings are correctly formatted as headings in the outline section on the left, such as:

Heading 1

Heading 2

How can I fix it and create an auto-sidebar? Thank you so much!

(BTW, I am also looking for approaches to change the font size in my articles using JuiceBar, is the solution is which css section?)

Kai^^

Even though I applied headings such as # in my article.md, my website doesn’t show the same sidebar as the developer’s demo site. I expected that there should be an automatic outline side bar just like the author's page.

1 Answer

How can I fix it and create an auto-sidebar?

You probably created a 'page'. Only 'posts' have a TOC in the sidebar: