[关闭]
@maorongrong 2016-09-13T08:39:16.000000Z 字数 2156 阅读 562

git pages搭建个人博客

Git


搭建过程

利用github pages建博客
Jekyll Themes模板

换上主题模板

从github上将模板克隆下来后,将仓库文件夹下的除了.git文件外全部删除,放入Jekyll的模板。
目录结构如下:

  1. - index.html:这是你博客的主页面,里面的内容就是你的主页了
  2. - _config.yml:这是你博客的基本配置文件,里面有你博客的名字,以及存放博主的一些基本信息
  3. - _layouts:这文件夹里面存放你每个页面的设计,一般有default.html(默认页面)和posts.html(博文页面)
  4. - _includes:这个文件夹里的的内容将会通用到你博客每个页面,起到一种便利的作用
  5. - _posts:这里面装的就是你的博文啦,记住,要用 markdown 语法写,要不上传会失败的。

写博文

在_posts中使用markdown 语法写博文,本地使用 jekyll 渲染后可按预期显示后,使用 git push origin 提交变动。

查看blog

浏览器输入https://zam121118.github.io (换成你的github账号)查看新提交的博文。

使用HyG的模板

具体修改可参看HyG项目readme

本地渲染

若要在本地渲染博文,请预装 rubyjekyll , windows用户可参考此文

添加评论系统

可以使用多说评论系统 ,注册后,返回的代码记住自己的 short_name

添加百度统计

注册百度统计

生成如下的个人标示:
hm.src = "//hm.baidu.com/hm.js?xxxxxxxxxxxx"xxxxx字符串

  1. <script>
  2. var _hmt = _hmt || [];
  3. (function() {
  4. var hm = document.createElement("script");
  5. hm.src = "//hm.baidu.com/hm.js?5eee93cbacd99ad9c8333398cdabeb53";
  6. var s = document.getElementsByTagName("script")[0];
  7. s.parentNode.insertBefore(hm, s);
  8. })();
  9. </script>

在_ports中写博文

关于本地渲染过程可以参考:How jekyll works!!!
注意: post文章头格式参考: YAML Front Matter

a.png-33.9kB

NOTE: 我之前blog写在作业部落中,一键导出功能导出的.md文件是utf-8 BOM编码格式。所以渲染会出问题,文件编码需转为 utf-8 without BOM; 不想找麻烦请将blog文件名全英。

_posts This folder contains your dynamic content/posts. the naming format is required to be @YEAR-MONTH-DATE-title.MARKUP@. If the data format is invalid Jekyll will not recognize the file as a post.

The date and title are automatically parsed from the filename of the post file. Additionally, each file must have YAML Front-Matter prepended to its content.

YAML Front-Matter is a valid YAML syntax specifying meta-data for the given file.

.md 文件开头格式如下:

  1. ---
  2. layout: post
  3. title: XXXXXXXXXXXXXX
  4. date: 2016-03-12 11:40:18
  5. categories: AAA
  6. tags: AAA BBB CCCC
  7. author: XXX XX
  8. ---
  9. * content
  10. {:toc} #this is used to generate directory
  11. abstruct........ # abstruct is 4 lines away from directory

更改Jekyll服务端口

本机若安装福晰阅读器,会与 jekyll 默认服务端口冲突,更改服务端口为1234

  1. # port
  2. port: 1234

本地执行

进入本地github博客仓库,在该目录下执行 jekyll serve 启动 jekyll, 浏览器键入 http://127.0.0.1:1234/ 查看本地渲染效果。

自定义主题信息

参见github--原模板小改动

修改网站ico

bitbug 在线生成你的网站小ico(16X16 is okay)。

forkHyG博客模板,在_includes目录下的 head.html 文件中更改你自己的ico名称

  1. <link rel="shortcut icon" href="/myfavico.ico?" type="image/x-icon">
  2. <link rel="icon" href="/myfavico.ico?" type="image/x-icon">
  3. <link rel="stylesheet" href="{{ "/css/fontawesome/css/font-awesome.min.css " | prepend: site.baseurl }}>"

myfavico.ico换成你的名字。

添加新批注
在作者公开此批注前,只有你和作者可见。
回复批注