简介
使用Jekyll主题非常便捷的搭建个人网站
工具
Github
Jekyll

1. 简介

引用Jekyll挂网的话来说“将纯文本转化为静态网站和博客”。Jekyll就是将目前最火热的标记语言Markdown直接变成 html 语言并进行输出。你只需要设置好格式,或者一行remote_theme代码引用他人已经做好的模板,再新建一个.md文件就可以开始写网站或者博客了。
它虽然是一个静态网站,但因为内容是.md文件,所以更新也很方便。只需要写好稿子、上传就好了,它完全不需要在本地部署任何东西,一切的一切都可以在GitHub上完成。

2. 操作

Jekyll是GitHub Pages默认推荐的网站托管服务,因此十分的便捷,不需要什么学习成本。但你仍需要知道一些Markdown语言的格式规范,放心这很简单,哪怕你只是个小学生。除此之外,你还需要掌握创建文件夹、GitHub基础操作。关于html的相关知识,并不要求你知道哪些语言标记代表什么含义,你只需要知道你面对一个模板,需要修改哪些内容就行;最简单的方法就是照着网页看那些内容需要替换成你自己的内容,再用查找功能在对应代码中找到就行;对了<a href=””>这样的超链接还是最好了解一下。

2.1 准备

首先你需要一个GitHub账号,但这很简单,你只需要去找相关的教程就好,这里就不从头介绍了。
  • 有了账号之后要新建一个仓库
    • 如果你有域名,想要使用一个独立的域名就参考配置域名这一节;如果你想作为之前域名的子页面就参考这个文档
    • 就如果如果你没有域名,就将仓库名设置为your name.github.io没有什么特殊意义,这是GitHub托管网页的格式。
设置好相应的.md文件,主页面最好使用index.md名命

2.2 添加Jekyll

  1. 在GitHub中你新建好的仓库的设置Settings界面选择Pages,设定好相应的要发布的分支Branch
  1. 最下面有一行字写着“Learn how to add a Jekyll theme to your site.”,在这里会显示出GitHub所默认支持的几种模板
  1. 这是我使用的模板-Cayman,他的分支还有支持神色模式,修改显示按钮和页面色彩、布局等
  1. 推荐几个Jekyll模板的网站
    1. GitHub jekyll-theme
    2. Jamstack Themes
    3. Jekyll themes
  1. 在你的仓库主界面<>code会出现一个_config.yml的文件
notion image

2.3 更换主题

  1. 如果你是直接在Settings-Pages里面选择的主题,里面的内容是theme: jekyll-theme-cayman
    1. 如果你想更改主题就在前面加上# 将之前的主题变成注释
    2. 或者删除
    3. 将新的主题加入或者采用remote_theme: lewismiddleton/cayman-dark的方式
 

2.4 关键内容修改

  1. 如果你使用的是远程出题那只要参考例子进行相关的内容修改就行
notion image
notion image
更多信息可以参考说明文档
  1. 如果你想做出更进一步的修改,那就只能找到主题的仓库进行Fork,生成自己的专属主题,在进行remote_theme 配置
  1. 下面列举一些我所知道的参数内容:
    1. 远程主题名设置为 your name/仓库名
    2. 在layouts文件里面的default.html修改页面设置
    3. 页面颜色在css/scss文件中修改
    4. 主题里面的_config.yml和你引用的仓库的_config.yml相比优先度较低
    5. 大部分原主题为了方便远程引用都会设置一些通配符,再修改的时候要注意
    6. 如果有页数参数,那就要把页数改为1才能看到自己上传的内容

2.6 关于延迟

  • 很多人修改后,发现目标页面部署后并没有发生变化,往往刷新好几次还是这样。
  • 这是由于网络延迟导致的,如果你使用了netlify或者是vercel就会更慢,有的时候还需要重新部署。
  • 这一点是相较于notion等平台作为博客比较不方便的一点。如果有大的修改的话,多等一会差不多就好了。

3.特点

这虽然是一种很便捷的部署方法,当然有其独特的优点,但也存在一些问题。

3.1 优点

  • 优点当然是小白化操作,而且还能够实现一些比较复杂的效果,兼具了美观和实用
  • 不需要代码环境,在本地也可以预览,除开延迟几乎可以做到即发布,即用
  • 如果你是用的freenom的域名或者GitHub的域名,那全过程都是免费的
  • Markdown语言的不足之处可以由html来补强,而且本身输出的就是html页面,所以也可以使用css库等
  • 升级网站模板或者更换网站模板都只需要一行主题代码
  • Markdown格式也为文档提供了更好的可迁移性

3.2 缺点

  • 需要有较好的文件管理能力,博客的一切都要自己创建文件夹、标签等进行分类
  • 发布和修改之间存在延迟
  • 博客的书写需要遵循一定规范,比如文件名要采用yyyy-mm-dd-name.md

4. 适用场景

 
Loading...
Wangcy
Wangcy
一个普通的干饭人🍜
小红书
公告
🎉
本博客基于NotionNext
📖
-- 最近更新 ---
1️⃣【旅行库】增加更多地方
2️⃣【五术】八字、六爻更新
3️⃣【我的日记】增加大量内容
4️⃣【我的图书】开版更新
🧧
🎁点我打赏🎁
🚨
由于加载机制问题,请非首次打开本站的人刷新(多次)后查看更新内容