About Slate Blog
Jan 21 ·
1 分钟阅读
✨ Features
- Minimalist style theme, adaptable to multiple platforms
- Zero-based quick start, foolproof configuration, easy deployment
- Support for article drafts, local preview, and automatic draft filtering in production builds
- Default RSS generation with Follow subscription authentication
- Integrated Algolia search
- Complete SEO optimization to improve search engine rankings
🪜 Framework
- Astro + React + Typescript
- Tailwindcss + @radix-ui/colors
- Docsearch
🔨 Usage
# Start local servernpm run dev# oryarn dev# orpnpm dev
# Buildnpm run build# oryarn build# orpnpm build🗂 Directory Structure
- plugins/ # Custom plugins- src/ ├── assets/ # Asset files ├── components/ # Components ├── content/ # Content collections ├── helpers/ # Business logic ├── pages/ # Pages └── typings/ # Common typesArticles are stored in the
src/content/postdirectory, supporting markdown and mdx formats. The filename is the path name. For example,src/content/post/my-first-post.md=>https://your-blog.com/blog/my-first-post.
Configuration
Theme configuration is done through slate.config.ts in the root directory.
| Option | Description | Type | Default |
|---|---|---|---|
| site | Final deployment link | string | - |
| title | Website title | string | - |
| description | Website description | string | - |
| lang | Language | string | zh-CN |
| avatar | Avatar | string | - |
| sitemap | Website sitemap configuration | { hostname: string } | - |
| readTime | Show reading time | boolean | false |
| lastModified | Show last modified time | boolean | false |
| algolia | Docsearch configuration | { appId: string, apiKey: string, indexName: string } | - |
| follow | Follow subscription authentication configuration | { feedId: string, userId: string } | - |
| footer | Website footer configuration | { copyright: string } | - |
Algolia Application
- Deploy your site first
- Apply for an
apiKeyat algolia - After successful application, configure
algoliainslate.config.ts - Redeploy
Follow Subscription Authentication
- Register a follow account
- Deploy your site
- Click the
+button onfollow, selectRSSsubscription, and enter thersslink (usually[site]/rss.xml, wheresiteis the value ofsiteinslate.config.ts) - Redeploy
Article Frontmatter Description
| Option | Description | Type | Required |
|---|---|---|---|
| title | Article title | string | Yes |
| description | Article description | string | No |
| tags | Article tags | string[] | No |
| draft | Whether it’s a draft. When not provided or false, pubDate must be provided; drafts are only visible in local preview | boolean | No |
| pubDate | Article publication date | date | No, required when draft is false |
For more details, check the src/content/config.ts file
Example
---title: 40 questionsdescription: This repo maintains revisons and translations to the list of 40 questions I ask myself each year and each decade.tags: - Life - Thinking - WritingpubDate: 2025-01-06---编辑于 Feb 01