jekyll搭建个人主页

发表于 2022-07-18 更新于 2023-10-31 分类于 blog 阅读次数： Changyan：本文字数： 1.7k 阅读时长 ≈ 6 分钟

Jekyll 搭建个人主页的步骤与注意事项。

之前我的个人主页是基于 Jekyll + minimal 模板搭建的，23年10月改为了 Hexo + NexT。这里把之前用 jekyll 搭建个人网站的步骤与注意事项重新写一下，大家如果有需求可以自行查阅。

Jekyll的官方介绍

You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.
您可以在 _posts 目录中找到这篇文章。继续编辑并重新构建网站以查看您的更改。你可以用很多不同的方式重建网站，但最常见的方式是运行 jekyll serve，它启动一个 web 服务器，并在文件更新时自动重新生成你的网站。

To add new posts, simply add a file in the _posts directory that follows the convention YYYY-MM-DD-name-of-post.ext and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.
要添加新的帖子，只需在 _posts 目录中添加一个文件，该文件遵循惯例 YYYY-MM-DD-name-of-post.ext，并包含必要的前置内容。看看这篇文章的来源，了解一下它是如何工作的。

Jekyll also offers powerful support for code snippets. It uses Rouge by default for syntax highlighting, here are some tests. Jekyll 还提供了对代码片段的强大支持。默认情况下，它使用 Rouge 进行语法高亮显示，下面是一些测试。（为了符合现有的框架，改用了 Hexo 的高亮显示模板）

Ruby with line numbers:

def print_hi(name)
  puts "Hi, #{name}"
end
print_hi('Tom')
#=> prints 'Hi, Tom' to STDOUT.

Python with line numbers:

def print_hi(name):
    print("Hi, {}".format(name))

print_hi('Tom')
# prints 'Hi, Tom' to STDOUT.

C with line numbers:

void print_hi(string name) {
  printf("Hi, %s", name);
}
print_hi("Tom");
/* prints 'Hi, Tom' to STDOUT. */

Check out the Jekyll docs for more info on how to get the most out of Jekyll. File all bugs/feature requests at Jekyll’s GitHub repo. If you have questions, you can ask them on Jekyll Talk.
查看 Jekyll 文档了解更多关于如何充分利用 Jekyll 的信息。在 Jekyll 的 GitHub repo 中提交所有错误/功能请求。如果你有问题，可以在 Jekyll Talk 上提问。

Jekyll Matjek 模板

Features

Google Analytics
Disqus
GitHub project page
Tags and Categories
Modular CSS and JS includes (example)
Fancy "About" page

Installation

Clone or fork this repo and edit _config.yml as needed. 根据需要克隆或分支此 repo 并编辑 _config.yml。

Configuration

Most of the configurations can be found in _config.yml. The configurations listed below are specific to MatJek. If you are not using google_tracking_id or disqus_shortname, just remove them completely.
大多数配置可以在 _config.yml 中找到。下面列出的配置是 MatJek 特有的。如果您没有使用google_tracking_id 或 disqus_shortname，只需将它们完全删除即可。

github_profile: "github_profile_url"
user: "your_name" # Appears at sidebar
user_email: "your_email" # Appears at sidebar, remove whole variable if unwanted
contact_url: "google_form_link"
google_tracking_id: "google_analytics_ID"
disqus_shortname: "shortname_given_by_Disqus"

Edit the images in assets/res to suit your liking, but try to stick to the original resolutions. If you would like to enable comments in a post (disqus_shortname must be provided), add this line to the front matter of the post. 编辑 assets/res 中的图像以满足您的喜好，但尽量保持原始分辨率。如果你想在帖子中启用评论（必须提供disqus_shortname），请将这一行添加到帖子的首页。

1	comments: 1

Add tags and categories to your posts in the front matter as well. Multiple tags/categories can be assigned but need to be separated by spaces.
在文章的前面添加标签和类别。可以指定多个标记/类别，但需要用空格分隔。

1 2	categories: default default2 tags: test test2

Contributing

Bug reports and pull requests are welcomed on GitHub at https://github.com/shawnteoh/matjek. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the Contributor Covenant code of conduct. GitHub 上欢迎 Bug 报告和拉取请求，网址为 https://github.com/shawnteoh/matjek .该项目旨在成为一个安全、受欢迎的合作空间，参与者应遵守《参与者公约》的行为准则。

Development

To set up your environment to develop this theme, clone/fork the repo and run bundle install.
To test your theme, run bundle exec jekyll serve and open your browser at http://localhost:4000/matjek/. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal. 要设置环境以开发此主题，请克隆/分支 repo 并运行 bundle install。
要测试您的主题，请运行 bundle exec jekyll serve 并在浏览器中启动 http://localhost:4000/matjek/ .这将使用您的主题启动 Jekyll 服务器。像往常一样添加页面、文档、数据等来测试主题的内容。当你修改你的主题和内容时，你的网站会重新生成，你应该在刷新后在浏览器中看到更改，就像正常情况一样。

License

The theme is available as open source under the terms of the GPL v3 License.

Libraries

References

Jekyll安装

jekyll相当于一个编译工具，安装好jekyll后可以创建一个网站模板，通过 http://127.0.0.1:4000/ 访问网站。

利用jekyll可以实时修改刚刚创建的模板里的内容，并可以实时通过本地url预览改动后的效果。
预览完成后，将博客推送到代码仓库里，再通过 https://frankenadrixias.github.io/ 就可以访问到博客里面的内容了。
有了 Jekyll，可以不用每次改动一点点就把代码推送到仓库中进行预览，而是本地就可以预览。
GitHub 支持 jekyll，hexo等语法解析。

安装步骤

Windows 下的 jekyll 安装步骤：

1、首先安装 Ruby installer，版本选择3.1.x（更高版本目前有不兼容情况！） 按提示安装即可，除了路径以外可以一律默认，注意安装路径中不能有空格！

检查是否成功安装：

ruby -v

2、安装完成后会弹出一个窗口，此时输入3，再按回车。打开命令行执行：

注意事项

如果在本地构建 jekyll 项目，执行 bundle exec jekyll serve 时遇到以下报错情况：

1
2

GitHub Metadata: No GitHub API authentication could be found. Some fields may be missing or have incorrect data.
Liquid Exception: SSL_connect returned=1 errno=0 peeraddr=[::1]:443 state=error: certificate verify failed (unable to get local issuer certificate) in projects.md

请检查自己的所有代理/梯子/vpn，确保关闭后再重新执行 bundle exec jekyll serve 成功执行后的结果：

D:\Documents\PycharmProjects\Frankenadrixias>bundle exec jekyll serve
Configuration file: D:/Documents/PycharmProjects/Frankenadrixias/_config.yml
To use retry middleware with Faraday v2.0+, install `faraday-retry` gem
            Source: D:/Documents/PycharmProjects/Frankenadrixias
       Destination: D:/Documents/PycharmProjects/Frankenadrixias/_site
 Incremental build: disabled. Enable with --incremental
      Generating...
       Jekyll Feed: Generating feed for posts
   GitHub Metadata: No GitHub API authentication could be found. Some fields may be missing or have incorrect data.
                    done in 2.42 seconds.
 Auto-regeneration: enabled for 'D:/Documents/PycharmProjects/Frankenadrixias'
    Server address: http://127.0.0.1:4000/homepage/
  Server running... press ctrl-c to stop.

此时在浏览器内输入网址 http://127.0.0.1:4000/homepage/ 就可以在本地预览 jekyll 的构建结果了，同时可以更新本地内容，在浏览器端刷新即可。