diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml
index 56107cf49..7b70c3fb2 100644
--- a/.github/workflows/ci.yaml
+++ b/.github/workflows/ci.yaml
@@ -47,7 +47,7 @@ jobs:
         run: npx quartz build --bundleInfo
 
   publish-tag:
-    if: ${{ github.repository == 'jackyzha0/quartz' }}
+    if: ${{ github.repository == 'jackyzha0/quartz' && github.ref == 'refs/heads/v4' }}
     runs-on: ubuntu-latest
     permissions:
       contents: write
diff --git a/docs/advanced/creating components.md b/docs/advanced/creating components.md
index 27369abf2..628d5aa29 100644
--- a/docs/advanced/creating components.md	
+++ b/docs/advanced/creating components.md	
@@ -129,11 +129,11 @@ export default (() => {
     return <button id="btn">Click me</button>
   }
 
-  YourComponent.beforeDOM = `
+  YourComponent.beforeDOMLoaded = `
   console.log("hello from before the page loads!")
   `
 
-  YourComponent.afterDOM = `
+  YourComponent.afterDOMLoaded = `
   document.getElementById('btn').onclick = () => {
     alert('button clicked!')
   }
@@ -180,7 +180,7 @@ export default (() => {
     return <button id="btn">Click me</button>
   }
 
-  YourComponent.afterDOM = script
+  YourComponent.afterDOMLoaded = script
   return YourComponent
 }) satisfies QuartzComponentConstructor
 ```
diff --git a/docs/advanced/paths.md b/docs/advanced/paths.md
index 9455b9819..16f6388d1 100644
--- a/docs/advanced/paths.md
+++ b/docs/advanced/paths.md
@@ -48,4 +48,4 @@ Here are the main types of slugs with a rough description of each type of path:
 - `SimpleSlug`: cannot be relative and shouldn't have `/index` as an ending or a file extension. It _can_ however have a trailing slash to indicate a folder path.
 - `RelativeURL`: must start with `.` or `..` to indicate it's a relative URL. Shouldn't have `/index` as an ending or a file extension but can contain a trailing slash.
 
-To get a clearer picture of how these relate to each other, take a look at the path tests in `quartz/path.test.ts`.
+To get a clearer picture of how these relate to each other, take a look at the path tests in `quartz/util/path.test.ts`.
diff --git a/docs/configuration.md b/docs/configuration.md
index 6c4c92850..e97d8df96 100644
--- a/docs/configuration.md
+++ b/docs/configuration.md
@@ -31,6 +31,7 @@ This part of the configuration concerns anything that can affect the whole site.
   - `{ provider: 'goatcounter', websiteId: 'my-goatcounter-id' }` (managed) or `{ provider: 'goatcounter', websiteId: 'my-goatcounter-id', host: 'my-goatcounter-domain.com', scriptSrc: 'https://my-url.to/counter.js' }` (self-hosted) use [GoatCounter](https://goatcounter.com);
   - `{ provider: 'posthog', apiKey: '<your-posthog-project-apiKey>', host: '<your-posthog-host>' }`: use [Posthog](https://posthog.com/);
   - `{ provider: 'tinylytics', siteId: '<your-site-id>' }`: use [Tinylytics](https://tinylytics.app/);
+  - `{ provider: 'cabin' }` or `{ provider: 'cabin', host: 'https://cabin.example.com' }` (custom domain): use [Cabin](https://withcabin.com);
 - `locale`: used for [[i18n]] and date formatting
 - `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`.
diff --git a/docs/features/recent notes.md b/docs/features/recent notes.md
index 9236b7ce2..75406e504 100644
--- a/docs/features/recent notes.md	
+++ b/docs/features/recent notes.md	
@@ -9,6 +9,7 @@ Quartz can generate a list of recent notes based on some filtering and sorting c
 
 - Changing the title from "Recent notes": pass in an additional parameter to `Component.RecentNotes({ title: "Recent writing" })`
 - Changing the number of recent notes: pass in an additional parameter to `Component.RecentNotes({ limit: 5 })`
+- Display the note's tags (defaults to true): `Component.RecentNotes({ showTags: false })`
 - Show a 'see more' link: pass in an additional parameter to `Component.RecentNotes({ linkToMore: "tags/components" })`. This field should be a full slug to a page that exists.
 - Customize filtering: pass in an additional parameter to `Component.RecentNotes({ filter: someFilterFunction })`. The filter function should be a function that has the signature `(f: QuartzPluginData) => boolean`.
 - Customize sorting: pass in an additional parameter to `Component.RecentNotes({ sort: someSortFunction })`. By default, Quartz will sort by date and then tie break lexographically. The sort function should be a function that has the signature `(f1: QuartzPluginData, f2: QuartzPluginData) => number`. See `byDateAndAlphabetical` in `quartz/components/PageList.tsx` for an example.
diff --git a/docs/features/syntax highlighting.md b/docs/features/syntax highlighting.md
index 16fef2575..bf9baaeee 100644
--- a/docs/features/syntax highlighting.md	
+++ b/docs/features/syntax highlighting.md	
@@ -95,6 +95,16 @@ const [age, setAge] = useState(50)
 const [name, setName] = useState("Taylor")
 ```
 
+### Inline Highlighting
+
+Append {:lang} to the end of inline code to highlight it like a regular code block.
+
+```
+This is an array `[1, 2, 3]{:js}` of numbers 1 through 3.
+```
+
+This is an array `[1, 2, 3]{:js}` of numbers 1 through 3.
+
 ### Line numbers
 
 Syntax highlighting has line numbers configured automatically. If you want to start line numbers at a specific number, use `showLineNumbers{number}`:
diff --git a/docs/showcase.md b/docs/showcase.md
index c33f34c8e..9cff3a5f7 100644
--- a/docs/showcase.md
+++ b/docs/showcase.md
@@ -28,5 +28,6 @@ Want to see what Quartz can do? Here are some cool community gardens:
 - [🪴Aster's notebook](https://notes.asterhu.com)
 - [🥷🏻🌳🍃 Computer Science & Thinkering Garden](https://notes.yxy.ninja)
 - [A Pattern Language - Christopher Alexander (Architecture)](https://patternlanguage.cc/)
+- [Gatekeeper Wiki](https://www.gatekeeper.wiki)
 
 If you want to see your own on here, submit a [Pull Request adding yourself to this file](https://github.com/jackyzha0/quartz/blob/v4/docs/showcase.md)!
diff --git a/package-lock.json b/package-lock.json
index 0b04e666c..41ac253a2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,7 +10,7 @@
       "license": "MIT",
       "dependencies": {
         "@clack/prompts": "^0.7.0",
-        "@floating-ui/dom": "^1.6.3",
+        "@floating-ui/dom": "^1.6.5",
         "@napi-rs/simple-git": "0.1.16",
         "async-mutex": "^0.5.0",
         "chalk": "^5.3.0",
@@ -32,8 +32,8 @@
         "mdast-util-to-hast": "^13.1.0",
         "mdast-util-to-string": "^4.0.0",
         "micromorph": "^0.4.5",
-        "preact": "^10.20.1",
-        "preact-render-to-string": "^6.4.2",
+        "preact": "^10.22.0",
+        "preact-render-to-string": "^6.5.5",
         "pretty-bytes": "^6.1.1",
         "pretty-time": "^1.1.0",
         "reading-time": "^1.5.0",
@@ -41,7 +41,7 @@
         "rehype-citation": "^2.0.0",
         "rehype-katex": "^7.0.0",
         "rehype-mathjax": "^6.0.0",
-        "rehype-pretty-code": "^0.13.0",
+        "rehype-pretty-code": "^0.13.2",
         "rehype-raw": "^7.0.0",
         "rehype-slug": "^6.0.0",
         "remark": "^15.0.1",
@@ -53,17 +53,17 @@
         "remark-rehype": "^11.1.0",
         "remark-smartypants": "^2.1.0",
         "rfdc": "^1.3.1",
-        "rimraf": "^5.0.5",
+        "rimraf": "^5.0.7",
         "serve-handler": "^6.1.5",
-        "shiki": "^1.2.3",
+        "shiki": "^1.6.0",
         "source-map-support": "^0.5.21",
         "to-vfile": "^8.0.0",
         "toml": "^3.0.0",
         "unified": "^11.0.4",
         "unist-util-visit": "^5.0.0",
         "vfile": "^6.0.1",
-        "workerpool": "^9.1.1",
-        "ws": "^8.15.1",
+        "workerpool": "^9.1.2",
+        "ws": "^8.17.1",
         "yargs": "^17.7.2"
       },
       "bin": {
@@ -80,8 +80,8 @@
         "@types/ws": "^8.5.10",
         "@types/yargs": "^17.0.32",
         "esbuild": "^0.19.9",
-        "prettier": "^3.2.4",
-        "tsx": "^4.9.3",
+        "prettier": "^3.3.2",
+        "tsx": "^4.11.2",
         "typescript": "^5.4.5"
       },
       "engines": {
@@ -563,9 +563,9 @@
       }
     },
     "node_modules/@floating-ui/dom": {
-      "version": "1.6.3",
-      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.3.tgz",
-      "integrity": "sha512-RnDthu3mzPlQ31Ss/BTwQ1zjzIhr3lk1gZB1OC56h/1vEtaXkESrOqL5fQVMfXpwGtRwX+YsZBdyHtJMQnkArw==",
+      "version": "1.6.5",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.5.tgz",
+      "integrity": "sha512-Nsdud2X65Dz+1RHjAIP0t8z5e2ff/IRbei6BqFrl1urT8sDVzM1HMQ+R0XcU5ceRfyO3I6ayeqIfh+6Wb8LGTw==",
       "dependencies": {
         "@floating-ui/core": "^1.0.0",
         "@floating-ui/utils": "^0.2.0"
@@ -820,9 +820,9 @@
       }
     },
     "node_modules/@shikijs/core": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/@shikijs/core/-/core-1.2.3.tgz",
-      "integrity": "sha512-SM+aiQVaEK2P53dEcsvhq9+LJPr0rzwezHbMQhHaSrPN4OlOB4vp1qTdhVEKfMg6atdq8s9ZotWW/CSCzWftwg=="
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@shikijs/core/-/core-1.6.0.tgz",
+      "integrity": "sha512-NIEAi5U5R7BLkbW1pG/ZKu3eb1lzc3/+jD0lFsuxMT7zjaf9bbNwdNyMr7zh/Zl8EXQtQ+MYBAt5G+JLu+5DlA=="
     },
     "node_modules/@sindresorhus/merge-streams": {
       "version": "2.3.0",
@@ -2432,9 +2432,9 @@
       }
     },
     "node_modules/get-tsconfig": {
-      "version": "4.7.4",
-      "resolved": "https://registry.npmjs.org/get-tsconfig/-/get-tsconfig-4.7.4.tgz",
-      "integrity": "sha512-ofbkKj+0pjXjhejr007J/fLf+sW+8H7K5GCm+msC8q3IpvgjobpyPqSRFemNyIMxklC0zeJpi7VDFna19FacvQ==",
+      "version": "4.7.5",
+      "resolved": "https://registry.npmjs.org/get-tsconfig/-/get-tsconfig-4.7.5.tgz",
+      "integrity": "sha512-ZCuZCnlqNzjb4QprAzXKdpp/gh6KTxSJuw3IBsPnV/7fV4NxC9ckB+vPTt8w7fJA0TaSD7c55BR47JD6MEDyDw==",
       "dev": true,
       "dependencies": {
         "resolve-pkg-maps": "^1.0.0"
@@ -4696,29 +4696,26 @@
       }
     },
     "node_modules/preact": {
-      "version": "10.20.1",
-      "resolved": "https://registry.npmjs.org/preact/-/preact-10.20.1.tgz",
-      "integrity": "sha512-JIFjgFg9B2qnOoGiYMVBtrcFxHqn+dNXbq76bVmcaHYJFYR4lW67AOcXgAYQQTDYXDOg/kTZrKPNCdRgJ2UJmw==",
+      "version": "10.22.0",
+      "resolved": "https://registry.npmjs.org/preact/-/preact-10.22.0.tgz",
+      "integrity": "sha512-RRurnSjJPj4rp5K6XoP45Ui33ncb7e4H7WiOHVpjbkvqvA3U+N8Z6Qbo0AE6leGYBV66n8EhEaFixvIu3SkxFw==",
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/preact"
       }
     },
     "node_modules/preact-render-to-string": {
-      "version": "6.4.2",
-      "resolved": "https://registry.npmjs.org/preact-render-to-string/-/preact-render-to-string-6.4.2.tgz",
-      "integrity": "sha512-Sio5SvlyZSAXHuvnMgYzVQd67lNIuQe4uSjJ+2gfpJNC6L8zoHQR5xV7B/EjIqrAYWVyJ2eACkTCxVrIzZi6Vw==",
-      "dependencies": {
-        "pretty-format": "^3.8.0"
-      },
+      "version": "6.5.5",
+      "resolved": "https://registry.npmjs.org/preact-render-to-string/-/preact-render-to-string-6.5.5.tgz",
+      "integrity": "sha512-KiMFTKNTmT/ccE79BURR/r6XRc2I2TCTZ0MpeWqHW2XnllbeghXvwGsdAfF/MzMilUcTfODtSmMxgoRFL9TM5g==",
       "peerDependencies": {
         "preact": ">=10"
       }
     },
     "node_modules/prettier": {
-      "version": "3.2.4",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.2.4.tgz",
-      "integrity": "sha512-FWu1oLHKCrtpO1ypU6J0SbK2d9Ckwysq6bHj/uaCP26DxrPpppCLQRGVuqAxSTvhF00AcvDRyYrLNW7ocBhFFQ==",
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.2.tgz",
+      "integrity": "sha512-rAVeHYMcv8ATV5d508CFdn+8/pHPpXeIid1DdrPwXnaAdH7cqjVbpJaT5eq4yRAFU/lsbwYwSF/n5iNrdJHPQA==",
       "dev": true,
       "bin": {
         "prettier": "bin/prettier.cjs"
@@ -4741,11 +4738,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/pretty-format": {
-      "version": "3.8.0",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-3.8.0.tgz",
-      "integrity": "sha512-WuxUnVtlWL1OfZFQFuqvnvs6MiAGk9UNsBostyBOB0Is9wb5uRESevA6rnl/rkksXaGX3GzZhPup5d6Vp1nFew=="
-    },
     "node_modules/pretty-time": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/pretty-time/-/pretty-time-1.1.0.tgz",
@@ -4971,9 +4963,9 @@
       }
     },
     "node_modules/rehype-pretty-code": {
-      "version": "0.13.0",
-      "resolved": "https://registry.npmjs.org/rehype-pretty-code/-/rehype-pretty-code-0.13.0.tgz",
-      "integrity": "sha512-+22dz1StXlF7dlMyOySNaVxgcGhMI4BCxq0JxJJPWYGiKsI6cu5jyuIKGHXHvH18D8sv1rdKtvsY9UEfN3++SQ==",
+      "version": "0.13.2",
+      "resolved": "https://registry.npmjs.org/rehype-pretty-code/-/rehype-pretty-code-0.13.2.tgz",
+      "integrity": "sha512-F+PaFMscfJOcSHcR2b//+hk/0jT56hmGDqXcVD6VC9j0CUSGiqv8YxaWUyhR7qEIRRSbzAVxx+0uxzk+akXs+w==",
       "dependencies": {
         "@types/hast": "^3.0.4",
         "hast-util-to-string": "^3.0.0",
@@ -4986,7 +4978,7 @@
         "node": ">=18"
       },
       "peerDependencies": {
-        "shiki": "^1.0.0"
+        "shiki": "^1.3.0"
       }
     },
     "node_modules/rehype-raw": {
@@ -5419,9 +5411,9 @@
       "integrity": "sha512-r5a3l5HzYlIC68TpmYKlxWjmOP6wiPJ1vWv2HeLhNsRZMrCkxeqxiHlQ21oXmQ4F3SiryXBHhAD7JZqvOJjFmg=="
     },
     "node_modules/rimraf": {
-      "version": "5.0.5",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-5.0.5.tgz",
-      "integrity": "sha512-CqDakW+hMe/Bz202FPEymy68P+G50RfMQK+Qo5YUqc9SPipvbGjCGKd0RSKEelbsfQuw3g5NZDSrlZZAJurH1A==",
+      "version": "5.0.7",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-5.0.7.tgz",
+      "integrity": "sha512-nV6YcJo5wbLW77m+8KjH8aB/7/rxQy9SZ0HY5shnwULfS+9nmTtVXAJET5NdZmCzA4fPI/Hm1wo/Po/4mopOdg==",
       "dependencies": {
         "glob": "^10.3.7"
       },
@@ -5429,7 +5421,7 @@
         "rimraf": "dist/esm/bin.mjs"
       },
       "engines": {
-        "node": ">=14"
+        "node": ">=14.18"
       },
       "funding": {
         "url": "https://github.com/sponsors/isaacs"
@@ -5571,11 +5563,11 @@
       }
     },
     "node_modules/shiki": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/shiki/-/shiki-1.2.3.tgz",
-      "integrity": "sha512-+v7lO5cJMeV2N2ySK4l+51YX3wTh5I49SLjAOs1ch1DbUfeEytU1Ac9KaZPoZJCVBGycDZ09OBQN5nbcPFc5FQ==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/shiki/-/shiki-1.6.0.tgz",
+      "integrity": "sha512-P31ROeXcVgW/k3Z+vUUErcxoTah7ZRaimctOpzGuqAntqnnSmx1HOsvnbAB8Z2qfXPRhw61yptAzCsuKOhTHwQ==",
       "dependencies": {
-        "@shikijs/core": "1.2.3"
+        "@shikijs/core": "1.6.0"
       }
     },
     "node_modules/signal-exit": {
@@ -5903,13 +5895,13 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/tsx": {
-      "version": "4.9.3",
-      "resolved": "https://registry.npmjs.org/tsx/-/tsx-4.9.3.tgz",
-      "integrity": "sha512-czVbetlILiyJZI5zGlj2kw9vFiSeyra9liPD4nG+Thh4pKTi0AmMEQ8zdV/L2xbIVKrIqif4sUNrsMAOksx9Zg==",
+      "version": "4.11.2",
+      "resolved": "https://registry.npmjs.org/tsx/-/tsx-4.11.2.tgz",
+      "integrity": "sha512-V5DL5v1BuItjsQ2FN9+4OjR7n5cr8hSgN+VGmm/fd2/0cgQdBIWHcQ3bFYm/5ZTmyxkTDBUIaRuW2divgfPe0A==",
       "dev": true,
       "dependencies": {
         "esbuild": "~0.20.2",
-        "get-tsconfig": "^4.7.3"
+        "get-tsconfig": "^4.7.5"
       },
       "bin": {
         "tsx": "dist/cli.mjs"
@@ -6731,9 +6723,9 @@
       "integrity": "sha512-Gd9+TUn5nXdwj/hFsPVx5cuHHiF5Bwuc30jZ4+ronF1qHK5O7HD0sgmXWSEgwKquT3ClLoKPVbO6qGwVwLzvAw=="
     },
     "node_modules/workerpool": {
-      "version": "9.1.1",
-      "resolved": "https://registry.npmjs.org/workerpool/-/workerpool-9.1.1.tgz",
-      "integrity": "sha512-EFoFTSEo9m4V4wNrwzVRjxnf/E/oBpOzcI/R5CIugJhl9RsCiq525rszo4AtqcjQQoqFdu2E3H82AnbtpaQHvg=="
+      "version": "9.1.2",
+      "resolved": "https://registry.npmjs.org/workerpool/-/workerpool-9.1.2.tgz",
+      "integrity": "sha512-5wZwyy5lcqrakQQcjaYQgVCbMR3djwIFWXuD2EGk/o/9bL3bd2kRGNwF74Bhcf1CIkAIwoOMG82EVnA5JmVVNw=="
     },
     "node_modules/wrap-ansi": {
       "version": "8.1.0",
@@ -6817,9 +6809,9 @@
       }
     },
     "node_modules/ws": {
-      "version": "8.16.0",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz",
-      "integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==",
+      "version": "8.17.1",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.1.tgz",
+      "integrity": "sha512-6XQFvXTkbfUOZOKKILFG1PDK2NDQs4azKQl26T0YS5CxqWLgXajbPZ+h4gZekJyRqFU8pvnbAbbs/3TgRPy+GQ==",
       "engines": {
         "node": ">=10.0.0"
       },
diff --git a/package.json b/package.json
index db20bd169..64604588a 100644
--- a/package.json
+++ b/package.json
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@clack/prompts": "^0.7.0",
-    "@floating-ui/dom": "^1.6.3",
+    "@floating-ui/dom": "^1.6.5",
     "@napi-rs/simple-git": "0.1.16",
     "async-mutex": "^0.5.0",
     "chalk": "^5.3.0",
@@ -58,8 +58,8 @@
     "mdast-util-to-hast": "^13.1.0",
     "mdast-util-to-string": "^4.0.0",
     "micromorph": "^0.4.5",
-    "preact": "^10.20.1",
-    "preact-render-to-string": "^6.4.2",
+    "preact": "^10.22.0",
+    "preact-render-to-string": "^6.5.5",
     "pretty-bytes": "^6.1.1",
     "pretty-time": "^1.1.0",
     "reading-time": "^1.5.0",
@@ -67,7 +67,7 @@
     "rehype-citation": "^2.0.0",
     "rehype-katex": "^7.0.0",
     "rehype-mathjax": "^6.0.0",
-    "rehype-pretty-code": "^0.13.0",
+    "rehype-pretty-code": "^0.13.2",
     "rehype-raw": "^7.0.0",
     "rehype-slug": "^6.0.0",
     "remark": "^15.0.1",
@@ -79,17 +79,17 @@
     "remark-rehype": "^11.1.0",
     "remark-smartypants": "^2.1.0",
     "rfdc": "^1.3.1",
-    "rimraf": "^5.0.5",
+    "rimraf": "^5.0.7",
     "serve-handler": "^6.1.5",
-    "shiki": "^1.2.3",
+    "shiki": "^1.6.0",
     "source-map-support": "^0.5.21",
     "to-vfile": "^8.0.0",
     "toml": "^3.0.0",
     "unified": "^11.0.4",
     "unist-util-visit": "^5.0.0",
     "vfile": "^6.0.1",
-    "workerpool": "^9.1.1",
-    "ws": "^8.15.1",
+    "workerpool": "^9.1.2",
+    "ws": "^8.17.1",
     "yargs": "^17.7.2"
   },
   "devDependencies": {
@@ -103,8 +103,8 @@
     "@types/ws": "^8.5.10",
     "@types/yargs": "^17.0.32",
     "esbuild": "^0.19.9",
-    "prettier": "^3.2.4",
-    "tsx": "^4.9.3",
+    "prettier": "^3.3.2",
+    "tsx": "^4.11.2",
     "typescript": "^5.4.5"
   }
 }
diff --git a/quartz.config.ts b/quartz.config.ts
index a41e27d2f..37c4360c7 100644
--- a/quartz.config.ts
+++ b/quartz.config.ts
@@ -56,7 +56,6 @@ const config: QuartzConfig = {
       Plugin.CreatedModifiedDate({
         priority: ["frontmatter", "filesystem"],
       }),
-      Plugin.Latex({ renderEngine: "katex" }),
       Plugin.SyntaxHighlighting({
         theme: {
           light: "github-light",
@@ -69,6 +68,7 @@ const config: QuartzConfig = {
       Plugin.TableOfContents(),
       Plugin.CrawlLinks({ markdownLinkResolution: "shortest" }),
       Plugin.Description(),
+      Plugin.Latex({ renderEngine: "katex" }),
     ],
     filters: [Plugin.RemoveDrafts()],
     emitters: [
diff --git a/quartz/cfg.ts b/quartz/cfg.ts
index 13fb51668..574ceb18a 100644
--- a/quartz/cfg.ts
+++ b/quartz/cfg.ts
@@ -34,6 +34,10 @@ export type Analytics =
       provider: "tinylytics"
       siteId: string
     }
+  | {
+      provider: "cabin"
+      host?: string
+    }
 
 export interface GlobalConfiguration {
   pageTitle: string
diff --git a/quartz/components/ExplorerNode.tsx b/quartz/components/ExplorerNode.tsx
index 2968a03e9..e57d67715 100644
--- a/quartz/components/ExplorerNode.tsx
+++ b/quartz/components/ExplorerNode.tsx
@@ -168,10 +168,8 @@ export function ExplorerNode({ node, opts, fullPath, fileData }: ExplorerNodePro
   const isDefaultOpen = opts.folderDefaultState === "open"
 
   // Calculate current folderPath
-  let folderPath = ""
-  if (node.name !== "") {
-    folderPath = joinSegments(fullPath ?? "", node.name)
-  }
+  const folderPath = node.name !== "" ? joinSegments(fullPath ?? "", node.name) : ""
+  const href = resolveRelative(fileData.slug!, folderPath as SimpleSlug) + "/"
 
   return (
     <>
@@ -205,11 +203,7 @@ export function ExplorerNode({ node, opts, fullPath, fileData }: ExplorerNodePro
               {/* render <a> tag if folderBehavior is "link", otherwise render <button> with collapse click event */}
               <div key={node.name} data-folderpath={folderPath}>
                 {folderBehavior === "link" ? (
-                  <a
-                    href={resolveRelative(fileData.slug!, folderPath as SimpleSlug)}
-                    data-for={node.name}
-                    class="folder-title"
-                  >
+                  <a href={href} data-for={node.name} class="folder-title">
                     {node.displayName}
                   </a>
                 ) : (
diff --git a/quartz/components/RecentNotes.tsx b/quartz/components/RecentNotes.tsx
index d99878db9..2c32feadf 100644
--- a/quartz/components/RecentNotes.tsx
+++ b/quartz/components/RecentNotes.tsx
@@ -12,6 +12,7 @@ interface Options {
   title?: string
   limit: number
   linkToMore: SimpleSlug | false
+  showTags: boolean
   filter: (f: QuartzPluginData) => boolean
   sort: (f1: QuartzPluginData, f2: QuartzPluginData) => number
 }
@@ -19,6 +20,7 @@ interface Options {
 const defaultOptions = (cfg: GlobalConfiguration): Options => ({
   limit: 3,
   linkToMore: false,
+  showTags: true,
   filter: () => true,
   sort: byDateAndAlphabetical(cfg),
 })
@@ -56,18 +58,20 @@ export default ((userOpts?: Partial<Options>) => {
                       <Date date={getDate(cfg, page)!} locale={cfg.locale} />
                     </p>
                   )}
-                  <ul class="tags">
-                    {tags.map((tag) => (
-                      <li>
-                        <a
-                          class="internal tag-link"
-                          href={resolveRelative(fileData.slug!, `tags/${tag}` as FullSlug)}
-                        >
-                          {tag}
-                        </a>
-                      </li>
-                    ))}
-                  </ul>
+                  {opts.showTags && (
+                    <ul class="tags">
+                      {tags.map((tag) => (
+                        <li>
+                          <a
+                            class="internal tag-link"
+                            href={resolveRelative(fileData.slug!, `tags/${tag}` as FullSlug)}
+                          >
+                            {tag}
+                          </a>
+                        </li>
+                      ))}
+                    </ul>
+                  )}
                 </div>
               </li>
             )
diff --git a/quartz/components/pages/404.tsx b/quartz/components/pages/404.tsx
index 4ef1b912c..63da2c88a 100644
--- a/quartz/components/pages/404.tsx
+++ b/quartz/components/pages/404.tsx
@@ -2,10 +2,15 @@ import { i18n } from "../../i18n"
 import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } from "../types"
 
 const NotFound: QuartzComponent = ({ cfg }: QuartzComponentProps) => {
+  // If baseUrl contains a pathname after the domain, use this as the home link
+  const url = new URL(`https://${cfg.baseUrl ?? "example.com"}`)
+  const baseDir = url.pathname
+
   return (
     <article class="popover-hint">
       <h1>404</h1>
       <p>{i18n(cfg.locale).pages.error.notFound}</p>
+      <a href={baseDir}>{i18n(cfg.locale).pages.error.home}</a>
     </article>
   )
 }
diff --git a/quartz/components/scripts/graph.inline.ts b/quartz/components/scripts/graph.inline.ts
index 1c9bb5d64..1a4140b48 100644
--- a/quartz/components/scripts/graph.inline.ts
+++ b/quartz/components/scripts/graph.inline.ts
@@ -223,6 +223,18 @@ async function renderGraph(container: string, fullSlug: FullSlug) {
           .transition()
           .duration(200)
           .style("opacity", 0.2)
+
+        d3.selectAll<HTMLElement, NodeData>(".node")
+          .filter((d) => !connectedNodes.includes(d.id))
+          .nodes()
+          .map((it) => d3.select(it.parentNode as HTMLElement).select("text"))
+          .forEach((it) => {
+            let opacity = parseFloat(it.style("opacity"))
+            it.transition()
+              .duration(200)
+              .attr("opacityOld", opacity)
+              .style("opacity", Math.min(opacity, 0.2))
+          })
       }
 
       // highlight links
@@ -245,6 +257,12 @@ async function renderGraph(container: string, fullSlug: FullSlug) {
       if (focusOnHover) {
         d3.selectAll<HTMLElement, NodeData>(".link").transition().duration(200).style("opacity", 1)
         d3.selectAll<HTMLElement, NodeData>(".node").transition().duration(200).style("opacity", 1)
+
+        d3.selectAll<HTMLElement, NodeData>(".node")
+          .filter((d) => !connectedNodes.includes(d.id))
+          .nodes()
+          .map((it) => d3.select(it.parentNode as HTMLElement).select("text"))
+          .forEach((it) => it.transition().duration(200).style("opacity", it.attr("opacityOld")))
       }
       const currentId = d.id
       const linkNodes = d3
@@ -264,6 +282,13 @@ async function renderGraph(container: string, fullSlug: FullSlug) {
     // @ts-ignore
     .call(drag(simulation))
 
+  // make tags hollow circles
+  node
+    .filter((d) => d.id.startsWith("tags/"))
+    .attr("stroke", color)
+    .attr("stroke-width", 2)
+    .attr("fill", "var(--light)")
+
   // draw labels
   const labels = graphNode
     .append("text")
@@ -336,7 +361,7 @@ function renderGlobalGraph() {
 
 document.addEventListener("nav", async (e: CustomEventMap["nav"]) => {
   const slug = e.detail.url
-  addToVisited(slug)
+  addToVisited(simplifySlug(slug))
   await renderGraph("graph-container", slug)
 
   const containerIcon = document.getElementById("global-graph-icon")
diff --git a/quartz/components/styles/listPage.scss b/quartz/components/styles/listPage.scss
index c8fc9e957..d51568dc0 100644
--- a/quartz/components/styles/listPage.scss
+++ b/quartz/components/styles/listPage.scss
@@ -11,7 +11,7 @@ li.section-li {
 
   & > .section {
     display: grid;
-    grid-template-columns: 6em 3fr 1fr;
+    grid-template-columns: fit-content(8em) 3fr 1fr;
 
     @media all and (max-width: $mobileBreakpoint) {
       & > .tags {
@@ -24,8 +24,7 @@ li.section-li {
     }
 
     & > .meta {
-      margin: 0;
-      flex-basis: 6em;
+      margin: 0 1em 0 0;
       opacity: 0.6;
     }
   }
@@ -33,7 +32,8 @@ li.section-li {
 
 // modifications in popover context
 .popover .section {
-  grid-template-columns: 6em 1fr !important;
+  grid-template-columns: fit-content(8em) 1fr !important;
+
   & > .tags {
     display: none;
   }
diff --git a/quartz/i18n/index.ts b/quartz/i18n/index.ts
index 9a86d6108..eab1f1a78 100644
--- a/quartz/i18n/index.ts
+++ b/quartz/i18n/index.ts
@@ -16,6 +16,7 @@ import vi from "./locales/vi-VN"
 import pt from "./locales/pt-BR"
 import hu from "./locales/hu-HU"
 import fa from "./locales/fa-IR"
+import pl from "./locales/pl-PL"
 
 export const TRANSLATIONS = {
   "en-US": en,
@@ -56,6 +57,7 @@ export const TRANSLATIONS = {
   "pt-BR": pt,
   "hu-HU": hu,
   "fa-IR": fa,
+  "pl-PL": pl,
 } as const
 
 export const defaultTranslation = "en-US"
diff --git a/quartz/i18n/locales/ar-SA.ts b/quartz/i18n/locales/ar-SA.ts
index f7048103f..8463e2ff5 100644
--- a/quartz/i18n/locales/ar-SA.ts
+++ b/quartz/i18n/locales/ar-SA.ts
@@ -70,6 +70,7 @@ export default {
     error: {
       title: "غير موجود",
       notFound: "إما أن هذه الصفحة خاصة أو غير موجودة.",
+      home: "العوده للصفحة الرئيسية",
     },
     folderContent: {
       folder: "مجلد",
diff --git a/quartz/i18n/locales/de-DE.ts b/quartz/i18n/locales/de-DE.ts
index 64c9ba9df..023d4be33 100644
--- a/quartz/i18n/locales/de-DE.ts
+++ b/quartz/i18n/locales/de-DE.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "Nicht gefunden",
       notFound: "Diese Seite ist entweder nicht öffentlich oder existiert nicht.",
+      home: "Return to Homepage",
     },
     folderContent: {
       folder: "Ordner",
diff --git a/quartz/i18n/locales/definition.ts b/quartz/i18n/locales/definition.ts
index 1d5d3dda6..25a8cd7f2 100644
--- a/quartz/i18n/locales/definition.ts
+++ b/quartz/i18n/locales/definition.ts
@@ -67,6 +67,7 @@ export interface Translation {
     error: {
       title: string
       notFound: string
+      home: string
     }
     folderContent: {
       folder: string
diff --git a/quartz/i18n/locales/en-US.ts b/quartz/i18n/locales/en-US.ts
index ac283fdaf..22cf31e01 100644
--- a/quartz/i18n/locales/en-US.ts
+++ b/quartz/i18n/locales/en-US.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "Not Found",
       notFound: "Either this page is private or doesn't exist.",
+      home: "Return to Homepage",
     },
     folderContent: {
       folder: "Folder",
diff --git a/quartz/i18n/locales/es-ES.ts b/quartz/i18n/locales/es-ES.ts
index 37a2a79c7..8b0adcc37 100644
--- a/quartz/i18n/locales/es-ES.ts
+++ b/quartz/i18n/locales/es-ES.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "No se encontró.",
       notFound: "Esta página es privada o no existe.",
+      home: "Regresar a la página principal",
     },
     folderContent: {
       folder: "Carpeta",
diff --git a/quartz/i18n/locales/fa-IR.ts b/quartz/i18n/locales/fa-IR.ts
index 6ea773026..5bfef5aee 100644
--- a/quartz/i18n/locales/fa-IR.ts
+++ b/quartz/i18n/locales/fa-IR.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "یافت نشد",
       notFound: "این صفحه یا خصوصی است یا وجود ندارد",
+      home: "بازگشت به صفحه اصلی",
     },
     folderContent: {
       folder: "پوشه",
diff --git a/quartz/i18n/locales/fr-FR.ts b/quartz/i18n/locales/fr-FR.ts
index e1dfa48b7..ef43fa876 100644
--- a/quartz/i18n/locales/fr-FR.ts
+++ b/quartz/i18n/locales/fr-FR.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "Introuvable",
       notFound: "Cette page est soit privée, soit elle n'existe pas.",
+      home: "Retour à la page d'accueil",
     },
     folderContent: {
       folder: "Dossier",
diff --git a/quartz/i18n/locales/hu-HU.ts b/quartz/i18n/locales/hu-HU.ts
index 6397309b7..066b7770e 100644
--- a/quartz/i18n/locales/hu-HU.ts
+++ b/quartz/i18n/locales/hu-HU.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "Nem található",
       notFound: "Ez a lap vagy privát vagy nem létezik.",
+      home: "Vissza a kezdőlapra",
     },
     folderContent: {
       folder: "Mappa",
diff --git a/quartz/i18n/locales/it-IT.ts b/quartz/i18n/locales/it-IT.ts
index ca8818a65..c8c597352 100644
--- a/quartz/i18n/locales/it-IT.ts
+++ b/quartz/i18n/locales/it-IT.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "Non trovato",
       notFound: "Questa pagina è privata o non esiste.",
+      home: "Ritorna alla home page",
     },
     folderContent: {
       folder: "Cartella",
diff --git a/quartz/i18n/locales/ja-JP.ts b/quartz/i18n/locales/ja-JP.ts
index d429db411..9581b5ed3 100644
--- a/quartz/i18n/locales/ja-JP.ts
+++ b/quartz/i18n/locales/ja-JP.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "Not Found",
       notFound: "ページが存在しないか、非公開設定になっています。",
+      home: "ホームページに戻る",
     },
     folderContent: {
       folder: "フォルダ",
diff --git a/quartz/i18n/locales/ko-KR.ts b/quartz/i18n/locales/ko-KR.ts
index ea735b00c..9be08d98f 100644
--- a/quartz/i18n/locales/ko-KR.ts
+++ b/quartz/i18n/locales/ko-KR.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "Not Found",
       notFound: "페이지가 존재하지 않거나 비공개 설정이 되어 있습니다.",
+      home: "홈페이지로 돌아가기",
     },
     folderContent: {
       folder: "폴더",
diff --git a/quartz/i18n/locales/nl-NL.ts b/quartz/i18n/locales/nl-NL.ts
index d075d584a..ccbafa7b3 100644
--- a/quartz/i18n/locales/nl-NL.ts
+++ b/quartz/i18n/locales/nl-NL.ts
@@ -66,6 +66,7 @@ export default {
     error: {
       title: "Niet gevonden",
       notFound: "Deze pagina is niet zichtbaar of bestaat niet.",
+      home: "Keer terug naar de start pagina",
     },
     folderContent: {
       folder: "Map",
diff --git a/quartz/i18n/locales/pl-PL.ts b/quartz/i18n/locales/pl-PL.ts
new file mode 100644
index 000000000..7fa0cd47a
--- /dev/null
+++ b/quartz/i18n/locales/pl-PL.ts
@@ -0,0 +1,84 @@
+import { Translation } from "./definition"
+
+export default {
+  propertyDefaults: {
+    title: "Bez nazwy",
+    description: "Brak opisu",
+  },
+  components: {
+    callout: {
+      note: "Notatka",
+      abstract: "Streszczenie",
+      info: "informacja",
+      todo: "Do zrobienia",
+      tip: "Wskazówka",
+      success: "Zrobione",
+      question: "Pytanie",
+      warning: "Ostrzeżenie",
+      failure: "Usterka",
+      danger: "Niebiezpieczeństwo",
+      bug: "Błąd w kodzie",
+      example: "Przykład",
+      quote: "Cytat",
+    },
+    backlinks: {
+      title: "Odnośniki zwrotne",
+      noBacklinksFound: "Brak połączeń zwrotnych",
+    },
+    themeToggle: {
+      lightMode: "Trzyb jasny",
+      darkMode: "Tryb ciemny",
+    },
+    explorer: {
+      title: "Przeglądaj",
+    },
+    footer: {
+      createdWith: "Stworzone z użyciem",
+    },
+    graph: {
+      title: "Graf",
+    },
+    recentNotes: {
+      title: "Najnowsze notatki",
+      seeRemainingMore: ({ remaining }) => `Zobacz ${remaining} nastepnych →`,
+    },
+    transcludes: {
+      transcludeOf: ({ targetSlug }) => `Osadzone ${targetSlug}`,
+      linkToOriginal: "Łącze do oryginału",
+    },
+    search: {
+      title: "Szukaj",
+      searchBarPlaceholder: "Search for something",
+    },
+    tableOfContents: {
+      title: "Spis treści",
+    },
+    contentMeta: {
+      readingTime: ({ minutes }) => `${minutes} min. czytania `,
+    },
+  },
+  pages: {
+    rss: {
+      recentNotes: "Najnowsze notatki",
+      lastFewNotes: ({ count }) => `Ostatnie ${count} notatek`,
+    },
+    error: {
+      title: "Nie znaleziono",
+      notFound: "Ta strona jest prywatna lub nie istnieje.",
+      home: "Powrót do strony głównej",
+    },
+    folderContent: {
+      folder: "Folder",
+      itemsUnderFolder: ({ count }) =>
+        count === 1 ? "W tym folderze jest 1 element." : `Elementów w folderze: ${count}.`,
+    },
+    tagContent: {
+      tag: "Znacznik",
+      tagIndex: "Spis znaczników",
+      itemsUnderTag: ({ count }) =>
+        count === 1 ? "Oznaczony 1 element." : `Elementów z tym znacznikiem: ${count}.`,
+      showingFirst: ({ count }) => `Pokazuje ${count} pierwszych znaczników.`,
+      totalTags: ({ count }) => `Znalezionych wszystkich znaczników: ${count}.`,
+    },
+  },
+} as const satisfies Translation
diff --git a/quartz/i18n/locales/pt-BR.ts b/quartz/i18n/locales/pt-BR.ts
index 489d64220..c7b6bfb60 100644
--- a/quartz/i18n/locales/pt-BR.ts
+++ b/quartz/i18n/locales/pt-BR.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "Não encontrado",
       notFound: "Esta página é privada ou não existe.",
+      home: "Retornar a página inicial",
     },
     folderContent: {
       folder: "Arquivo",
diff --git a/quartz/i18n/locales/ro-RO.ts b/quartz/i18n/locales/ro-RO.ts
index 556b18995..2de1c8cd9 100644
--- a/quartz/i18n/locales/ro-RO.ts
+++ b/quartz/i18n/locales/ro-RO.ts
@@ -66,6 +66,7 @@ export default {
     error: {
       title: "Pagina nu a fost găsită",
       notFound: "Fie această pagină este privată, fie nu există.",
+      home: "Reveniți la pagina de pornire",
     },
     folderContent: {
       folder: "Dosar",
diff --git a/quartz/i18n/locales/ru-RU.ts b/quartz/i18n/locales/ru-RU.ts
index 8ead3cabe..18e081734 100644
--- a/quartz/i18n/locales/ru-RU.ts
+++ b/quartz/i18n/locales/ru-RU.ts
@@ -67,6 +67,7 @@ export default {
     error: {
       title: "Страница не найдена",
       notFound: "Эта страница приватная или не существует",
+      home: "Вернуться на главную страницу",
     },
     folderContent: {
       folder: "Папка",
diff --git a/quartz/i18n/locales/uk-UA.ts b/quartz/i18n/locales/uk-UA.ts
index b63693837..d39febb75 100644
--- a/quartz/i18n/locales/uk-UA.ts
+++ b/quartz/i18n/locales/uk-UA.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "Не знайдено",
       notFound: "Ця сторінка або приватна, або не існує.",
+      home: "Повернутися на головну сторінку",
     },
     folderContent: {
       folder: "Папка",
diff --git a/quartz/i18n/locales/vi-VN.ts b/quartz/i18n/locales/vi-VN.ts
index b72ced4ac..39a8fbcc1 100644
--- a/quartz/i18n/locales/vi-VN.ts
+++ b/quartz/i18n/locales/vi-VN.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "Không Tìm Thấy",
       notFound: "Trang này được bảo mật hoặc không tồn tại.",
+      home: "Trở về trang chủ",
     },
     folderContent: {
       folder: "Thư Mục",
diff --git a/quartz/i18n/locales/zh-CN.ts b/quartz/i18n/locales/zh-CN.ts
index 43d011197..b710db539 100644
--- a/quartz/i18n/locales/zh-CN.ts
+++ b/quartz/i18n/locales/zh-CN.ts
@@ -65,6 +65,7 @@ export default {
     error: {
       title: "无法找到",
       notFound: "私有笔记或笔记不存在。",
+      home: "返回首页",
     },
     folderContent: {
       folder: "文件夹",
diff --git a/quartz/plugins/emitters/componentResources.ts b/quartz/plugins/emitters/componentResources.ts
index e6725d99d..d1d8c8597 100644
--- a/quartz/plugins/emitters/componentResources.ts
+++ b/quartz/plugins/emitters/componentResources.ts
@@ -144,6 +144,14 @@ function addGlobalPageResources(ctx: BuildCtx, componentResources: ComponentReso
       tinylyticsScript.defer = true
       document.head.appendChild(tinylyticsScript)
     `)
+  } else if (cfg.analytics?.provider === "cabin") {
+    componentResources.afterDOMLoaded.push(`
+      const cabinScript = document.createElement("script")
+      cabinScript.src = "${cfg.analytics.host ?? "https://scripts.cabin.dev"}/cabin.js"
+      cabinScript.defer = true
+      cabinScript.async = true
+      document.head.appendChild(cabinScript)
+    `)
   }
 
   if (cfg.enableSPA) {
diff --git a/quartz/plugins/transformers/links.ts b/quartz/plugins/transformers/links.ts
index f89d367d7..280581828 100644
--- a/quartz/plugins/transformers/links.ts
+++ b/quartz/plugins/transformers/links.ts
@@ -93,7 +93,7 @@ export const CrawlLinks: QuartzTransformerPlugin<Partial<Options> | undefined> =
                 }
                 node.properties.className = classes
 
-                if (opts.openLinksInNewTab) {
+                if (isExternal && opts.openLinksInNewTab) {
                   node.properties.target = "_blank"
                 }
 
diff --git a/quartz/plugins/transformers/ofm.ts b/quartz/plugins/transformers/ofm.ts
index 108f7f779..925d21e0d 100644
--- a/quartz/plugins/transformers/ofm.ts
+++ b/quartz/plugins/transformers/ofm.ts
@@ -6,6 +6,7 @@ import { slug as slugAnchor } from "github-slugger"
 import rehypeRaw from "rehype-raw"
 import { SKIP, visit } from "unist-util-visit"
 import path from "path"
+import { splitAnchor } from "../../util/path"
 import { JSResource } from "../../util/resources"
 // @ts-ignore
 import calloutScript from "../../components/scripts/callout.inline.ts"
@@ -123,8 +124,8 @@ export const tableWikilinkRegex = new RegExp(/(!?\[\[[^\]]*?\]\])/, "g")
 const highlightRegex = new RegExp(/==([^=]+)==/, "g")
 const commentRegex = new RegExp(/%%[\s\S]*?%%/, "g")
 // from https://github.com/escwxyz/remark-obsidian-callout/blob/main/src/index.ts
-const calloutRegex = new RegExp(/^\[\!(\w+)\]([+-]?)/)
-const calloutLineRegex = new RegExp(/^> *\[\!\w+\][+-]?.*$/, "gm")
+const calloutRegex = new RegExp(/^\[\!(\w+)\|?(.+?)?\]([+-]?)/)
+const calloutLineRegex = new RegExp(/^> *\[\!\w+\|?.*?\][+-]?.*$/, "gm")
 // (?:^| )              -> non-capturing group, tag should start be separated by a space or be the start of the line
 // #(...)               -> capturing group, tag itself must start with #
 // (?:[-_\p{L}\d\p{Z}])+       -> non-capturing group, non-empty string of (Unicode-aware) alpha-numeric characters and symbols, hyphens and/or underscores
@@ -199,10 +200,9 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin<Partial<Options>
         src = src.replace(wikilinkRegex, (value, ...capture) => {
           const [rawFp, rawHeader, rawAlias]: (string | undefined)[] = capture
 
-          const fp = rawFp ?? ""
-          const anchor = rawHeader?.trim().replace(/^#+/, "")
+          const [fp, anchor] = splitAnchor(`${rawFp ?? ""}${rawHeader ?? ""}`)
           const blockRef = Boolean(anchor?.startsWith("^")) ? "^" : ""
-          const displayAnchor = anchor ? `#${blockRef}${slugAnchor(anchor)}` : ""
+          const displayAnchor = anchor ? `#${blockRef}${anchor.trim().replace(/^#+/, "")}` : ""
           const displayAlias = rawAlias ?? rawHeader?.replace("#", "|") ?? ""
           const embedDisplay = value.startsWith("!") ? "!" : ""
 
@@ -414,8 +414,8 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin<Partial<Options>
                 return
               }
 
-              // find first line
-              const firstChild = node.children[0]
+              // find first line and callout content
+              const [firstChild, ...calloutContent] = node.children
               if (firstChild.type !== "paragraph" || firstChild.children[0]?.type !== "text") {
                 return
               }
@@ -427,7 +427,7 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin<Partial<Options>
 
               const match = firstLine.match(calloutRegex)
               if (match && match.input) {
-                const [calloutDirective, typeString, collapseChar] = match
+                const [calloutDirective, typeString, calloutMetaData, collapseChar] = match
                 const calloutType = canonicalizeCallout(typeString.toLowerCase())
                 const collapse = collapseChar === "+" || collapseChar === "-"
                 const defaultState = collapseChar === "-" ? "collapsed" : "expanded"
@@ -489,8 +489,24 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin<Partial<Options>
                     className: classNames.join(" "),
                     "data-callout": calloutType,
                     "data-callout-fold": collapse,
+                    "data-callout-metadata": calloutMetaData,
                   },
                 }
+
+                // Add callout-content class to callout body if it has one.
+                if (calloutContent.length > 0) {
+                  const contentData: BlockContent | DefinitionContent = {
+                    data: {
+                      hProperties: {
+                        className: "callout-content",
+                      },
+                      hName: "div",
+                    },
+                    type: "blockquote",
+                    children: [...calloutContent],
+                  }
+                  node.children = [node.children[0], contentData]
+                }
               }
             })
           }
diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index 859bb433e..b023b2794 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -481,6 +481,10 @@ video {
   flex: 1 1 auto;
 }
 
+div:has(> .overflow) {
+  position: relative;
+}
+
 ul.overflow,
 ol.overflow {
   max-height: 400;
diff --git a/quartz/styles/callouts.scss b/quartz/styles/callouts.scss
index b1fd180ce..d6f65aadc 100644
--- a/quartz/styles/callouts.scss
+++ b/quartz/styles/callouts.scss
@@ -10,7 +10,7 @@
   transition: max-height 0.3s ease;
   box-sizing: border-box;
 
-  & > *:nth-child(2) {
+  & > .callout-content > :first-child {
     margin-top: 0;
   }
 
diff --git a/tsconfig.json b/tsconfig.json
index 306204b5d..784ab231b 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -13,8 +13,8 @@
     "forceConsistentCasingInFileNames": true,
     "esModuleInterop": true,
     "jsx": "react-jsx",
-    "jsxImportSource": "preact",
+    "jsxImportSource": "preact"
   },
   "include": ["**/*.ts", "**/*.tsx", "./package.json"],
-  "exclude": ["build/**/*.d.ts"],
+  "exclude": ["build/**/*.d.ts"]
 }