AstroBlog

Blog-Astro — Astro Blog Template

By HeLongaa

An Astro-based personal blog theme with personalized improvements on top of vhAstro-Theme, released under the MIT license.

Open Source SiteDownload Source ZIP

Explore the design

Compare the page layouts and mobile experience. Open any screenshot for a closer look.

3 previews
Desktop homepage1 / 3
Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 3

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-10-12View source

What stands out

A quick read of the recorded project description.

01

Customized based on vhAstro-Theme, retaining the Astro static generation structure

02

Supports dark/light theme switching and responsive layout

03

Built-in full-text search, article table of contents, comment integration, and RSS subscription generation

04

Supports Markdown and MDX, including code highlighting and KaTeX math formulas

05

Provides article word count, reading time, and pinned articles

06

Released under the MIT license, allowing free use, modification, commercial use, and distribution

Template Details

Blog-Astro is a personal blog theme built on the Astro static site generator. It was deeply customized and enhanced by HeLongaa based on vhAstro-Theme and is released under the MIT open-source license. The theme targets personal blogs and technical sharing scenarios. It provides dark/light theme switching, responsive layout, full-text search, article table of contents, comment integration, RSS subscription, sitemap, SEO configuration, and image lazy loading. It supports Markdown and MDX authoring, code highlighting, KaTeX math rendering, article word count and reading time, and pinned articles. Content management is done through .md or .mdx files under src/content/blog/, with frontmatter containing title, date, categories, tags, and cover fields; site information is configured centrally in src/config.ts. The project uses TypeScript and Less, with PNPM for package management. The README requires Node.js 18+ and PNPM 8+, and outlines deployment directions for Vercel, Netlify, and GitHub Pages. Friend link management and RSS subscription features depend on external CloudFlare-related projects provided by the author and are not standalone services built into the theme.

AstroBlog

Is it right for your project?

Use Cases

  • Building a personal technical blog and publishing Markdown/MDX articles
  • Reading-oriented sites that need dark mode, full-text search, and an article table of contents
  • Improving content distribution through RSS, sitemap, and SEO configuration
  • Deploying a static blog on Vercel, Netlify, or GitHub Pages

Suitable For

  • Individual developers with front-end experience who are willing to configure src/config.ts themselves
  • Technical writers using Astro or wanting to try an Astro static site
  • Users who need a blog theme that can be freely modified under the MIT license
  • Users who accept that friend links and RSS subscription depend on external CloudFlare projects

Getting started & customization

Use these recorded setup notes alongside the repository instructions for your chosen version.

  1. 1

    Environment requirements: Node.js 18.0+ and PNPM 8.0+.

  2. 2

    After cloning the repository, run pnpm install to install dependencies, pnpm dev to start the development server, and pnpm build to build the production version.

  3. 3

    Modify src/config.ts to set the site URL, title, author, description, and other information.

  4. 4

    Place articles in the src/content/blog/ directory using .md or .mdx, and fill in fields such as title, date, categories, tags, and cover in the frontmatter.

  5. 5

    Friend link management and RSS subscription features depend on external CloudFlare-related projects provided by the author and must be deployed separately; third-party assets such as demo images, fonts, and icons must be checked against their respective licenses.

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This entry covers the free version under the MIT license in the public repository; the free scope is the code of this version and does not mean that external services or third-party assets are free.

Must comply with when using

  • Free use, modification, commercial use, and distribution of this version's code are permitted.
  • When distributing copies or substantial portions of the code, retain the original author's copyright notice and the complete MIT license notice.
  • The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.

Additional costs & items to verify

  • Demo images, fonts, icons, and other third-party assets must be checked against their respective licenses and cannot be judged solely by the code's MIT license.
  • External services such as domains, hosting, databases, payments, or AI may incur additional charges.
  • Friend link management and RSS subscription features depend on external CloudFlare projects provided by the author and must be deployed separately; they are not standalone services built into the theme.
  • The friend link application feature depends on the external repository links-app-workers and requires deploying that CloudFlare project separately to use.
  • The RSS subscription feature depends on the external repository RSS-Subscription and requires deploying that CloudFlare project separately to use.
View Original Text Basis

Permission is hereby granted, free of charge

Original License Text

- ✅ 基于 CloudFlare 的友链管理 - ✅ 基于 CloudFlare 的RSS订阅

Original README

[**🔗 友链申请功能**](https://github.com/HeLongaa/links-app-workers)

Original README

[**<img src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='%23FFA500' viewBox='0 0 24 24'><path d='M6.18 17.82a2.18 2.18 0 1 1 0-4.36 2.18 2.18 0 0 1 0 4.36zm-3.18.18v-3a1 1 0 0 1 1-1c8.28 0 15 6.72 15 15a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1c0-6.08-4.92-11-11-11a1 1 0 0 1-1-1zm0-6v-3a1 1 0 0 1 1-1c12.15 0 22 9.85 22 22a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1c0-10.49-8.51-19-19-19a1 1 0 0 1-1-1z'/></svg>" alt="RSS" style="vertical-align:middle;" /> RSS订阅功能**](https://github.com/HeLongaa/RSS-Subscription)

Original README
https://github.com/HeLongaa/Blog-Astro/blob/main/LICENSEhttps://github.com/HeLongaa/Blog-Astro/blob/main/README.md

Compiled by DeepSeek based on repository license and README ·2026-10-12. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.

Project checks & description sources

Template Information

Source platforms
GitHub
Documentation and maintenance reference score
More documented · 77 / 100
Technologies
Astro
Website type
Blog
How this score is calculated

Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.

What to verify for this project

Repository update recorded
2025-08-28
Screenshot last checked
2026-10-12

A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.

The catalog identifies Astro as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.

Use a selection guide →

How this description was prepared

AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.

Review declaration: [email protected] · 2026-10-13

Inspect the recorded source material

SHA-256: 09038de4443e14043dfcad0a4ce06362964d92603e6b501a1236f132240500e7

2026-10-12T18:34:43.986Z

Source file / repository
# 🌟 HeLong's Blog - Astro Theme

![Astro](https://img.shields.io/badge/Astro-5.7+-orange.svg)
![TypeScript](https://img.shields.io/badge/TypeScript-5.0+-blue.svg)
![Less](https://img.shields.io/badge/Less-4.0+-purple.svg)
![Node.js](https://img.shields.io/badge/Node.js-18+-green.svg)
![PNPM](https://img.shields.io/badge/PNPM-8.0+-yellow.svg)
![License](https://img.shields.io/badge/License-MIT-red.svg)

> 🚀 一个基于 Astro 构建的现代化个人博客主题，具有优雅的设计和丰富的功能

[**🌐 在线预览**](https://blog.helong.online/) | [**📚 文档**](#功能特性) | [**🛠️ 部署指南**](#快速开始) | [**🔗 友链申请功能**](https://github.com/HeLongaa/links-app-workers) | <a href="https://github.com/HeLongaa/Talking-server" style="text-decoration:none;"><svg t="1753625653712" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1506" width="20" height="20" style="vertical-align:middle;"><path d="M26.564738 707.028587c0 170.262396 138.02638 308.274993 308.274993 308.274993s308.274993-138.02638 308.274993-308.274993c0-170.262396-138.02638-308.274993-308.274993-308.274993S26.564738 536.779973 26.564738 707.028587zM880.936312 93.496851a47.664926 47.664926 0 1 0 0 95.329852 47.664926 47.664926 0 1 0 0-95.329852z m0 0" fill="#FFCA5F" p-id="1507"></path><path d="M383.889744 451.235316c-24.683499 0.013782-45.79747 18.481615-49.146487 43.068641l-0.468587 5.388748-0.013782 48.04393c0.165384 27.260727 22.395693 49.339435 49.628856 49.339435h0.303204c24.40786-0.151602 45.397793-18.481615 48.843283-42.627618l0.482369-5.54035 0.013782-48.030148c-0.013782-27.370983-22.285437-49.642638-49.642638-49.642638z" fill="#5C1CF7" p-id="1508"></path><path d="M902.160538 953.629287l-45.700996-91.45712 5.264711-5.74708c77.509771-84.4421 120.096043-194.077631 119.916878-308.688452 0-122.121992-47.561561-236.939542-133.919354-323.297335-86.357793-86.357793-201.175343-133.919354-323.297336-133.919354s-236.939542 47.561561-323.297335 133.919354C114.769314 310.783311 67.221534 425.600861 67.221534 547.722853c0 242.548802 189.446891 443.062611 431.334159 456.513809l12.913701 0.523715 12.968829 0.192947H870.296635c9.495774 0 18.412705-3.693567 25.138304-10.405383 6.725599-6.711817 10.432948-15.64253 10.432948-25.152086 0-3.762476-0.592624-7.483607-1.75031-11.053136l-1.957039-4.713432z m-89.472516-19.84603H524.286622l-12.155693-0.179165-11.756016-0.468587C297.38035 921.186541 138.364038 751.902665 138.364038 547.722853c0-209.954455 164.391279-379.458843 374.207914-385.881238l12.086783-0.192947 11.769798 0.179165c209.761507 6.518869 374.070094 176.023257 374.070094 385.881238 0.165384 91.18148-32.236016 179.675478-91.18148 249.177928l-10.074617 11.480377-38.355208 41.800699 41.8007 83.615182z" fill="#5C1CF7" p-id="1509"></path><path d="M664.972921 451.235316c-24.683499 0.013782-45.79747 18.481615-49.146488 43.068641l-0.468586 5.388748-0.013782 48.04393c0.165384 27.260727 22.395693 49.339435 49.628856 49.339435h0.303203c24.40786-0.151602 45.397793-18.481615 48.843284-42.627618l0.482369-5.54035 0.013782-48.030148c0-27.370983-22.271655-49.642638-49.642638-49.642638z" fill="#5C1CF7" p-id="1510"></path></svg> <strong>说说后端</strong></a> | [**<img src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='%23FFA500' viewBox='0 0 24 24'><path d='M6.18 17.82a2.18 2.18 0 1 1 0-4.36 2.18 2.18 0 0 1 0 4.36zm-3.18.18v-3a1 1 0 0 1 1-1c8.28 0 15 6.72 15 15a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1c0-6.08-4.92-11-11-11a1 1 0 0 1-1-1zm0-6v-3a1 1 0 0 1 1-1c12.15 0 22 9.85 22 22a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1c0-10.49-8.51-19-19-19a1 1 0 0 1-1-1z'/></svg>" alt="RSS" style="vertical-align:middle;" /> RSS订阅功能**](https://github.com/HeLongaa/RSS-Subscription)

## 📋 项目介绍

本项目基于 [vhAstro-Theme](https://github.com/uxiaohan/vhAstro-Theme) 进行了深度定制和功能增强。这是一个使用 Astro 静态站点生成器构建的现代化博客主题，专为个人博客和技术分享而设计。

### 🔄 基于原项目的改进

感谢 [@uxiaohan](https://github.com/uxiaohan) 提供的优秀基础框架。

### ✨ 核心特色

- 🌙 **暗色/亮色主题切换** - 支持自动、手动主题切换
- 📱 **完全响应式设计** - 适配所有设备屏幕
- ⚡ **极速性能** - 基于 Astro 的静态生成，加载速度极快
- 🔍 **全文搜索** - 内置搜索功能，快速查找文章
- 📊 **数据统计** - 文章数量、分类、标签统计
- 💬 **评论系统** - 集成评论功能
- 🏷️ **标签分类** - 完善的文章分类和标签系统

## 🚀 功能特性

### 🎨 界面设计
- ✅ 现代化 UI 设计，简洁优雅
- ✅ 暗色/亮色主题自由切换
- ✅ 响应式布局，完美适配移动端
- ✅ 流畅的页面切换动画
- ✅ 自定义字体和图标支持

### 📝 内容管理
- ✅ Markdown 文档写作
- ✅ MDX 组件支持
- ✅ 代码高亮显示
- ✅ 数学公式渲染 (KaTeX)
- ✅ 文章字数统计和阅读时间
- ✅ 文章置顶功能

### 🔧 功能模块
- ✅ 全文搜索功能
- ✅ 文章目录导航
- ✅ 评论系统集成
- ✅ RSS 订阅生成
- ✅ 站点地图自动生成
- ✅ SEO 优化配置
- ✅ 图片懒加载
- ✅ 基于 CloudFlare 的友链管理
- ✅ 基于 CloudFlare 的RSS订阅

### 📊 数据分析
- ✅ 文章统计信息
- ✅ 分类和标签管理
- ✅ 访问统计集成
- ✅ 网站运行状态监控

## 🛠️ 技术栈

- **框架**: [Astro](https://astro.build/) - 现代静态站点生成器
- **语言**: TypeScript - 类型安全的 JavaScript
- **样式**: Less - CSS 预处理器
- **包管理**: PNPM - 快速的包管理器
- **部署**: 支持 Vercel、Netlify、GitHub Pages
- **工具**: ESLint、Prettier 代码格式化

## 🚀 快速开始

### 环境要求

- Node.js 18.0+
- PNPM 8.0+

### 安装步骤

1. **克隆项目**
```bash
git clone https://github.com/your-username/Blog-Astro.git
cd Blog-Astro
```

2. **安装依赖**
```bash
pnpm install
```

3. **启动开发服务器**
```bash
pnpm dev
```

4. **构建生产版本**
```bash
pnpm build
```

### 配置说明

修改 `src/config.ts` 文件来自定义你的博客设置：

```typescript
export default {
  Site: "https://your-domain.com",
  Title: "你的博客标题",
  Author: "你的名字",
  Description: "博客描述",
  // ... 更多配置选项
}
```

## 📁 项目结构

```
Blog-Astro/
├── src/
│   ├── components/     # 组件目录
│   ├── content/        # 博客内容
│   ├── layouts/        # 页面布局
│   ├── pages/          # 页面路由
│   ├── scripts/        # 脚本文件
│   └── styles/         # 样式文件
├── public/             # 静态资源
└── astro.config.mjs    # Astro 配置
```

## 📝 写作指南

1. 在 `src/content/blog/` 目录下创建 `.md` 或 `.mdx` 文件
2. 使用以下 frontmatter 格式：

```yaml
---
title: "文章标题"
date: 2025-01-01
categories: "分类"
tags: ["标签1", "标签2"]
cover: "封面图片路径"
---

你的文章内容...
```

## 🎯 关于作者

👋 你好，我是 **HeLong**

🎓 目前在 [云南大学](https://www.ynu.edu.cn/) 攻读计算机科学学士学位  
💭 人生格言：*无论走得多远，都要记住当初为什么出发*  
📝 这个博客用来记录我的学习和生活，希望能给每一位访客带来启发

### 📫 联系方式

- 📧 **邮箱**: [email protected]
- 🐙 **GitHub**: [HeLong](https://github.com/Helongaa)
- 📚 **知乎**: [想再见一面](https://www.zhihu.com/people/yu-luo-wu-sheng-73-99)
- 📺 **哔哩哔哩**: [风吹枫悠落](https://space.bilibili.com/491035693)

## 🙏 致谢

特别感谢以下项目和开发者：

- **[vhAstro-Theme](https://github.com/uxiaohan/vhAstro-Theme)** - 本项目的基础，由 [@uxiaohan](https://github.com/uxiaohan) 开发
- **[Astro](https://astro.build/)** - 强大的静态站点生成器
- 所有为开源社区贡献力量的开发者们

## 📜 开源协议

本项目采用 [MIT](LICENSE) 开源协议

## 🤝 贡献

欢迎提交 Issue 和 Pull Request 来帮助改进这个项目！

如果你觉得这个项目对你有帮助，请给它一个 ⭐️

---

<p align="center">
  <strong>如果你有任何问题，欢迎随时联系我。我很乐意成为你的朋友！</strong>
</p>
Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.

astrowind

astrowind

AstroWind is a free, open-source Astro starter theme using Astro and Tailwind CSS, released under the MIT license.

Astro · Blog

astro-paper

astro-paper

AstroPaper is a minimal, responsive, accessible, and SEO-friendly Astro blog theme. Articles are stored as Markdown/MDX in src/content/posts/, with subdirectories affecting URLs.

Astro · Blog

fuwari

fuwari

Fuwari is a static blog template built with Astro and Tailwind CSS for personal blogs. It manages posts as Markdown files in src/content/posts/, with frontmatter for title, date, description, cover, tags, categories, draft status, and language.

Astro · Blog

Firefly

Firefly

Firefly is a clean personal blog theme forked from Astro and Fuwari, offering four background modes, single/double sidebar and list/grid layouts, Pagefind client-side full-text search, and a six-language UI.

Astro · Blog

astro-theme-cactus

astro-theme-cactus

Astro Cactus is an Astro-based blog and portfolio theme that uses Markdown/MDX content collections to manage posts, notes, and tags, with frontmatter type-checked by a schema.

Astro · Portfolio

astrofy

astrofy

Astrofy is a free and open-source personal portfolio website template built with Astro and TailwindCSS, with built-in blog, CV timeline, project showcase, store, and RSS feed modules.

Astro · Portfolio