简洁的个人博客网站，使用纯静态 HTML 构建。
gyzeal.github.io/
├── index.html # 首页（文章归档列表）
├── style.css # 全局样式
├── avatar.jpg # 个人头像（需要自己添加）
├── art.html # 艺术类分类页
├── agent.html # Agent开发类分类页
├── rl.html # RL学习类分类页
├── posts/ # 文章目录
│ ├── example-post.html # 示例文章
│ └── article-template.html # 文章模板
└── README.md # 说明文档
将你的头像图片命名为 avatar.jpg，放在根目录下。建议使用正方形图片（如 400x400px）。
编辑所有页面中的左侧边栏信息：
<div class="profile">
<img src="avatar.jpg" alt="Profile Photo" class="avatar">
<h2 class="name">Your Name</h2> <!-- 修改为你的名字 -->
<p class="bio">简短的个人介绍</p> <!-- 修改个人介绍 -->
</div>
<div class="contact">
<a href="mailto:[email protected]">Email</a> <!-- 修改邮箱 -->
<a href="https://github.com/gyzeal" target="_blank">GitHub</a> <!-- 修改GitHub链接 -->
</div>需要修改的文件：
- index.html
- art.html
- agent.html
- rl.html
- posts/article-template.html
- posts/example-post.html
- 复制
posts/article-template.html文件 - 重命名为你的文章名（建议：
2025-11-06-article-title.html） - 编辑文件内容：
- 修改
<title>标签 - 修改文章标题
<h1> - 修改日期和分类
- 在
<div class="post-content">中写入内容 - 修改返回链接
- 修改
编辑 index.html，在对应的年份/月份下添加：
<article class="post-entry">
<a href="posts/your-article.html" class="post-title">文章标题</a>
<div class="post-info">
<span class="post-date">Date: November 6, 2025</span>
<span class="post-meta">Estimated Reading Time: 5 min</span>
<span class="post-author">Author: Your Name</span>
</div>
</article>如果需要添加新的年份或月份：
<section class="year-section">
<h2 class="year">2025 <sup>1</sup></h2> <!-- sup中的数字是该年的文章数 -->
<div class="month-section">
<h3 class="month">November <sup>1</sup></h3> <!-- sup中的数字是该月的文章数 -->
<!-- 文章列表 -->
</div>
</section>编辑对应的分类页面（art.html / agent.html / rl.html）：
<article class="post-item">
<h3><a href="posts/your-article.html">文章标题</a></h3>
<div class="post-meta">
<span class="date">Date: November 6, 2025</span>
<span class="category">Category: 艺术类</span>
</div>
<p class="post-excerpt">文章摘要...</p>
<a href="posts/your-article.html" class="read-more">Read More</a>
</article><h2>大标题</h2>
<h3>小标题</h3><p>这是一个段落</p>
<strong>粗体文本</strong>
<em>斜体文本</em><ul>
<li>无序列表项</li>
</ul>
<ol>
<li>有序列表项</li>
</ol><code>行内代码</code>
<pre><code>代码块
多行代码
</code></pre><blockquote>
引用的文字
</blockquote><a href="https://example.com">链接文本</a><img src="path/to/image.jpg" alt="图片描述">- 提交所有文件到 GitHub 仓库：
git add .
git commit -m "Update blog"
git push origin main-
在 GitHub 仓库设置中启用 GitHub Pages：
- 进入 Settings → Pages
- Source 选择
main分支 - 保存后等待几分钟
-
访问
https://gyzeal.github.io查看你的博客
直接在浏览器中打开 index.html 文件即可预览。
- 采用深色主题（背景 #1e1e1e，侧边栏 #252526）
- 左侧固定边栏，右侧内容区域
- 响应式设计，移动端自动调整布局
- 简洁专业的排版风格
如果需要更多功能，可以考虑迁移到：
- Jekyll - 自动生成页面，支持 Markdown
- Hugo - 速度更快的静态网站生成器
- Hexo - 适合技术博客的生成器
MIT License