orangelop

Jekyll 安装教程

2021-07-22

Jekyll 安装教程

序言

Jekyll是程序员们常用的博客引擎,它可以实时将markdown渲染为html文件,非常牛逼,现在就看看怎么样在本地搭建测试环境并发布网站

安装ruby

非常重要:目前不要选择3.0版本!!!会导致Jekyll初始化失败!!!

ruby-lang.org选择适合自己版本的安装器下载安装。

推荐选择ruby 2.7.4p191 (2021-07-07 revision a21a3b7d23)版本

安装完成后记得重启(Windows重启后才会添加环境变量,Linux和macOS可以跳过)

安装rubygems

rubygems.org下载rubygems的压缩包(随便哪一个),选取一个不含空格和中文的路径解压

打开终端,输入cd (你解压的路径,不含括号)切换至rubygems的目录

输入ruby .\setup.rb (Windows)或ruby setup.rb (macOS和Linux)

安装Jekyll和一些插件

输入gem install jekyll安装Jekyll

输入gem install jekyll-seo-tag安装(插件)jekyll-seo-tag(SEO优化)

输入gem install jekyll-feed安装(插件)jekyll-feed(rss)

创建新的博客

非常重要:开始下面的步骤之前请保证你终端所处的路径为你博客的路径且下面三种方法任选其一

自己编写博客样式

运行jekyll new (随便什么名字,不要含空格和汉字)1

阅读Jekyll官方wiki编写代码添加样式,Jekyll官方wiki:jekyllrb.com

点此跳转到注意事项

使用jekyllthemes.org主题中的一个来作为你博客的主题

输入cd (你博客从Github克隆的路径,不含括号)1

如果你是clone别人的github blog主题,请跳过这一章

jekyllthemes.org中挑选你喜欢的主题,记住主题的名字
在终端中输入gem install "你喜欢的主题的名字,含引号"1安装主题

使用Github上大神们编写的Jekyll主题

将repo克隆到本地,将里面的文件复制到你博客所在的路径

启动博客

如果需要使用subdomain请运行jekyll new (你选择使用的subdomain,不含括号)1并再次执行上一章的内容

输入jekyll serve1jekyll server1jekyll s1启动Jekyll进程

非常重要:不能关闭终端,关闭终端的话服务器也会关闭,按ctrl+C可以退出

在浏览器中输入127.0.0.1:4000访问

发布到网络上

Github Pages

先注册Github账号

创建以(你的Github用户名,不含括号).github.io命名的repo(现在也可以直接在repo的Settings中选择使用Github Pages)

方法1(强烈不推荐):每次写完文章直接把文章commit to master(那你直接不要在本地搭建这个环境了,脱裤子放屁(逃

方法2:下载Github Desktop或使用git来实时更新至github pages

使用Github Desktop

desktop.github.com下载最新版Github Desktop安装

配置好Github Desktop中你的博客的路径

每次更改需要填写summary后push origin再commit就可以了

git

git-scm.com中下载最新版git安装

然后配置Github的验证

输入git clone (你博客repo地址,不含括号) (本地博客的路径)1从Github服务器中克隆repo

code.visualstudio.com下载Visual Studio Code安装,写文章更加舒服,也可以使用其他编辑器如Sublime

配置完后写完文章请git commit -a1打开编辑器后填入summary关闭,推送所有更改;也可以选择性推送更改

输入git push提交更改

直接在服务器上执行此教程

整挺好哈,那你还需要一个git服务器,每次在本地写完文章直接push到服务器刷新,更改样式也是的

写文章

使用编辑器打开工作区_posts1,在此文件夹下创建(文章标题,不含括号,详见Jekyll wiki).md(“_posts”是文章存储目录,一开始应该会有几篇默认的文章,删掉即可),写完保存并提交即可

添加独立页面

(视主题而定,有些主题在README里有说明,没有就看目录下的_config.yml1文件或者在_includes里的某一个yml文件),将其加到yml文件中,再放入_includes1里即可


配置Github的验证

创建SSH Key

添加到Github中并验证

自己编写博客代码时所要注意的事项

  1. 在本地博客路径下执行  2 3 4 5 6 7 8 9 10 11 12



Content
Return Click here...