文章以 Markdown 文件形式存放在 _posts 目录,新增文件即新增文章
blog-template (sub-t) — Next.js 博客模板
作者 sub-t
基于 Next.js 与 Markdown 的个人博客模板,把文章放进 _posts 目录即可开始写作,支持 GitHub Pages 部署。
看看你的网站会是什么样
浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。
全部页面与视图 3
截图用于了解视觉与布局,交互效果请以实际项目为准。
值得关注的模板亮点
从已有项目资料中,快速了解它的特点。
文章列表页带分页,文章页带目录
响应式布局并支持深色模式
使用 next-seo 处理 SEO,并支持 OGP
提供在线演示与 GitHub Pages 部署参考文章
模板详细介绍
这是一个面向个人博客的 Next.js 模板,核心工作流是把 Markdown 文件放入 _posts 目录,即可生成文章页面,也便于复用 Zenn、Qiita 等平台已发布的文章内容。模板提供文章列表分页、文章内目录、响应式布局与深色模式,并借助 next-seo 处理 SEO 与 OGP 元信息。仓库附带在线演示与作者撰写的搭建、部署说明文章,部署方式参考将 Next.js 应用发布到 GitHub Pages 的流程。
使用前需注意:模板本身为 MIT 许可,但演示图片、字体、图标等第三方素材需单独核对其许可;域名、托管等外部服务可能产生额外费用。README 未说明内容量级、构建产物大小或与特定 Next.js 版本的兼容范围,实际使用应以仓库依赖清单为准。
适合你的项目吗?
适用场景
- 搭建个人技术或生活博客,用 Markdown 管理文章
- 把 Zenn、Qiita 等平台已发布的文章迁移或复用到自建站点
- 通过 GitHub Pages 免费托管静态博客站点
- 作为学习 Next.js 博客类项目结构的参考模板
适合人群
- 习惯用 Markdown 写作、希望自行托管博客的个人开发者
- 需要文章分页、目录、深色模式等基础博客功能的用户
- 计划用 GitHub Pages 部署静态站点的用户
上手与定制指南
结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。
- 1
通过 git clone 获取仓库后,使用 yarn 安装依赖并运行 yarn dev 启动开发环境
- 2
文章写入 _posts 目录,格式为 Markdown
- 3
部署到 GitHub Pages 可参考 README 中给出的外部文章链接
- 4
代码采用 MIT 许可,分发时需保留版权与许可声明
- 5
演示图片、字体、图标等第三方素材需单独核对许可
授权与来源资料
使用条件与限制
免费使用 · 保留许可声明本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。
使用时需要遵守
- 允许免费使用、修改、商用和分发该版本代码。
- 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
- 代码按现状提供;担保与责任限制以原许可证及适用法律为准。
额外费用与待核对事项
- 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
- 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
查看原文依据
https://github.com/sub-t/blog-template/blob/main/LICENSEhttps://github.com/sub-t/blog-template/blob/main/README.mdPermission is hereby granted, free of charge
许可证原文
DeepSeek 根据仓库许可证和 README 整理 ·2026-10-03。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。
项目核对记录与介绍依据
模板资料
- 来源平台
- GitHub
- 资料与维护参考分
- 资料较完整 · 86 / 100
- 技术栈
- Next.js · React
- 网站类型
- 博客
这个分数如何计算
本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。
这个项目需要核对什么
- 记录的仓库更新时间
- 2025-04-23
- 截图检查日期
- 2026-10-03
已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。
目录记录的主要技术栈是 Next.js。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。
查看具体选型方法 →介绍的制作与核对状态
介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。
已完成服务器许可规则与 AI 来源核对;未经过人工编辑审核。
查看当时使用的来源资料
SHA-256: cfb6ce401aaa2e7fb6c1036f52c8d3f567bb0015f0cff05a454636bf9cf2d623
2026-10-03T00:40:49.059Z
来源文件 / 仓库# Blog Template A simple personal blog template. You can start blogging just by adding markdown files to the `_posts` directory. Of course, you can also reuse articles from platforms like Zenn or Qiita. For more details, please refer to the following article: [Created a blog template with Next.js + GitHub Pages →](https://zenn.dev/subt/articles/957bd5d01485e1) ## Demo https://sub-t.github.io/blog-template/ ## Features - Responsive design - Dark mode support - Pagination on the article list page - Table of contents - SEO optimized with `next-seo` - OGP support ## Development ```bash git clone https://github.com/sub-t/blog-template project-name cd project-name yarn yarn dev ``` ## Deployment Refer to this article for deployment instructions: [Deploying a Next.js Blog to GitHub Pages →](https://jamband.github.io/blog/2021/08/deploy-nextjs-app-to-github-pages/) ## License MIT License --- # ブログテンプレート 個人ブログ向けのシンプルなテンプレートです。 `_posts` ディレクトリに Markdown ファイルを追加するだけでブログを始められます。もちろん、Zenn や Qiita に投稿した記事を流用することも可能です。 詳細は以下の記事をご覧ください: [Next.js + GitHub Pagesのブログテンプレートを作った →](https://zenn.dev/subt/articles/957bd5d01485e1) ## デモ https://sub-t.github.io/blog-template/ ## 特徴 - レスポンシブ対応 - ダークモード対応 - 記事一覧ページにページネーションあり - 目次付き - `next-seo` による SEO 対策済み - OGP 対応 ## 開発方法 ```bash git clone https://github.com/sub-t/blog-template project-name cd project-name yarn yarn dev ``` ## デプロイ方法 こちらの記事を参考にしてください: [Next.js で作ったブログを GitHub Pages にデプロイする →](https://jamband.github.io/blog/2021/08/deploy-nextjs-app-to-github-pages/) ## ライセンス MIT ライセンス
看看同类模板
对比同技术栈与用途的模板,找到更适合的视觉与内容结构。

tailwind-nextjs-starter-blog
tailwind-nextjs-starter-blog 是一个面向个人技术博客的 Next.js 与 Tailwind CSS 启动模板,其 v2 版本基于 App Router 与 React Server Comp…
Next.js · 博客

Nextjs-tailwindcss-blog-template
⭐Build SEO optimized personal blog website with Next.js, Tailwind CSS and Contentlayer. If you want to learn t…
Next.js · 博客

Next-js-Blog-Boilerplate
Next-js-Blog-Boilerplate 是一套面向个人与技术博客的启动代码,基于 Next.js 12 与 Tailwind CSS 3 构建,同时集成了 TypeScript、ESLint、Prettier …
Next.js · 博客

nextjs-blog-theme
nextjs-blog-theme 是 Netlify 团队维护的一个博客启动模板,基于 Next.js 15(Pages Router)和 Tailwind CSS 4.x 构建,设计由 Bejamas 机构完成。
Next.js · 博客

blog
🚀 My personal blog made with Tailwind CSS and NextJS. Template from Timlrx. Feel free to fork, follow and use…
Next.js · 博客

tailnext
Tailnext 是一个基于 Next.js 14 App Router 和 Tailwind CSS 的免费开源模板,由 onWidget 团队创建并维护。
Next.js · 博客
