1
0
mirror of https://gitlab.com/MisterBiggs/brain-quartz.git synced 2025-07-27 00:31:29 +00:00
Files
.github
content
advanced
features
Latex.md
Mermaid diagrams.md
Obsidian compatibility.md
RSS Feed.md
SPA Routing.md
backlinks.md
callouts.md
darkmode.md
folder and tag listings.md
full-text search.md
graph view.md
index.md
popover previews.md
private pages.md
recent notes.md
syntax highlighting.md
table of contents.md
upcoming features.md
wikilinks.md
images
tags
authoring content.md
build.md
configuration.md
hosting.md
index.md
layout.md
migrating from Quartz 3.md
philosophy.md
showcase.md
upgrading.md
quartz
.gitattributes
.gitignore
.npmrc
.prettierignore
.prettierrc
CODE_OF_CONDUCT.md
LICENSE.txt
README.md
globals.d.ts
index.d.ts
package-lock.json
package.json
quartz.config.ts
quartz.layout.ts
tsconfig.json
brain-quartz/content/features/table of contents.md

1.3 KiB

title, tags
title tags
Table of Contents
component
plugin/transformer

Quartz can automatically generate a table of contents from a list of headings on each page. It will also show you your current scroll position on the site by marking headings you've scrolled through with a different colour.

By default, it will show all headers from H1 (# Title) all the way to H3 (### Title) and will only show the table of contents if there is more than 1 header on the page.

[!info] This feature requires both Plugin.TableOfContents in your quartz.config.ts and Component.TableOfContents in your quartz.layout.ts to function correctly.

Customization

  • Removing table of contents: remove all instances of Plugin.TableOfContents() from quartz.config.ts. and Component.TableOfContents() from quartz.layout.ts
  • Changing the max depth: pass in a parameter to Plugin.TableOfContents({ maxDepth: 4 })
  • Changing the minimum number of entries in the Table of Contents before it renders: pass in a parameter to Plugin.TableOfContents({ minEntries: 3 })
  • Component: quartz/components/TableOfContents.tsx
  • Style:
    • Modern (default): quartz/components/styles/toc.scss
    • Legacy Quartz 3 style: quartz/components/styles/legacyToc.scss
  • Script: quartz/components/scripts/toc.inline.ts