欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

MacOS下安装Github+Jekyll 搭建博客

程序员文章站 2022-07-14 15:49:50
...

 

区别于其他的博客系统比如WordPress,Jekyll仅仅是一个解析引擎。它的作用是分析用户的配置文件并生成静态网页文件。 而访问者实际访问的是位于_site文件夹内的html。写了这么长时间的服务器动态脚本,Jeklly仿佛又回到了原点。 不过在Github的博客服务和其他工具的支持下,Jekyll有其他博客系统无法相比的优势:

  • 速度

    因为是静态网页,没有后台逻辑各种复杂交互。另外在Github支持下,你可以免费地获取一个还不错的博客系统。

  • 安全

    因为是静态网页,所以。。

  • 版本控制

    借助Github的代码仓库,天然融合了版本控制功能。而且也不用担心丢失问题。

安装

默认认为MacOS lion 10.7 下已经装好了ruby,macport,python,git,esay_install

  1. 注册Github

    github.com注册就可以了。

  2. 安装gem

    先把gem源码克隆下来
     $ git clone https://github.com/rubygems/rubygems.git
    
    进如gem工程的目录,运行setup.rb
     $ sudo ruby setup.rb
    
  3. 安装Jekyll

    运行命令
     $ sudo gem install jekyll
    

    安装完Jekyll后,基本上就可以生成网页文件了,方法可以参见这个链接

  4. 安装Jekyll-Bootstrap/部署到Github

    我们可能没有耐心从零开始配置一个blog,Jekyll提供了一个模板。 http://jekyllbootstrap.com/
    另外Github把名字为 USERNAME.github.com 的工程自动视为用户blog,我们可以借助这点直接部署到github上。
    以下引用http://jekyllbootstrap.com/index.html#start-now的安装方法
     $ git clone https://github.com/plusjade/jekyll-bootstrap.git USERNAME.github.com
     $ cd USERNAME.github.com
     $ git remote set-url origin git@github.com:USERNAME/USERNAME.github.com.git
     $ git push origin master
    
    push到Github上后,大概等待10分钟,服务器会把你的文件解析完成,然后访问 USERNAME.github.com 便可以看得到效果 另外在本地运行
     $ jekyll --server   
    

    也可以看到效果

配置

  1. RDiscount

    自带的markdown解析器有问题,对中文支持不好,下载RDiscount解析器:
     $ sudo gem install rdiscount
    
    修改 _config.yml 文件,修改或添加以下属性:
     markdown: rdiscount
    
  2. 实现代码高亮

    安装Pygments
     $ sudo easy_install Pygments
    
    _config.yml 中开启 Pygments
     pygments: true
    
    HOME_PATH/assets/themes/twitter/syntax 下放置default.css文件
    修改 HOME_PATH/_includes/themes/twitter/default.html 文件,在引用的样式表最下面加入
     <link href="/assets/themes//syntax/default.css" rel="stylesheet">
    
    之后就可以实现代码高亮了,如以下代码(百分号前的下划线是转义字符,粘贴时实际应该去掉)
         {\% highlight cpp \%}
         #include <iostream>
         int main(){
             std::cout << "Hello World!" << std::endl;   
             return 0;
         }
         {\% endhighlight \%}
    
  3. 新建Page

     rake page name="testpage.md"
    
    可以在新建的文件头部修改显示信息
     ---
     layout: page
     title: "testpage"
     description: ""
     group: navigation
     ---
    

    当group设置成navigation时,其会显示在网页的上边栏

  4. 新建Post

     rake post title="testpost"
    
    同样可以修改显示信息
     ---
     layout: post
     title: "testpost"
     description: ""
     category: category1
     tags: [tag1, tag2]
     ---
    

    tags标签可以是多个,用逗号隔开,逗号后面必须有空格

  5. 修改tagline BUG:在POST中,tagline一直显示固定信息. 将文件 HOME_PATH/_includes/themes/twitter/post.html 第二行改为(去掉反斜杠)

     <h1>\{\{ page.title \}\} <small>\{\{ page.tagline \}\}</small></h1>
    
相关标签: Github Jekyll