diff --git a/astro.config.ts b/astro.config.ts
index 9671181..ae807b1 100644
--- a/astro.config.ts
+++ b/astro.config.ts
@@ -4,6 +4,11 @@ import sitemap from "@astrojs/sitemap";
import remarkToc from "remark-toc";
import remarkCollapse from "remark-collapse";
import { SITE } from "./src/config";
+import {
+ transformerNotationDiff,
+ transformerNotationHighlight,
+ transformerNotationWordHighlight,
+} from "@shikijs/transformers";
// https://astro.build/config
export default defineConfig({
@@ -18,7 +23,13 @@ export default defineConfig({
shikiConfig: {
// For more themes, visit https://shiki.style/themes
themes: { light: "min-light", dark: "night-owl" },
- wrap: true,
+ defaultColor: false,
+ wrap: false,
+ transformers: [
+ transformerNotationDiff({ matchAlgorithm: "v3" }),
+ transformerNotationHighlight(),
+ transformerNotationWordHighlight(),
+ ],
},
},
vite: {
diff --git a/package.json b/package.json
index 483c9db..fc71976 100644
--- a/package.json
+++ b/package.json
@@ -29,6 +29,7 @@
"devDependencies": {
"@astrojs/check": "^0.9.4",
"@pagefind/default-ui": "^1.3.0",
+ "@shikijs/transformers": "^3.6.0",
"@tailwindcss/typography": "^0.5.16",
"@types/lodash.kebabcase": "^4.1.9",
"@typescript-eslint/parser": "^8.34.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f295bad..ad23043 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -51,6 +51,9 @@ importers:
'@pagefind/default-ui':
specifier: ^1.3.0
version: 1.3.0
+ '@shikijs/transformers':
+ specifier: ^3.6.0
+ version: 3.6.0
'@tailwindcss/typography':
specifier: ^0.5.16
version: 0.5.16(tailwindcss@4.1.8)
@@ -892,6 +895,9 @@ packages:
'@shikijs/themes@3.6.0':
resolution: {integrity: sha512-Fq2j4nWr1DF4drvmhqKq8x5vVQ27VncF8XZMBuHuQMZvUSS3NBgpqfwz/FoGe36+W6PvniZ1yDlg2d4kmYDU6w==}
+ '@shikijs/transformers@3.6.0':
+ resolution: {integrity: sha512-PYkU54lYV0RCaUG8n2FNTF+YWiU3uPhcjLGq2x/C8lIrUX9GVnRb3bK+R5xtdFHbuctntATKm7ondp/H/dux9Q==}
+
'@shikijs/types@3.6.0':
resolution: {integrity: sha512-cLWFiToxYu0aAzJqhXTQsFiJRTFDAGl93IrMSBNaGSzs7ixkLfdG6pH11HipuWFGW5vyx4X47W8HDQ7eSrmBUg==}
@@ -3628,6 +3634,11 @@ snapshots:
dependencies:
'@shikijs/types': 3.6.0
+ '@shikijs/transformers@3.6.0':
+ dependencies:
+ '@shikijs/core': 3.6.0
+ '@shikijs/types': 3.6.0
+
'@shikijs/types@3.6.0':
dependencies:
'@shikijs/vscode-textmate': 10.0.2
diff --git a/src/data/blog/adding-new-post.md b/src/data/blog/adding-new-post.md
index 022c8cb..97cb830 100644
--- a/src/data/blog/adding-new-post.md
+++ b/src/data/blog/adding-new-post.md
@@ -44,8 +44,8 @@ If you don’t want subdirectories to affect the post URL, just prefix the folde
src/data/blog/very-first-post.md -> mysite.com/posts/very-first-post
src/data/blog/2025/example-post.md -> mysite.com/posts/2025/example-post
src/data/blog/_2026/another-post.md -> mysite.com/posts/another-post
-src/data/blog/docs/_legacy/how-to.md -> mysite.com/docs/how-to
-src/data/blog/Example Dir/Dummy Post.md -> mysite.com/example-dir/dummy-post
+src/data/blog/docs/_legacy/how-to.md -> mysite.com/posts/docs/how-to
+src/data/blog/Example Dir/Dummy Post.md -> mysite.com/posts/example-dir/dummy-post
```
> 💡 Tip: You can override a blog post’s slug in the frontmatter as well. See the next section for more details.
@@ -91,6 +91,7 @@ If you omit `tags` in a blog post (in other words, if no tag is specified), the
export const blogSchema = z.object({
// ---
draft: z.boolean().optional(),
+ // [!code highlight:1]
tags: z.array(z.string()).default(["others"]), // replace "others" with whatever you want
// ---
});
@@ -128,6 +129,7 @@ Write `Table of contents` in h2 format (## in markdown) and place it where you w
For instance, if you want to place your table of contents just under the intro paragraph (like I usually do), you can do that in the following way.
+
```md
---
# some frontmatter
@@ -135,10 +137,12 @@ For instance, if you want to place your table of contents just under the intro p
Here are some recommendations, tips & ticks for creating new posts in AstroPaper blog theme.
+
## Table of contents
```
+
## Headings
diff --git a/src/data/blog/how-to-add-latex-equations-in-blog-posts.md b/src/data/blog/how-to-add-latex-equations-in-blog-posts.md
index 04f7b9d..140645c 100644
--- a/src/data/blog/how-to-add-latex-equations-in-blog-posts.md
+++ b/src/data/blog/how-to-add-latex-equations-in-blog-posts.md
@@ -43,15 +43,15 @@ In this section, you will find instructions on how to add support for LaTeX in y
// other configs
markdown: {
remarkPlugins: [
- remarkMath, // <- new plugin
+ remarkMath, // [!code ++]
remarkToc,
[remarkCollapse, { test: "Table of contents" }],
],
- rehypePlugins: [rehypeKatex], // <- new plugin
+ rehypePlugins: [rehypeKatex], // [!code ++]
shikiConfig: {
// For more themes, visit https://shiki.style/themes
themes: { light: "min-light", dark: "night-owl" },
- wrap: true,
+ wrap: false,
},
},
// other configs
@@ -71,6 +71,7 @@ In this section, you will find instructions on how to add support for LaTeX in y
+
-
-
-+
@@ -189,19 +189,18 @@ Note that specifying a `theme` here will override the `lightTheme` and `darkThem
To complete the process, add the new Comments component to `src/layouts/PostDetails.astro` (replacing the `script` tag from the previous step).
-```diff
-+ import Comments from "@/components/Comments";
+```jsx
+// [!code ++:1]
+import Comments from "@/components/Comments";
-