| | |
| | | title: Configuration |
| | | --- |
| | | |
| | | Quartz is meant to be extremely configurable, even if you don't know any coding. Most of the configuration you should need can be done by just editing `quartz.config.ts`. |
| | | Quartz is meant to be extremely configurable, even if you don't know any coding. Most of the configuration you should need can be done by just editing `quartz.config.ts` or changing [[layout|the layout]] in `quartz.layout.ts`. |
| | | |
| | | If you edit this file using a text-editor that has TypeScript language support like VSCode, it will warn you when you you've made an error in your configuration. |
| | | > [!tip] |
| | | > If you edit Quartz configuration using a text-editor that has TypeScript language support like VSCode, it will warn you when you you've made an error in your configuration, helping you avoid configuration mistakes! |
| | | |
| | | This configuration can be broken down into two main parts: |
| | | The configuration of Quartz can be broken down into two main parts: |
| | | |
| | | ```ts |
| | | ```ts title="quartz.config.ts" |
| | | const config: QuartzConfig = { |
| | | configuration: { ... }, |
| | | plugins: { ... }, |
| | |
| | | |
| | | This part of the configuration concerns anything that can affect the whole site. The following is a list breaking down all the things you can configure: |
| | | |
| | | - `pageTitle`: used as an anchor to return to the home page. This is also used when generating the [[RSS Feed]] for your site. |
| | | - `pageTitle`: title of the site. This is also used when generating the [[RSS Feed]] for your site. |
| | | - `enableSPA`: whether to enable [[SPA Routing]] on your site. |
| | | - `enablePopovers`: whether to enable [[popover previews]] on your site. |
| | | - `analytics`: what to use for analytics on your site. Values can be |
| | | - `null`: don't use analytics; |
| | | - `{ provider: 'plausible' }`: use [Plausible](https://plausible.io/), a privacy-friendly alternative to Google Analytics; or |
| | | - `{ provider: 'google', tagId: <your-google-tag> }`: use Google Analytics |
| | | - `caononicalUrl`: sometimes called `baseURL` in other site generators. This is used for sitemaps and RSS feeds that require an absolute URL to know where the canonical 'home' of your site lives. This is normally the deployed URL of your site (e.g. `https://quartz.jzhao.xyz/` for this site). Note that Quartz 4 will avoid using this as much as possible and use relative URLs whenever it can to make sure your site works no matter _where_ you end up actually deploying it. |
| | | - `ignorePatterns`: a list of [glob](<https://en.wikipedia.org/wiki/Glob_(programming)>) patterns that Quartz should ignore and not search through when looking for files inside the `content` folder. |
| | | - `baseUrl`: this is used for sitemaps and RSS feeds that require an absolute URL to know where the canonical 'home' of your site lives. This is normally the deployed URL of your site (e.g. `quartz.jzhao.xyz` for this site). Do not include the protocol (i.e. `https://`) or any leading or trailing slashes. |
| | | - This should also include the subpath if you are [[hosting]] on GitHub pages without a custom domain. For example, if my repository is `jackyzha0/quartz`, GitHub pages would deploy to `https://jackyzha0.github.io/quartz` and the `baseUrl` would be `jackyzha0.github.io/quartz` |
| | | - Note that Quartz 4 will avoid using this as much as possible and use relative URLs whenever it can to make sure your site works no matter _where_ you end up actually deploying it. |
| | | - `ignorePatterns`: a list of [glob](<https://en.wikipedia.org/wiki/Glob_(programming)>) patterns that Quartz should ignore and not search through when looking for files inside the `content` folder. See [[private pages]] for more details. |
| | | - `theme`: configure how the site looks. |
| | | - `typography`: what fonts to use. Any font available on [Google Fonts](https://fonts.google.com/) works here. |
| | | - `header`: Font to use for headers |
| | |
| | | |
| | | You can think of Quartz plugins as a series of transformations over content. |
| | | |
| | | ![[quartz-transform-pipeline.png]] |
| | | ![[quartz transform pipeline.png]] |
| | | |
| | | ```ts |
| | | plugins: { |
| | |
| | | } |
| | | ``` |
| | | |
| | | - [[making plugins#Transformers|Transformers]] **map** over content, taking a Markdown file and outputting modified content or adding metadata to the file itself (e.g. parsing frontmatter, generating a description) |
| | | - [[making plugins#Filters|Filters]] **filter** content, taking the output of all the transformers and determining what files to actually keep and what to discord (e.g. filtering out drafts) |
| | | - [[making plugins#Emitters|Emitters]] **reduce** over content, taking in a list of all the transformed and filtered content and creating output files (e.g. creating an RSS feed or pages that list all files with a specific tag) |
| | | - [[making plugins#Transformers|Transformers]] **map** over content (e.g. parsing frontmatter, generating a description) |
| | | - [[making plugins#Filters|Filters]] **filter** content (e.g. filtering out drafts) |
| | | - [[making plugins#Emitters|Emitters]] **reduce** over content (e.g. creating an RSS feed or pages that list all files with a specific tag) |
| | | |
| | | By adding, removing, and reordering plugins from the `tranformers`, `filters`, and `emitters` fields, you can customize the behaviour of Quartz. |
| | | |
| | |
| | | ] |
| | | ``` |
| | | |
| | | ### Layout |
| | | |
| | | Certain emitters may also output [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML) files. To make sure that |
| | | |
| | | ### Components |
| | | If you'd like to make your own plugins, read the guide on [[making plugins]] for more information. |