Blog 搭建与部署

搭建自己的博客

Posted by Miaocf on June 24, 2019

  将纯文本转换为静态博客网站,并将博客部署到 GitHubPage,绑定自有域名方便大家访问。

  在搭建自己的博客网站时,我希望只专注于组织内容,页面生成、部署等其他不关键的工作尽量简单。现在已经有了比较好的方案可以满足以上需求。在这里介绍如何花费较少的精力去搭建一个静态页面的个人博客。在这里只说一下大概过程,具体细节 search the web,你会得到你想要的一切。

1. 博客静态网站工具

   这里我们用 Markdown 格式去写一些博客,使用 JekyllHexo 等转换工具,将纯文本文件转换为 HTML 页面。Jekyll、Hexo 两者的主要区别在于,Jekyll 需要 Ruby 环境,而 Hexo 只需要 NodeJS 运行环境。    两者各有大量的主题可供选择,那么问题来了,究竟选择 Jekyll 还是 Hexo ?这里建议选择有你喜欢的主题的那个。因为我在搭博客的时候最先接触 Jekyll,所以在这里介绍一下 Jekyll 的配置方法。

具体环境安装参考官方文档。

2. 模版配置

  下载完模版后,需要修改 _config.yml 配置文件,里面包含了关于博客站点的大部分配置。 如果你具备一些前端技能,可以自定义模版里的一些样式。模版的目录结构可参考官方文档,文档中详细地介绍了每个文件的具体功能。

3. 生成静态页面

  在编辑博客时,保存操作会触发编译动作,将你的博客文本渲染成 Html 页面,在浏览器刷新即可看到最新的博客内容。在 Jekyll 转换完所有的文件之后,将默认在 _site 下放置生成的站点文件。你也可以在 _config.yml 中添加配置 destination: /Blog_source/ 设置相对路径,这样生成的站点文件就会存放在你设置的路径下,方便用 git 工具管理。

将生成的静态文件部署到 github page时,使用 bundle exec jekyll build编命令译,将 localhost:4000替换为你制定的域名, 得到的文件才是生产环境的页面。

_config.yml 文件中, permalink: /:title 可以控制文章链接显示格式,这个字段也可以有其他配置,如permalink: pretty

4. GitHub 设置

  在这里,你需要创建一个 github page repository,具体操作见文档。这个就是就是用来存放你站点文件的 repo。创建完毕之后,需要在 config.yml 文件中添加 github 相关的配置,配置项如下。

1
2
3
4
5
6
#gitment
owner: XXX
repo: XXX
branch: master
client_id: xxxxxxx
client_secret: xxxxxx

5. 绑定域名

  首先你需要掏点银子买个自己的域名(摊手),这里都是固定的操作没啥好说的,具体细节可以参考这位施主文章。

  当然你也可以不绑定域名,省下一笔银子来顿烧烤,但是作为一个独立 bloger ,自己的域名还是要有的,不然没有 bigger。

6. 添加评论和统计功能

  这个就需要你了解一点点前端的技能了,我们现说评论:评论有很多平台在做,比如“多说”,“畅言”,“友言”,“新浪云跟贴”,但大多都不太靠谱,关的关、封的封。这里 使用Gitment来实现博客的评论功能,具体细节可参考大神的文章。

  关于统计,这个看你自己需不需要加。我这里加的是百度统计,官方有较详细的接入文档。可以查看博客的浏览人数和页面UV、PV。

总结

使用 GitHub page 存放博客,充当免费服务器的角色,Jekyll 将文本解析成 html 页面,这样博客一经建成,就无须维护,只需要专心写内容就可以了。

关于转载

知识共享许可协议

本作品采用知识共享署名 4.0 国际许可协议 进行许可。 转载时请注明原文链接。图片在使用时请保留图片中的全部内容,可适当缩放并在引用处附上图片所在的文章链接。