Tola: Experimental static site ssg - friendly, powerful, UX-focused, and native-syntax driven

Showcase
,
1

A static site generator for Typst-based websites.

repo:

example-sites:
https://tola-rs.github.io/example-sites/starter

my site:
(I wrote tola-ssg simply to build my own blog, but it is designed to be general-purpose)

图片
图片1920×1377 233 KB

Tola is a powerful static blog generator focused entirely on content creation. It strives to be exceptionally friendly, deeply cares about user experience, and fully embraces Typst’s native syntax. It features seamless VDOM-based hot reloading and rkyv caching. Furthermore, it leverages “virtual packages” to express dynamic data and cross-post content passing using pure Typst syntax.

// Recent 5 posts
#import "@tola/pages:0.0.0": pages

#let posts = (pages()
  .filter(p => "/posts/" in p.permalink)
  .filter(p => p.at("date", default: none) != none)
  .sorted(key: p => p.date)
  .rev())

#let recent = posts.slice(0, calc.min(5, posts.len()))

#for post in recent {
  [- #link(post.permalink)[#post.title]]
}

// Show `pinned: true`(it is customed by you) posts in Home page
#import "@tola/pages:0.0.0": pages

#let pinned = pages().filter(p => p.at("pinned", default: false))
#let with-date = (pinned
  .filter(p => p.at("date", default: none) != none)
  .sorted(key: p => p.date)
  .rev())
#let without-date = pinned.filter(p => p.at("date", default: none) == none)

#let ordered = with-date + without-date

// Tag query helper
#import "@tola/pages:0.0.0": by-tag, by-tags, all-tags

#let tutorial = by-tag("tutorial")
#let virtual-and-tutorial = by-tags("virtual-packages", "tutorial")
#let tags = all-tags()

Files like /posts/2026-02-28-hello-world.typ can even be batch-processed to automatically set the page’s subtitle to ‘2026-02-28’ and the permalink/URL to hello-world.typ (allowing articles to be sorted by date when viewed directly in the editor). (See https://tola-rs.github.io/example-sites/starter/showcase/meta-from-filename)

  • permalink conflicts detection
  • slug, seo(rss, atom, sitemap, og-tags)
  • friendly and colorful diagnostics/hints
  • tailwind css support
    (just syntax sugar in hooks system? also hot reloading support)
  • validate command for broken links and assets
    (elements wrapped in the context cannot be detected due to some limitaion/trade-off)
  • query command for quickly display article information, or provide data to external tools

There are still many issues to resolve, but I encourage you to give it a try so I can gather feedback and iterate on the project.

1 Like