Build my first blog by Hugo and Github, auto deploy by Travis <1> :: 漫步在数位灵魂之中

  • Hugo 是个快速产生静态网站的工具,golang开发,快速有效,有很多theme可以支持
  • Github 是个工程师必备良药,也支持Pages服务,就是静态网页,所以将Hugo建好的静态网页直接上传到Github是很合适的组合,而且是免费又快速,还不用自己维护,这世界怎么有这么佛心的服务
  • Travis 是第一次接触,大概了解了一下这是个提供高度自动化工具,只要写个简单的脚本,就可以支持很多自动化工作,刚好又高度整合Github。据说功能不仅止于此,有机会可以来做一些更复杂有趣的事情

安装 Hugo

mac使用者如果已经安装brew的话,只要输入以操作即可安装Hugo

brew install hugo

目前最新的版本应该是 0.56.3

建立博客

开启Terminal,只要输入底下的命令,Hugo马上会在blog这个目录下产生所有需要的资源和程序

Hugo new site blog

修改 config.toml

接着开始做一些修改,首先进入目录中需要修改config.toml,最重要的是新增theme,Hugo的生态系有相当多的theme,你可以选择你喜欢的加入,底下是我的第一版的设定:

baseURL = "https://chimerakang.github.io/"
languageCode = "en-us"
defaultContentLanguage = "zh-tw"
title = "Chimera's Blog"
theme = "terminal"
paginate = 5

[Author]
    name = "Chimera"

[params]
    contentTypeName = "posts"
    themeColor = "green"
    showMenuItems = 2
    # set theme to full screen width
    fullWidthTheme = false
    # center theme with default width
    centerTheme = false

[languages]
  [languages.en]
    title = "Walking with cybersoul"
    subtitle = "A easy, wishper for programmers"
    keywords = ""
    copyright = ""
    menuMore = "Show more"
    readMore = "Read more"
    readOtherPosts = "Read other posts"

    [languages.en.params.logo]
      logoText = "Terminal"
      logoHomeLink = "/"

    [languages.en.menu]
      [[languages.en.menu.main]]
        identifier = "about"
        name = "About"
        url = "/about/about"
      [[languages.en.menu.main]]
        identifier = "posts"
        name = "Posts"
        url = "/posts"

  [languages.zh-tw]
    title = "漫步在数位灵魂之中"
    subtitle = "对工程师的轻松小语"
    keywords = ""
    copyright = "Chimera"
    menuMore = "看更多"
    readMore = "读更多"
    readOtherPosts = "读其他的贴文"

    [languages.zh-tw.params.logo]
      logoText = "首页"
      logoHomeLink = "/"

    [languages.zh-tw.menu]
      [[languages.zh-tw.menu.main]]
        identifier = "about"
        name = "关于我"
        url = "/about/about"
      [[languages.zh-tw.menu.main]]
        identifier = "posts"
        name = "贴文"
        url = "/posts"

安装 Theme

接着你需要把theme安装起来,首先可以使用底下两个命令抓回来

You can also clone it directly to your Hugo folder:

git clone https://github.com/panr/hugo-theme-terminal.git themes/terminal 

If you don’t want to make any radical changes, it’s the best option, because you can get new updates when they are available. You can also include it as a git submodule:

git submodule add https://github.com/panr/hugo-theme-terminal.git themes/terminal

我是采用第一种做法,因为接下来可能需要修改套件,修改theme之后,push commit到github时不会有警告消息跳出,单纯简单多了

每个Theme都有一些不一样的特性,只要稍微看一下每个作者写的介绍应该可以很快上手

发布第一则贴文

终于要开始发废文了!!很简单,照着以操作即可发文

hugo new posts/first.md

Hugo就会在content/posts/下面产生一个first.md这个文件 此时什么都不需要做什么,在输入底下的命令:

hugo server

此时如果没有错误的话,Hugo会将所有网站处理好,并开始运行一个web service,此时开启网页输入 : “localhost:1313” 应该就可以看到你的废文了

此贴文有点长,先告一段落,接下来要开始介绍如何发布到Github

Build my first blog by Hugo and Github, auto deploy by Travis

参考: