Jekyll博客

Jekyll-Blog_1Column-Example — Jekyll 博客模板

作者 BCasal

基于 Jekyll 的单栏博客示例，在 jekyll new 默认结构上加入分页、站内搜索与 Gulp 构建流程，可直接部署到 GitHub Pages。

打开源站下载源码 ZIP

看看你的网站会是什么样

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

3 个预览视图

桌面端首页1 / 3

访问演示网站在新标签页打开

桌面端截图首屏预览

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

全部页面与视图 3

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

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

值得关注的模板亮点

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

在 jekyll new 默认结构上定制，单栏博客布局

集成 Simple Jekyll Search 站内搜索与 Jekyll Paginate 文章分页

使用 Gulp 组织构建：Jekyll 生成、BrowserSync 本地服务、Sass 前缀与压缩

README 说明可直接配合 GitHub Pages 使用

使用 Font Awesome 图标字体

MIT 许可的免费版本，允许修改、商用与分发

模板详细介绍

这是一个用 Jekyll 搭建的单栏博客示例，作者在 `jekyll new .` 生成的默认结构上做了补充和定制。仓库说明中写明它已准备好用于 GitHub Pages，并提供了从克隆、重命名、安装依赖、修改 `_config.yml` 到运行 `gulp` 的完整命令序列。

构建流程由 Gulp 驱动：`gulp` 命令会执行 Jekyll 与 Serve 两个任务，前者相当于默认 Jekyll 项目中的 `jekyll serve`（但不启动本地服务器），后者用 BrowserSync 在 `_site` 目录上启动本地服务；另有 Sass 任务对已编译的 CSS 做加前缀和压缩。README 提醒首次启动 browser-sync 时页面有时显示不正确，需要手动刷新浏览器。

功能层面，模板集成了 Simple Jekyll Search 站内搜索、Jekyll Paginate 文章分页，以及 Font Awesome 图标字体。页面背景图来自 Openclipart 与 wallpaperswide 两个外部来源。仓库创建于 2016 年，之后未再更新，依赖与第三方插件的可用性需自行核对。

Jekyll博客

适合你的项目吗？

适用场景

作为学习 Jekyll 单栏博客结构的参考示例
在 GitHub Pages 上托管个人静态博客
需要站内搜索与文章分页的轻量博客项目
希望用 Gulp 串联 Jekyll 构建与本地预览的开发流程

适合人群

熟悉 Jekyll 与 Gulp 基本命令的开发者
需要单栏、以文章列表为主的博客站点
计划部署到 GitHub Pages 的个人项目
想在此基础上二次修改主题与样式的使用者

上手与定制指南

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

1
克隆仓库后重命名目录并进入，按 README 执行 `sudo gem install jekyll-paginate` 与 `npm install`
2
编辑 `_config.yml` 完成站点配置，再运行 `gulp` 启动构建与本地服务
3
首次启动 browser-sync 时页面可能显示不正确，需要手动刷新浏览器
4
仓库自 2016 年后未更新，Jekyll、Gulp 及第三方插件版本需自行核对兼容性
5
演示图片、字体、图标等第三方素材需按各自许可单独核对，MIT 许可仅覆盖该版本代码

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

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

使用时需要遵守

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

额外费用与待核对事项

演示图片、字体、图标及其他第三方素材需按各自许可核对，不能仅凭代码的 MIT 许可判断。
域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
使用前需自行安装依赖：通过 sudo gem install jekyll-paginate 安装 Jekyll 分页插件，并用 npm install 安装 Node/Gulp 相关依赖，环境需具备 Ruby gem 与 npm。
需手动编辑 _config.yml 完成站点配置后才能正常构建与运行。
已知限制：首次启动 browser-sync 时页面有时无法正确显示，需手动刷新浏览器才能正常查看。
站内搜索功能依赖第三方插件 Simple Jekyll Search（作者 Christian Fei），该插件按其自身许可分发，需单独核对许可与可用性。
文章分页功能依赖第三方插件 Jekyll Paginate，需单独安装并遵循其自身许可。
图标使用第三方 Font Awesome 图标字体，需遵循其自身许可，MIT 许可不覆盖该字体资源。
页面背景图来自 Openclipart 与 wallpaperswide 两个外部来源，需按各自站点许可单独核对使用条件。

查看原文依据

Permission is hereby granted, free of charge
许可证原文

// install dep. $ sudo gem install jekyll-paginate $ npm install
README 原文

// config $ nano _config.yml
README 原文

> WARNING!!! Algunas veces, la primera vez que arranca browser-sync no muestra > correctamente la página, para visualizar la página hay que refrescar el > navegador manualmente, et voilà !
README 原文

### Plugin de busqueda **Simple Jekyll Search** by ***Christian Fei***.
README 原文

### Plugin de paginación **Jekyll Paginate** para el listado de Posts.
README 原文

### Font Awesome Icon Font
README 原文

Backgrounds ( [Cabecera](https://openclipart.org/detail/221300/abstract-polygon-background), [Footer](http://wallpaperswide.com/polygon_green-wallpapers.html) )
README 原文

https://github.com/BCasal/Jekyll-Blog_1Column-Example/blob/gh-pages/LICENSE https://github.com/BCasal/Jekyll-Blog_1Column-Example/blob/gh-pages/README.md

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

项目核对记录与介绍依据

模板资料

来源平台: GitHub
资料与维护参考分: 资料一般 · 65 / 100
技术栈: Jekyll
网站类型: 博客

这个分数如何计算

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

这个项目需要核对什么

记录的仓库更新时间: 2016-06-13
截图检查日期: 2026-10-04

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

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

查看具体选型方法 →

介绍的制作与核对状态

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

审核声明: [email protected] · 2026-10-05

查看当时使用的来源资料

SHA-256: c6f569e3e52d68f3711a79118c9e4fed409f7fec163ba460fdca71276de7bf92

2026-10-04T18:10:22.988Z

来源文件 / 仓库

# Jekyll Blog 1 Column Example (Gulp) · [Demo](http://bcasal.github.io/Jekyll-Blog_1Column-Example/)

Blog creado con [**Jekyll**](https://jekyllrb.com/) a partir de la estructura básica
que genera por defecto el comando `$ jekyll new .` con algunos complementos,
modificaciones y personalizaciones.
**Jekyll** (
  [Docs](https://jekyllrb.com/docs/home/),
  [GitHub](https://github.com/jekyll/jekyll),
  [WebSite](https://jekyllrb.com/),
  [Twitter](https://twitter.com/jekyllrb),
  [License](https://github.com/jekyll/jekyll/blob/master/LICENSE)
  )

Listo para utilizar con
[GitHub-Pages!!!](https://help.github.com/articles/using-jekyll-as-a-static-site-generator-with-github-pages/)

```
// clone
$ git clone https://github.com/BCasal/Jekyll-Blog_1Column-Example.git

// rename
$ mv Jekyll-Blog_1Column-Example New-FolderName
$ cd New-FolderName

// install dep.
$ sudo gem install jekyll-paginate
$ npm install

// config
$ nano _config.yml

// run
$ gulp
```

## Tareas Gulp

El comando `$ gulp` ejecuta dos tareas "Jekyll" y "Serve".

* Jekyll, ejecuta las mismas tareas que si se ejecutara el comando `jekyll serve`
  en un proyecto Jekyll por defecto, excepto, montar el servidor local.
* Serve, se encarga de montar el servidor local con BrowserSync
  en la carpeta `_site`
  
Hay una tarea llamada "Sass" que procesa los archivos CSS ya compilados,
añadiendo los prefijos necesarios y minificando el archivo.

> WARNING!!! Algunas veces, la primera vez que arranca browser-sync no muestra
> correctamente la página, para visualizar la página hay que refrescar el
> navegador manualmente, et voilà !

## Complementos

### Plugin de busqueda **Simple Jekyll Search** by ***Christian Fei***.

Plugin (
  [Simple Jekyll Search](https://github.com/christian-fei/Simple-Jekyll-Search),
  [How to use](https://github.com/christian-fei/Simple-Jekyll-Search/blob/master/README.md),
  [License](https://github.com/christian-fei/Simple-Jekyll-Search/blob/master/LICENSE.md)
  )

Author (
  [WebSite](http://christian.fei.ninja/),
  [GitHub](https://github.com/christian-fei),
  [Twitter](https://twitter.com/christian_fei)
  )

### Plugin de paginación **Jekyll Paginate** para el listado de Posts.

Plugin (
  [Jekyll Paginate](https://github.com/jekyll/jekyll-paginate),
  [How to use](https://jekyllrb.com/docs/pagination/),
  [License](https://github.com/jekyll/jekyll-paginate/blob/master/LICENSE.txt)
  )

### Font Awesome Icon Font

Icon Font (
  [WebSite](http://fontawesome.io/),
  [How to use](https://fortawesome.github.io/Font-Awesome/examples/),
  [GitHub](https://github.com/FortAwesome/Font-Awesome/),
  [Twitter](https://twitter.com/fontawesome),
  [License](https://fortawesome.github.io/Font-Awesome/license/)
  )

## Imágenes

Backgrounds (
  [Cabecera](https://openclipart.org/detail/221300/abstract-polygon-background),
  [Footer](http://wallpaperswide.com/polygon_green-wallpapers.html)
  )

反馈内容错误