文章目录

一、安装Ruby环境

https://rubyinstaller.org/downloads/ 下载 Ruby2.X的最新安装包,最好是带DEVKIT的,不建议下载3.X的,因为有些theme还不支持3.X的版本。

二、修改更新源

为了解决gem install以及bundle慢的问题,建议先更新源:

  • 修改gem更新源
1gem sources --add https://gems.ruby-china.com/ --remove https://rubygems.org/
2gem sources -l

确保更新源只有 gems.ruby-china.com

  • 设置bundle镜像
1bundle config mirror.https://rubygems.org https://gems.ruby-china.com

三、安装jekyll及其依赖

安装好Ruby环境后,使用下面的命令安装jekyll及其依赖

1gem install jekyll bundle webrick

四、新建博客站点

使用下面的命令新建一个blog站点

 1# jekyll new blog                                                                            
 2 Running bundle install in D:/myblogs/blog...                                                 
 3   Bundler: Fetching gem metadata from https://gems.ruby-china.com/...........                
 4   Bundler: Fetching gem metadata from https://gems.ruby-china.com/..                         
 5   Bundler: Resolving dependencies...                                                         
 6   Bundler: Using public_suffix 4.0.6                                                         
 7   Bundler: Using addressable 2.8.0                                                           
 8   Bundler: Using bundler 2.1.4                                                               
 9   Bundler: Using colorator 1.1.0                                                             
10   Bundler: Using concurrent-ruby 1.1.9                                                       
11   Bundler: Using eventmachine 1.2.7 (x64-mingw32)                                            
12   Bundler: Using http_parser.rb 0.6.0                                                        
13   Bundler: Using em-websocket 0.5.2                                                          
14   Bundler: Using ffi 1.15.3 (x64-mingw32)                                                    
15   Bundler: Using forwardable-extended 2.6.0                                                  
16   Bundler: Using i18n 1.8.10                                                                 
17   Bundler: Using sassc 2.4.0 (x64-mingw32)                                                   
18   Bundler: Using jekyll-sass-converter 2.1.0                                                 
19   Bundler: Using rb-fsevent 0.11.0                                                           
20   Bundler: Using rb-inotify 0.10.1                                                           
21   Bundler: Using listen 3.6.0                                                                
22   Bundler: Using jekyll-watch 2.2.1                                                          
23   Bundler: Fetching rexml 3.2.5                                                              
24   Bundler: Installing rexml 3.2.5                                                            
25   Bundler: Using kramdown 2.3.1                                                              
26   Bundler: Using kramdown-parser-gfm 1.1.0                                                   
27   Bundler: Using liquid 4.0.3                                                                
28   Bundler: Using mercenary 0.4.0                                                             
29   Bundler: Using pathutil 0.16.2                                                             
30   Bundler: Using rouge 3.26.0                                                                
31   Bundler: Using safe_yaml 1.0.5                                                             
32   Bundler: Using unicode-display_width 1.7.0                                                 
33   Bundler: Using terminal-table 2.0.0                                                        
34   Bundler: Using jekyll 4.2.0                                                                
35   Bundler: Fetching jekyll-feed 0.15.1                                                       
36   Bundler: Installing jekyll-feed 0.15.1                                                     
37   Bundler: Fetching jekyll-seo-tag 2.7.1                                                     
38   Bundler: Installing jekyll-seo-tag 2.7.1                                                   
39   Bundler: Fetching minima 2.5.1                                                             
40   Bundler: Installing minima 2.5.1                                                           
41   Bundler: Fetching thread_safe 0.3.6                                                        
42   Bundler: Installing thread_safe 0.3.6                                                      
43   Bundler: Fetching tzinfo 1.2.9                                                             
44   Bundler: Installing tzinfo 1.2.9                                                           
45   Bundler: Fetching tzinfo-data 1.2021.1                                                     
46   Bundler: Installing tzinfo-data 1.2021.1                                                   
47   Bundler: Fetching wdm 0.1.1                                                                
48   Bundler: Installing wdm 0.1.1 with native extensions                                       
49   Bundler: Bundle complete! 6 Gemfile dependencies, 35 gems now installed.                   
50   Bundler: Use `bundle info [gemname]` to see where a bundled gem is installed.              
51 New jekyll site installed in D:/myblogs/blog.  

五、启动本地服务预览博客

 1# cd blog
 2# bundle
 3# jekyll s
 4Configuration file: D:/myblogs/blog/_config.yml
 5            Source: D:/myblogs/blog
 6       Destination: D:/myblogs/blog/_site
 7 Incremental build: disabled. Enable with --incremental
 8      Generating...
 9       Jekyll Feed: Generating feed for posts
10                    done in 0.713 seconds.
11 Auto-regeneration: enabled for 'D:/myblogs/blog'
12    Server address: http://127.0.0.1:4000/
13  Server running... press ctrl-c to stop.

打开浏览器,浏览地址:http://127.0.0.1:4000/ 即可查看到页面了。

六、配置博客

在站点目录中有一个_config.yml文件,有以下配置项:

  • title: 站点的标题
  • email: 电子邮件地址
  • description: 站点的描述信息
  • baseurl: 站点子路径,比如:/blog
  • url: 站点地址:比如:http://example.com
  • twitter_username: 推特账号
  • github_username: github账号
  • theme: 主题颜色
  • plugins: 插件

根据自身的情况进行配置,如果修改了theme,建议使用:

1bundle

命令来进行打包安装。

七、写博客

我们要写博客时需要写在_posts目录下,如果没有则新建一个。 文件名要求按:

年-月-日-标题.md

的形式命名,比如:2021-08-10-welcome-to-jekyll.md

在md文件中要求前面有标注,格式:

1---
2layout: post
3title:  "Welcome to Jekyll!"
4date:   2021-08-10 15:24:37 +0800
5categories: jekyll update
6---
  • layout 用于展示的排版类型
  • title 博客的标题
  • date 博客的写作日期时间
  • categories 分类
  • tags 标签

注意:

  • layout需要与_config.yml文件中配置主题中有的layout匹配。
  • categories以及tags中的命名不能包括一些特殊符号,比如C++的+号

可以通过在站点目录使用如下命令查看主题所在路径:

1D:\myblogs\blog>bundle info --path minima
2D:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/minima-2.5.1

主题所在路径D:/Ruby27-x64/lib/ruby/gems/2.7.0/gems/minima-2.5.1中_layouts目录下可以看到所有本主题可以使用的layout。

写好后,可以通过第五步的方式查看。

八、可能出现的问题

1. Windows下使用jekyll server本地预览文章可能会出现not found的问题

Windows下使用jekyll server本地预览文章可能会出现not found的问题,但是在_site文件夹下这些文件都存在,这应该是编码问题导致。 jekyll server使用的是webrick进行处理的,在D:\Ruby27-x64\lib\ruby\2.7.0\webrick\httpservlet下备份filehandler.rb,然后搜索force_encoding, 把使用了该函数的变量都使用一次force_encoding(“UTF-8”)。笔者的webrick是1.7.0版本的,搜索下来有两处:

1path = req.path_info.dup.force_encoding(Encoding.find("filesystem"))

后面添加一句:

1path.force_encoding("UTF-8")

还有一处:

1expanded.force_encoding(req.path_info.encoding)

后面添加一句:

1expanded.force_encoding("UTF-8")

这样使用:

1jekyll s

进行本地预览就不会出现找不到页面的问题了。

2. 如果博客内容中出现了特定标识怎么办?

{% raw %} jekyll使用的Liquid来进行解析的,比如Liquid规定以{{开始,以}}结束的字符串视作标签Liquid,但如果博客内容中恰好需要使用到这样的符号对,却不是Liquid标签,产生了语法冲突怎么处理?

需要在这样的文字段前加上{% raw %}标识,{% endraw %}在文字段后加上把标识替换成endraw即可。

祝好!