English
About this handbook

This handbook belongs to QuartzControl version 1.1.0 and explains every one of its screens; every screen links to its page here.

How to write notes so they make good pages is in the Example handbook.

Graphansicht

1.5 – Your first site

3 Min. Lesezeit

A pass that actually works. Every step has a chapter of its own later on; here is only what to do, and in what order.

Expect one to two minutes of waiting in step 2 — that is Quartz being downloaded and its dependencies installed.

1. Have notes ready (or not)

If you already have an Obsidian vault or a folder with Markdown files: good, the path will be needed shortly. If not: also good — QuartzControl creates an empty content folder with a start page.

2. Create a project

Create new project on the start screen. The wizard asks, in order:

  1. Where should the project live? A folder that already exists, “Documents” for instance.

  2. Name of the project folder. Just the folder name — not the site’s title. Lowercase letters and hyphens are easiest. Below it QuartzControl shows which path that becomes.

  3. Quartz starter. Which example pages and starting settings Quartz brings; default is the normal starting point.

  4. Where do the notes come from? The most important question of the wizard — three answers:

    • Start fresh — an empty content folder in the project.
    • Copy existing notes — a second, independent collection comes about.
    • Point at existing notes — the content folder becomes a link to the chosen folder. Writing carries on there, in Obsidian.

    This can be changed later (see chapter 3), but getting it right saves work.

  5. How are your wikilinks written? Only for copied or linked notes. Obsidian uses the shortest form by default; if the setting does not match the notes, the links will not find their targets.

  6. Base URL. The later address, without https://. If you do not know it, leave localhost and fill it in later.

  7. Install the basic template. A finished design — measured colours for light and dark, page grids of its own, self-hosted fonts, every component styled individually, including the ones that start switched off. Worth it for a first attempt, and everything about it can be changed afterwards. The matching example pages can only be chosen when the content folder is created fresh: a template writes nothing into somebody else’s notes.

Then Create project, and wait.

3. Start the preview

After creation the path leads into the project. In the sidebar, Publishing → Preview & build, and start the server there. QuartzControl builds the site and makes it reachable at http://localhost:8080 — or at the next free port if 8080 is already taken; the page shows the address. The build output is below.

From now on: every change to a note rebuilds the page. If you linked the content folder to a vault, you write in Obsidian and watch the result in the browser.

The dev server keeps running when you leave the project — and, if you want, when you quit QuartzControl.

4. Change something

Two things that pay off immediately:

  • Setup → Configuration: the site’s title and the language of the fixed wording.
  • Design → Styles: the base colours for light and dark.

Both take effect only on Save. The running server notices and rebuilds.

5. Publishing — later

That needs a place for the site to live and the credentials to get there. How, is in chapter 6; none of it is needed to build and look at your own page locally first.

What you know now

A project is a folder. The content folder says where the notes come from. The server shows the result. Everything else in this handbook refines those three sentences.