使用 Jekyll 构建你的网站 - 初入门
文章目录
- 一、Jekyll介绍
- 二、Jekyll安装和启动
- 2.1 配置Ruby环境
- 1)Windows
- 2)macOS
- 2.2 安装 Jekyll
- 2.3 构建Jekyll项目
- 2.4 启动 Jekyll 服务
- 三、Jekyll常用命令
- 四、目录结构
- 4.1 主要目录
- 4.2 其他的约定目录
- 五、使用GitLink构建Jekyll博客
- 5.1 生成Jekyll项目
- 前提条件
- 第一步:登录GitLink平台(https://www.gitlink.org.cn/login)
- 第二步:进入设置>个人建站>我的站点
- 第三步:新建站点
- 第四步:去仓部进行部署
- 第五步:编写项目代码,完成初次部署及访问
- 5.2 本地编写Jekyll博客内容
- 5.2.1 clone仓库
- 5.2.2 本地调试
- 5.3.3 创建一篇文章
- 5.3.3.1 文章文件名
- 5.3.3.2 文章文件内容
- 5.3.3.3 示例
- 5.3 推送文章到仓库
- 5.4 一键部署启动
一、Jekyll介绍
Jekyll 是一个开源的静态网站生成器,支持 Markdown 和 HTML 两种文件类型,其中 HTML 使用了 Liquid 模板语言。
你可以使用 Markdown 编写内容,使用 HTML/CSS 来构建和展示,Jekyll 会将其编译为静态的 HTML。
Jekyll 使用 Ruby 引擎将用 Markdown 编写的文章转换成 HTML。
官网:
- https://jekyllrb.com/docs/
- https://jekyllcn.com/docs/home/
二、Jekyll安装和启动
Jekyll 网站 提供了 Linux、MacOS 和 Windows 安装说明。可点击跳转到官网查看
一般情况下,我们会将Jekyll项目拉取到本地,编写,调试,然后再推送到仓库上。
那么,我们有必要了解下如何在本地调试Jekyll项目。
2.1 配置Ruby环境
1)Windows
在 Windows 下配置 Ruby 环境,安装 RubyInstaller 即可。
RubyInstaller 是一个基于 Windows 的安装程序,包括了 Ruby、运行环境等。
从 RubyInstaller Downloads下载 Ruby+Devkit,选择推荐版本,使用默认配置安装。
安装完成之后,CMD 中输入 ruby -v 或者 gem -v,有输出版本即代表安装成功。
2)macOS
在 macOS Big Sur 11.x 版本下就已经自带了 Ruby 环境。
如果是以前版本的 macOS,使用 Homebrew 便可以安装 Ruby:brew install ruby。
同样的,在 macOS 下也可以使用 RubyGems 管理 Ruby 软件包。
2.2 安装 Jekyll
有了 Ruby 环境以及 RubyGems 就可以安装 Jekyll。
在命令行输入如下命令安装Jekyll:gem install jekyll
。
安装之后,输入 jekyll -v 检查是否安装成功。
2.3 构建Jekyll项目
注意:下文将讲述如何使用GitLink平台一键构建及部署Jekyll项目。
创建一个全新的工程,执行如下命令:
jekyll new learn-jekyll
执行完成之后,我们就成功创建了一个名为 learn-jekyll
的 Jekyll 项目。
2.4 启动 Jekyll 服务
Jekyll 环境搭建完成之后,进入到项目目录下(有 _config.yml 文件的目录),
输入启动命令:jekyll serve 或者 jekyll s。
若没有异常,启动服务后的默认端口为 4000,浏览器地址栏输入 localhost:4000 即可访问。
启动服务时使用命令:jekyll s --drafts,可以同时访问草稿(_drafts)目录下的文章。
三、Jekyll常用命令
安装完 Jekyll 之后,系统环境中就有了 jekyll 这个可执行的命令, 这里列举几个常用命令:
- jekyll new PATH - 创建新项目
- jekyll new PATH --blank - 创建新的空项目
- jekyll build 或 jekyll b - 构建项目,生成可部署的 _site 目录
- jekyll serve 或 jekyll s - 构建并运行项目,会自动监听文件变化,不需要反复执行
- jekyll clean - 清除所有的构建产物
- jekyll new-theme - 创建一个新的主题脚手架
- jekyll doctor - 诊断,输出所有已经废弃的依赖包或者有问题的配置
四、目录结构
4.1 主要目录
一般情况下,Jekyll项目构建完成后,包括如下文件和文件夹:
- _posts: 用于存放博客文章。
- _site: 用于存放项目构建完成之后所生成的静态文件,也就是说,静态网站的所有文件都会来源于此,其中 CSS 文件、JS 文件以及图片文件,会存放在该目录下的 assets 文件夹中。我们可以直接把该目录下的文件拿去部署。
- about.markdown: “关于页”的内容。在执行构建时会被转化成 html 文件,放置于 _site 目录下。
- index.markdown: “主页”的内容。在执行构建时会被转化成 html 文件,放置于 _site 目录下。
- 404.html: “404 页”的内容。
- _config.yml: Jekyll 的全站配置文件,一些全局配置会写在这个文件内,比如 collections,默认文件/路径,等等。总之,这里可以自定义很多东西
- .gitignore: 创建项目时会自动生成,不需要纳入到 CVS 的文件存放于此
- Gemfile& Gemfile.lock 存放项目所依赖的 Ruby gems
4.2 其他的约定目录
除了上面提到的几个目录,我们还可以添加其它的,Jekyll 会自动识别出它们,执行相应的处理。
_data - 网站所需要的数据文件(相当于一个小型数据库)
_drafts - 博客草稿,不会被构建成静态文件,也不会公开
_layouts - 布局文件,相当于一类页面(比如博客类页面)的“父类”
_includes - 小模块,属于 HTML 文件的一部分,可以在多个页面中复用,比如导航(navigation)、脚注(footer)等
五、使用GitLink构建Jekyll博客
5.1 生成Jekyll项目
我们也可以使用GitLink平台直接新建一个Jekyll项目。
GitLink平台内置了多个模板,大家可以选择自己喜欢的模板进行构建。
同时,GitLink平台支持一键部署Jekyll项目,解决大家购买服务器,手动部署的困扰。
前提条件
- 拥有一个GitLink平台的账号,可通过如下链接进行注册:https://www.gitlink.org.cn/register
- GitLink平台账号已完成实名认证。
第一步:登录GitLink平台(https://www.gitlink.org.cn/login)
第二步:进入设置>个人建站>我的站点
如果用户未完成实名认证审核,将提示“您尚未通过实名认证,无法使用此服务,如需使用,请先进行实名认证。”, 可点击“前往验证”完成实名认证。
第三步:新建站点
第四步:去仓部进行部署
第五步:编写项目代码,完成初次部署及访问
5.2 本地编写Jekyll博客内容
上面操作,我们已经基于GitLink新建了一个带有模板的Jekyll项目。
5.2.1 clone仓库
我们可以clone
仓库到本地,编写博客内容。
我们clone
的仓库代码如下图所示:
5.2.2 本地调试
注意:如果调试中遇到困难,可能先搜索网上可靠解决方法。 如果无法解决,推荐跳过该步骤,直接在GitLink平台部署。
由于项目是哟Gemfile
管理依赖,我们可以使用命令一键安装依赖包:bundle install
Bundle命令详解:
# 显示所有的依赖包
$ bundle show# 显示指定gem包的安装位置
$ bundle show [gemname]# 检查系统中缺少那些项目依赖的gem包
# 注:如果系统中存在所有项目依赖的包,则会输出:The Gemfile's dependencies are satisfied
$ bundle check# 安装项目依赖的所有gem包
# 注:此命令会尝试更新系统中已存在的gem包
$ bundle install# 安装指定的gem包
$ bundle install [gemname]# 更新系统中存在的项目依赖包,并同时更新项目Gemfile.lock文件
$ bundle update# 更新系统中指定的gem包信息,并同时更新项目Gemfile.lock中指定的包信息
$ bundle update [gemname]# 向项目中添加新的gem包引用
$ gem [gemname], [ver]# 你还可以指定包依赖关系
$ gem [gemname], :require => [dependence_gemname]# 你甚至还可以指定gem包的git源
$ gem [gemname], :git => [git_source_url]# 锁定当前环境
# 可以使用bundle lock来锁定当前环境,这样便不能通过bundle update来更新依赖包的版本,保证了统一的环境
$ bundle lock# 解除锁定
$ bundle unlock# 打包当装环境
# bundle package会把当前所有信赖的包都放到 ./vendor/cache/ 目录下,发布时可用来保证包版本的一致性。
$ bundle package
如果我们不基于Gemfile
安装依赖,直接启动Jekyll服务, 可能会由于未安装依赖包遇到如下错误raise_not_found!': Could not find gem 'xxx' in locally installed gems. (Bundler::GemNotFound)
,只需要使用 gem
对缺失的依赖包进行安装即可。
bundler版本与锁定不一致,导致的报错:
其他类似的版本问题解决法方法一致。
- 修改
Gemfile.lock
中的版本为你电脑已安装的版本 - 重新执行
bundle install
- 再尝试启动服务:
jekyll s
5.3.3 创建一篇文章
创建文章很简单。你需要做的就是在 _post 目录下使用正确的格式和扩展名创建一个新文件,这样就完成了。
5.3.3.1 文章文件名
Jekyll 要求一篇文章的文件名遵循下面的格式: 年-月-日-标题.MARKUP
。
在这里,年是 4 位数字,月和日都是 2 位数字。MARKUP扩展名代表了这篇文章是用什么格式写的。下面是一些合法的文件名的例子:
2011-12-31-new-years-eve-is-awesome.md
2012-09-12-how-to-write-a-blog.textile
5.3.3.2 文章文件内容
所有博客文章顶部必须有一段 YAML 头信息(YAML front- matter)。
在它下面,就可以选择你喜欢的格式来写文章。
Jekyll 支持 Markdown,以及其他众多格式的扩展,其中就包括十分流行的 Textile。
这些格式都有自己的方式来标记文章中不同类型的内容,所以你首先需要熟悉这些格式并选择一种最符合你需求的。
下面是参考
---
layout: post
title: "Welcome to Jekyll!" # 文章标题
date: 2021-08-29 11:28:12 +0530
categories: jekyll update
---这部分是文章的具体内容,可以自定义编写。
5.3.3.3 示例
下面是我写的文章参考:
文件名:2023-12-25-API自动化测试框架.markdown
---
layout: post
title: "使用 Jekyll 构建你的网站 -> 初入门"
date: 2023-12-25 13:54:58 +0800
categories: jekyll update
---## 一、Jekyll介绍
Jekyll 是一个开源的静态网站生成器,支持 Markdown 和 HTML 两种文件类型,其中 HTML 使用了 Liquid 模板语言。
你可以使用 Markdown 编写内容,使用 HTML/CSS 来构建和展示,Jekyll 会将其编译为静态的 HTML。
Jekyll 使用 Ruby 引擎将用 Markdown 编写的文章转换成 HTML。官网:
- https://jekyllrb.com/docs/
- https://jekyllcn.com/docs/home/
渲染后的效果如下所示:
-
首页
-
文章详情
5.3 推送文章到仓库
上面我们已经编辑好博客的内容,我们就可以将本地编辑好的内容推送到仓库,使用GitLink平台实现一键部署。
git推送命令参考:
git add .
git commit -m "commit信息"
git push
5.4 一键部署启动
进入Jekyll项目对应的仓库,找到“服务>个人建站” ,进入页面。
点击“去部署”按钮,重新部署。
部署成功后,就可以访问博客主页啦~
相关文章:

使用 Jekyll 构建你的网站 - 初入门
文章目录 一、Jekyll介绍二、Jekyll安装和启动2.1 配置Ruby环境1)Windows2)macOS 2.2 安装 Jekyll2.3 构建Jekyll项目2.4 启动 Jekyll 服务 三、Jekyll常用命令四、目录结构4.1 主要目录4.2 其他的约定目录 五、使用GitLink构建Jekyll博客5.1 生成Jekyll…...
【数据库】postgressql设置数据库执行超时时间
在这篇文章中,我们将深入探讨PostgreSQL数据库中的一个关键设置:SET statement_timeout。这个设置对于管理数据库性能和优化查询执行时间非常重要。让我们一起来了解它的工作原理以及如何有效地使用它。 什么是statement_timeout? statemen…...
SQL语言之DDL
目录结构 SQL语言之DDLDDL操作数据库查询数据库创建数据库删除数据库使用某个数据库案例 DDL操作表创建表查看表结构查询表修改表添加字段删除字段修改字段的类型修改字段名和字段类型 修改表名删除表案例 SQL语言之DDL DDL:数据定义语言,用来定义数…...
hive高级查询(2)
-- 分组查询 SELECT sex,SUM(mark) sum_mark FROM score GROUP BY sex HAVING sum_mark > 555; SELECT sex,sum_mark FROM( SELECT sex,SUM(mark) sum_mark FROM score GROUP BY sex ) t WHERE sum_mark > 555; SELECT AVG(gid),SUM(gid)/COUNT(gid) FROM …...

golang的jwt学习笔记
文章目录 初始化项目加密一步一步编写程序另一个参数--加密方式关于StandardClaims 解密解析出来的怎么用关于`MapClaims`上面使用结构体的全代码实战项目关于验证这个项目的前端初始化项目 自然第一步是暗转jwt-go的依赖啦 #go get github.com/golang-jwt/jwt/v5 go get githu…...

第十五节TypeScript 接口
1、简介 接口是一系列抽象方法的声明,是一些方法特征的集合,这些方法都应该是抽象的,需要有由具体的类去实现,然后第三方就可以通过这组抽象方法调用,让具体的类执行具体的方法。 2、接口的定义 interface interface_…...

【hadoop】解决浏览器不能访问Hadoop的50070、8088等端口?!
【hadoop】解决浏览器不能访问Hadoop的50070、8088等端口?!😎 前言🙌【hadoop】解决浏览器不能访问Hadoop的50070、8088等端口?!查看自己的配置文件:最终成功访问如图所示: 总结撒花…...
14.bash shell中的for/while/until循环
文章目录 shell循环语句for命令**读取列表中的值****读取列表中的复杂值****从变量读取列表**迭代数组**从命令读取值****用通配符读取目录**C语言风格的shell for循环 shell循环while命令shell 循环的until命令shell循环跳出的break/continue命令break命令continue命令trick 欢…...

RPC(6):RMI实现RPC
1RMI简介 RMI(Remote Method Invocation) 远程方法调用。 RMI是从JDK1.2推出的功能,它可以实现在一个Java应用中可以像调用本地方法一样调用另一个服务器中Java应用(JVM)中的内容。 RMI 是Java语言的远程调用,无法实现跨语言。…...

strlen和sizeof的初步理解
大家好我是Beilef,一个美好的下我接触到编程并且逐渐喜欢。我虽然不是科班出身但是我会更加努力地去学,有啥不对的地方请斧正 文章目录 目录 文章目录 前言 想必大家对sizeof肯定很了解,那对strlen又了解多少。其实这个问题应该让不少人困扰。…...

纯CSS的华为充电动画,它来了
📢 鸿蒙专栏:想学鸿蒙的,冲 📢 C语言专栏:想学C语言的,冲 📢 VUE专栏:想学VUE的,冲这里 📢 Krpano专栏:想学Krpano的,冲 🔔…...
在架构设计中,前后端分离有什么好处?
前后端分离是一种架构设计模式,将前端和后端的开发分别独立进行,它带来了多方面的好处: 1、独立开发和维护: 前后端分离允许前端和后端开发团队独立进行工作。这意味着两个团队可以并行开发,提高了整体的开发效率。前…...
C语言中的结构体和联合体:异同及应用
文章目录 C语言中的结构体和联合体:异同及应用1. 结构体(Struct)的概述代码示例: 2. 联合体(Union)的概述代码示例: 3. 结构体与联合体的异同点相同点:不同点:代码说明 结…...

文件夹共享(普通共享和高级共享的区别)防火墙设置(包括了jdk安装和Tomcat)
文章目录 一、共享文件1.1为什么需要配置文件夹共享功能?1.2配置文件共享功能1.3高级共享和普通共享的区别: 二、防火墙设置2.1先要在虚拟机上安装JDK和Tomcat供外部访问。2.2设置防火墙: 一、共享文件 1.1为什么需要配置文件夹共享功能&…...
❀My排序算法学习之冒泡排序❀
目录 冒泡排序(Bubble Sort):) 一、定义 二、算法原理 三、算法分析 时间复杂度 算法稳定性 算法描述 C语言 C++ 算法比较 插入排序 选择排序 快速排序 归并排序 冒泡排序(Bubble Sort):) 一、定义 冒泡排序(Bubble Sort),是一种计算机科学领域的较简单…...

服务器数据恢复-raid6离线磁盘强制上线后分区打不开的数据恢复案例
服务器数据恢复环境: 服务器上有一组由12块硬盘组建的raid6磁盘阵列,raid6阵列上层有一个lun,映射到WINDOWS系统上使用,WINDOWS系统划分了一个GPT分区。 服务器故障&分析: 服务器在运行过程中突然无法访问。对服务…...

Zookeeper在分布式命名服务中的实践
Java学习面试指南:https://javaxiaobear.cn 命名服务是为系统中的资源提供标识能力。ZooKeeper的命名服务主要是利用ZooKeeper节点的树形分层结构和子节点的顺序维护能力,来为分布式系统中的资源命名。 哪些应用场景需要用到分布式命名服务呢࿱…...

说说 Spring Boot 实现接口幂等性有哪几种方案?
一、什么是幂等性 幂等是一个数学与计算机学概念,在数学中某一元运算为幂等时,其作用在任一元素两次后会和其作用一次的结果相同。 在计算机中编程中,一个幂等操作的特点是其任意多次执行所产生的影响均与一次执行的影响相同。幂等函数或幂等…...

Dash中的callback的使用 多input 6
代码说明 import plotly.express as pxmport plotly.express as px用于导入plotly.express模块并给它起一个别名px。这样在后续的代码中,你可以使用px来代替plotly.express,使代码更加简洁。 plotly.express是Plotly的一个子模块,用于快速创…...
平方矩阵()
平方矩阵1 平方矩阵2 曼哈顿距离 #include<iostream> #include<algorithm> #include<cstdio> #include<cstring>using namespace std;const int N 110;int n; int a[N][N];int main() {while(cin >> n, n){for (int i 0; i < n; i )fo…...
在rocky linux 9.5上在线安装 docker
前面是指南,后面是日志 sudo dnf config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo sudo dnf install docker-ce docker-ce-cli containerd.io -y docker version sudo systemctl start docker sudo systemctl status docker …...

定时器任务——若依源码分析
分析util包下面的工具类schedule utils: ScheduleUtils 是若依中用于与 Quartz 框架交互的工具类,封装了定时任务的 创建、更新、暂停、删除等核心逻辑。 createScheduleJob createScheduleJob 用于将任务注册到 Quartz,先构建任务的 JobD…...
工程地质软件市场:发展现状、趋势与策略建议
一、引言 在工程建设领域,准确把握地质条件是确保项目顺利推进和安全运营的关键。工程地质软件作为处理、分析、模拟和展示工程地质数据的重要工具,正发挥着日益重要的作用。它凭借强大的数据处理能力、三维建模功能、空间分析工具和可视化展示手段&…...
C++ 基础特性深度解析
目录 引言 一、命名空间(namespace) C 中的命名空间 与 C 语言的对比 二、缺省参数 C 中的缺省参数 与 C 语言的对比 三、引用(reference) C 中的引用 与 C 语言的对比 四、inline(内联函数…...

Mysql中select查询语句的执行过程
目录 1、介绍 1.1、组件介绍 1.2、Sql执行顺序 2、执行流程 2.1. 连接与认证 2.2. 查询缓存 2.3. 语法解析(Parser) 2.4、执行sql 1. 预处理(Preprocessor) 2. 查询优化器(Optimizer) 3. 执行器…...

AirSim/Cosys-AirSim 游戏开发(四)外部固定位置监控相机
这个博客介绍了如何通过 settings.json 文件添加一个无人机外的 固定位置监控相机,因为在使用过程中发现 Airsim 对外部监控相机的描述模糊,而 Cosys-Airsim 在官方文档中没有提供外部监控相机设置,最后在源码示例中找到了,所以感…...

MFC 抛体运动模拟:常见问题解决与界面美化
在 MFC 中开发抛体运动模拟程序时,我们常遇到 轨迹残留、无效刷新、视觉单调、物理逻辑瑕疵 等问题。本文将针对这些痛点,详细解析原因并提供解决方案,同时兼顾界面美化,让模拟效果更专业、更高效。 问题一:历史轨迹与小球残影残留 现象 小球运动后,历史位置的 “残影”…...
MySQL 主从同步异常处理
阅读原文:https://www.xiaozaoshu.top/articles/mysql-m-s-update-pk MySQL 做双主,遇到的这个错误: Could not execute Update_rows event on table ... Error_code: 1032是 MySQL 主从复制时的经典错误之一,通常表示ÿ…...
Python常用模块:time、os、shutil与flask初探
一、Flask初探 & PyCharm终端配置 目的: 快速搭建小型Web服务器以提供数据。 工具: 第三方Web框架 Flask (需 pip install flask 安装)。 安装 Flask: 建议: 使用 PyCharm 内置的 Terminal (模拟命令行) 进行安装,避免频繁切换。 PyCharm Terminal 配置建议: 打开 Py…...
怎么开发一个网络协议模块(C语言框架)之(六) ——通用对象池总结(核心)
+---------------------------+ | operEntryTbl[] | ← 操作对象池 (对象数组) +---------------------------+ | 0 | 1 | 2 | ... | N-1 | +---------------------------+↓ 初始化时全部加入 +------------------------+ +-------------------------+ | …...