/logseq-plugin-tocgen

Generate a TOC of any page anywhere to quickly access the page's content.

Primary LanguageJavaScriptMIT LicenseMIT

logseq-plugin-tocgen

在任何地方生成任一页面/块的目录，通过它你可以快速访问页面/块内容。同时提供了滚动回页面顶部的功能。

Generate a TOC of any page/block anywhere and quickly access the page/block's content. A back to top button is also provided.

使用展示 (Usage)

场景一，动态目录 (Scenario 1, dynamic TOC)

demo

场景二，页面内目录 (Scenario 2, inline TOC)

demo

使用示例 (Examples)

为块所在的页面生成TOC。
Generate a TOC for the page where block belongs to.
{{renderer :tocgen}}
{{renderer :tocgen, [[]]}}

为某一页面创建一个TOC，可以用 "[[" 辅助查找想要的页面。
Create a TOC for a page, you can use "[[" to help find the page.
{{renderer :tocgen, pagename}}
{{renderer :tocgen, [[pagename]]}}

你也可以为某一页面块创建一个TOC，直接将块引用粘贴进来就好。
You can also create a TOC for a block, just paste its reference in.
{{renderer :tocgen, ((block-reference))}}

可以指定要生成几级。
You can specify how many levels to generate.
{{renderer :tocgen, [[]], 2}}
{{renderer :tocgen, [[pagename]], 2}}
{{renderer :tocgen, ((block-reference)), 2}}

如果你想在TOC中只包含H1-Hn这种heading，即markdown的`#`至`######`，那么你可以再通过一个参数来指定。
If you want to include only H1-Hn headings, that is, `#` to `######` in markdown,
you need to use a third argument.
{{renderer :tocgen, [[]], 1, h}}
{{renderer :tocgen, [[page name]], 1, h}}
{{renderer :tocgen, ((block-reference)), 1, h}}

如果你想生成一个随当前浏览页面变动而变动的 TOC，你可以传*作为页面名。

If you want to generate a TOC that dynamically changes according to what page you're currently working on, you can use * as page name.

{{renderer :tocgen, *}}
{{renderer :tocgen, *, 2}}
{{renderer :tocgen, *, 2, h}}

自定义样式 (Syle Customization)

你可以通过以下几个 CSS 类来自定义样式，kef-tocgen-page 对应页面，kef-tocgen-block 对应块，.kef-tocgen-active-block 对应编辑中的块。参照 Logseq 自定义样式的文档操作，将内容放在custom.css中即可。

You can customize styles using the following CSS classes, kef-tocgen-page for page, kef-tocgen-block for block, .kef-tocgen-active-block for active block. Refer to Logseq's document for how to customize styles, place your modifications in custom.css.

.kef-tocgen-page {
  cursor: pointer;
  line-height: 2;
}
.kef-tocgen-block {
  line-height: 1.7;
}
.kef-tocgen-active-block {
  font-size: 1.1em;
  font-weight: 600;
}

你也可以通过kef-tocgen-noactivepage来自定义动态 TOC（见使用示例）在没有检测到活动页面时的内容与样式。

You can also use kef-tocgen-noactivepage to customize dynamic TOC's (see Examples section above) content and style when no active page is detected.

.kef-tocgen-noactivepage::before {
  content: "🈚️";
}