博客换主题啦！！！

从今天开始blog的主题将从Fuwari转为Shirone啦！！！

非常感谢Shirone的作者大大开源！

我在此主题的基础上做了更多深度个人化定制和优化：

隐藏了Music player和Announcement组件
更改footer相关文件，增加了getloli的原子/分子组件
将「src/config/FooterConfig.html 文件内容注入到页脚版权信息上方」改为下方并增加萌ICP和netlify徽章
将顶栏的i18n+问题修复，更改TopAppBar.astro防止文字被挤压断行
隐藏顶栏部分内容并新增「学びログ」页面
让bio内容可以使用\n换行
更改底部版权内容，使当前年份会动态调整
更改配置文件，并将默认主题颜色改为暗色

下面是自用的一些内容：

文章元数据(Shirone Authoring & Usage Guide)#

Example#

1
---
2
title: "Exploring Material 3 Expressive Design"
3
published: 2026-08-26
4
updated: 2026-08-27
5
publishedAt: 2026-08-26T10:00:00+08:00
6
updatedAt: 2026-08-27T09:30:00+08:00
7
pinned: true
8
description: "A deep dive into dynamic HCT color science and fluid transitions in Shirone."
9
image: "./cover.webp"
10
tags: [M3E, Design, Frontend]
11
category: Guides
12
draft: false
13
comment: true
14
---

Supported Frontmatter Fields#

Field	Type	Required	Description
`title`	`string`	Yes	The main title of the post.
`published`	`Date`	Yes	Publication date in `YYYY-MM-DD` format.
`publishedAt`	`Date`	No	Precise publication instant used to order posts published on the same day. It must fall on `published` in the configured site time zone.
`updated`	`Date`	No	Last updated date. When provided, an update notice badge is displayed.
`updatedAt`	`Date`	No	Precise update instant used by feeds and machine-readable metadata. It must be paired with `updated`.
`pinned`	`boolean`	No	Pin the post to the top of article lists (default: `false`).
`description`	`string`	No	Post summary displayed in article cards, search results, and OpenGraph metadata.
`image`	`string`	No	Cover image path. Supports relative (`./cover.webp`), public (`/images/cover.jpg`), or remote URLs.
`tags`	`string[]`	No	Array of tag names for taxonomy filtering and tag clouds.
`category`	`string`	No	Primary category name for taxonomy indexing.
`draft`	`boolean`	No	Mark as draft. Draft posts are hidden during production build (`pnpm build`).
`comment`	`boolean`	No	Toggle comment section for this specific post (default: `true`).
`lang`	`string`	No	Language code (e.g. `en`, `zh_CN`, `ja`) if different from site default.

Post Encryption#

Shirone provides client-side post encryption. For private journals or restricted articles, specify a password in frontmatter:

1
---
2
title: "Private Research Notes"
3
published: 2026-08-26
4
encrypted: true
5
password: "your-secret-passphrase"
6
passwordHint: "Favorite anime character"
7
hideHomeContent: true
8
---

encrypted: Set to true to enable encryption;
password: Passphrase string or number required to unlock the post;
passwordHint: Optional hint shown above the password entry form;
hideHomeContent: Hide word counts and content previews on the homepage to prevent data leakage.

文章编写：#

有序列表(Markdown Steps)#

1
:::steps[Production deployment]
2
1. **Clone and prepare the workspace**
3

4
   Clone the repository and enter the project directory.
5

6
   ```powershell
7
   git clone https://github.com/LyraVoid/Shirone.git
8
   Set-Location Shirone
9
   ```
10

11
2. **Install dependencies**
12

13
   Use the repository's pinned package manager.
14

15
   ```powershell
16
   pnpm.cmd install
17
   ```
18

19
3. **Run project checks**
20

21
   Confirm Astro diagnostics and TypeScript checks pass.
22

23
   ```powershell
24
   npx.cmd astro check
25
   pnpm.cmd type-check
26
   ```
27

28
4. **Build the production site**
29

30
   Generate the static site and search index.
31

32
   ```powershell
33
   pnpm.cmd build
34
   ```
35
:::

标记高亮(Markdown Marker Highlights)#

Semantic colors#

Use a suffix when the meaning needs a different tonal role. The available variants are primary, secondary, tertiary, error, and tip.

Primary connects the phrase to the active theme
Secondary keeps a supporting distinction quiet
Tertiary adds a separate editorial signal
Error identifies a condition that needs correction
Tip highlights practical guidance

Author syntax#

1
==Primary marker==
2

3
==Secondary marker=={.secondary}
4
==Tertiary marker=={.tertiary}
5
==Error marker=={.error}
6
==Tip marker=={.tip}

隐藏内容(Markdown Spoilers)#

Inline details#

The answer is , and this sentence remains ordinary Markdown around it.

Spoilers can include inline code and .

Author syntax#

1
The answer is :spoiler[42].

代码演示(Expressive Code Example)#

Selecting line marker types (mark, ins, del)#

1
function demo() {
2
  console.log('this line is marked as deleted')
3
  // This line and the next one are marked as inserted
4
  console.log('this is the second inserted line')
5

6
  return 'this line uses the neutral default marker type'
7
}

1
```js title="line-markers.js" del={2} ins={3-4} {6}
2
function demo() {
3
  console.log('this line is marked as deleted')
4
  // This line and the next one are marked as inserted
5
  console.log('this is the second inserted line')
6

7
  return 'this line uses the neutral default marker type'
8
}
9
```

Using diff-like syntax#

1
this line will be marked as inserted
2
this line will be marked as deleted
3
this is a regular line

1
```diff
2
+this line will be marked as inserted
3
-this line will be marked as deleted
4
this is a regular line
5
```

カンカン Blog

文章元数据(Shirone Authoring & Usage Guide)#

Example#

Supported Frontmatter Fields#

Post Encryption#

文章编写：#

有序列表(Markdown Steps)#

标记高亮(Markdown Marker Highlights)#

Semantic colors#

Author syntax#

隐藏内容(Markdown Spoilers)#

Inline details#

Author syntax#

代码演示(Expressive Code Example)#

Selecting line marker types (mark, ins, del)#

Using diff-like syntax#