Jekyll博客

dragon-theme — Jekyll 博客模板

作者 onhernandes

Dragon 是一个基于 Jekyll 的博客主题，面向想直接写文章而不从零搭建主题的开发者，提供分类、标签、系列、关于页与 RSS 等页面结构。

打开源站下载源码 ZIP

看看你的网站会是什么样

浏览真实页面截图，比较内容排版与手机效果。点击下方缩略图切换，放大查看整页细节。

3 个预览视图
桌面端首页1 / 3
桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

全部页面与视图 3

截图用于了解视觉与布局，交互效果请以实际项目为准。

采集于 2026-10-03查看来源

值得关注的模板亮点

从已有项目资料中，快速了解它的特点。

01

基于 Jekyll 的博客主题，仓库自带示例文章说明数据字段写法

02

提供分类页、标签页、系列页、关于页与 RSS 订阅，并生成 sitemap.xml

03

使用 offcanvas 菜单与站内实时搜索

04

样式用 Sass/SCSS 编写，按页面拆分在 dev/scss/pages 下，partials 存放基础变量与基础样式

05

通过 _config.yml 配置站点信息、社交账号、系列与菜单链接

06

前端资源需用 Gulp 编译，README 给出本地运行步骤

模板详细介绍

Dragon 是一个 Jekyll 博客主题，仓库说明其定位是给想写博客但不想从零创建主题的开发者使用。主题使用 Sass/SCSS 组织样式，并通过 Gulp 编译前端资源；README 中列出初始 CSS 与 JS 的体积数据，属于作者自述，未在依赖清单中核对。

内容组织方面，主题自带分类页、标签页、系列页、关于页和 RSS 订阅，并提供 sitemap.xml；导航使用 offcanvas 菜单，站内提供实时搜索。站点信息、社交账号、系列与菜单链接等通过 _config.yml 配置。

样式文件按页面拆分在 dev/scss/pages 下，每个页面或页面类型有独立目录并按组件分离，partials 目录存放 _base.scss、_colors.scss 等基础文件，便于定位和修改具体页面的样式。

使用前需要先安装 Jekyll，克隆或 fork 仓库后编辑 _config.yml，参考 _posts 中的示例文章了解数据字段写法，并用 Gulp 编译资源文件。仓库最近更新时间为 2017 年，未提供更多维护状态说明。

Jekyll博客

适合你的项目吗？

适用场景

  • 个人开发者搭建以文章为主的静态博客
  • 需要按分类、标签或系列组织文章内容的站点
  • 希望直接修改 SCSS 文件调整页面样式的使用者
  • 需要 RSS 订阅与 sitemap.xml 的博客项目

适合人群

  • 熟悉 Jekyll 并愿意用 Gulp 编译资源的前端开发者
  • 想基于现成主题二次修改而不是从零写主题的人
  • 以文字内容为主、不需要复杂交互的博客作者

上手与定制指南

结合仓库当前版本的说明，按下面的资料检查内容、配置与运行要求。

  1. 1

    先安装 Jekyll，再克隆或 fork 仓库

  2. 2

    编辑 _config.yml 填写 baseurl、url、标题、描述、邮箱与社交账号等信息

  3. 3

    参考 _posts 中的示例文章了解分类、标签、系列等字段的写法

  4. 4

    本地运行需安装 Node.js，并依次执行 npm install -g gulp、npm install --save-dev 与 gulp

  5. 5

    仓库采用 MIT 许可，分发代码时需保留版权与许可声明；演示图片、字体、图标等第三方素材需单独核对许可

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 MIT 许可的免费版本；免费范围为该版本代码，不代表外部服务或第三方素材免费。

使用时需要遵守

  • 允许免费使用、修改、商用和分发该版本代码。
  • 分发代码副本或实质性部分时，保留原作者版权声明和完整 MIT 许可声明。
  • 代码按现状提供；担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

  • 演示图片、字体、图标及其他第三方素材需按各自许可核对，不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
查看原文依据

Permission is hereby granted, free of charge

许可证原文
https://github.com/onhernandes/dragon-theme/blob/master/LICENSEhttps://github.com/onhernandes/dragon-theme/blob/master/README.md

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-03。结果仅覆盖已读取资料，依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台
GitHub
资料与维护参考分
资料一般 · 57 / 100
技术栈
Jekyll
网站类型
博客
这个分数如何计算

本站按许可资料（最高30分）、演示链接（12分）、预览图（10分）、Star数（15分）、记录的维护时间（15分）、描述完整度（8分）、功能记录（5分）和分类资料（5分）计算。它不是代码、安全或性能测试，也不是 Google 评分；有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间
2017-08-07
截图检查日期
2026-10-03

已收录演示链接。请用你的内容与屏幕尺寸检查；有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 Jekyll。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料，不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

已完成服务器许可规则与 AI 来源核对；未经过人工编辑审核。

查看当时使用的来源资料

SHA-256: 97350116614e1048570601703a36e33c92558d005c68e384f5f3c7bc27f166bc

2026-10-03T02:11:12.485Z

来源文件 / 仓库
## Dragon Theme

![Dragon Theme Logo](logo.png)

This is a simple and cool theme for Jekyll, made for developers that want to write blog posts but don't want create a theme from scratch.

Features:

- Jekyll
- Gulp
- Sass/Scss
- Font icons
- Small (39.3kb of CSS and 8.8kb of JS initially)
- Offcanvas menu
- Live search
- Categories page
- About page
- Series page
- Tags page
- Feed RSS
- Info and colors are easy to customize!
- Sitemap.xml

![Screenshot](screenshot.png)

## Getting Started

1. [Install Jekyll](http://jekyllrb.com)
1. Clone or fork the [Dragon 
Theme](https://github.com/onhernandes/dragon-theme)
1. Edit `_config.yml` to personalize your site.
1. Check out the sample post in `_posts` to see examples for assigning all of the data.
1. Read the documentation below for customization.
1. **Compile your assets files with Gulp.**

## Settings

You have to set some infos on `_config.yml` to customize your site/blog.

```
# Site settings
baseurl: "" # the subpath of your site, e.g. /blog/ or empty.
url: "http://localhost:3000" # the base hostname & protocol for your site 
title: The title of your blog
description: A tiny and cool description
email: [email protected]
user_description: Anon Developer at Lorem Ipsum Dolor
email: [email protected]
facebook: your_username
instagram: your_username
twitter: your_username
github: your_username
spotify: your_username
```

## Theme SCSS and more

The SCSS is in 
[dev/scss](https://github.com/onhernandes/dragon-theme/tree/master/dev/scss) 
and the basic styles are in 
[dev/scss/pages/template](https://github.com/onhernandes/dragon-theme/tree/master/dev/scss/pages/template), 
the rest of theme is separated in folders, also inside of 
[dev/scss/pages](https://github.com/onhernandes/dragon-theme/tree/master/dev/scss/pages).

Each page(or kind of) has his own folder inside of 
[dev/scss/pages](https://github.com/onhernandes/dragon-theme/tree/master/dev/scss/pages) 
and then are component-separated. So if you want to change page' styles, you know where find the files.

The 
[partials](https://github.com/onhernandes/dragon-theme/tree/master/dev/scss/partials) 
folder has partials files like `_base.scss` and `_colors.scss`.

If you want to create post series, use the `series` on _config.yml, the same for creating projects and menu links.

## Running blog locally

In order to run Jekyll on local you need to:

- Install [NodeJS](https://nodejs.org/)
- Run `sudo npm install -g gulp`
- Run `sudo npm install --save-dev`
- Run `sudo gulp`

## Issues

If you're having problems with this theme and they aren't made by you, open and [issue](https://github.com/mhernandes/dragon-theme/issues)

## License

This theme is totally free, so anyone can just clone this and change whatever without worry about copyright or things like that.
反馈内容错误

看看同类模板

对比同技术栈与用途的模板，找到更适合的视觉与内容结构。

al-folio

al-folio

al-folio 是一个面向学者与研究人员的 Jekyll 作品集主题，设计简洁、响应式，适合搭建个人学术主页。

Jekyll · 作品集

minimal-mistakes

minimal-mistakes

:triangular_ruler: Jekyll theme for building a personal site, blog, project documentation, or portfolio.

Jekyll · 作品集

Beautiful Jekyll

Beautiful Jekyll

Beautiful Jekyll 是一个在 Jekyll 生态中经过长期打磨的博客主题，由 Dean Attali 维护，自 2015 年起积累了超过 5 万用户。

Jekyll · 博客

jekyll-TeXt-theme

jekyll-TeXt-theme

💎 🐳 A super customizable Jekyll theme for personal site, team site, blog, project, documentation, etc.

Jekyll · 博客

startbootstrap-clean-blog-jekyll

startbootstrap-clean-blog-jekyll

A Jekyll version of the Clean Blog theme by Start Bootstrap

Jekyll · 博客

So Simple

So Simple

So Simple 是 Michael Rose 开发的 Jekyll 主题，定位清晰：为文字和图片提供一个干净、可读性强的展示框架。

Jekyll · 博客