使用Hugo搭建个人博客

Hugo官网: https://gohugo.io
Hugo中文文档: https://www.gohugo.org/

1. 安装Hugo
  1. 从 hugo 的 GitHub 仓库 下载安装包,使用即可。我使用的是 hugo_0.40.3_Windows-64bit.zip 这个版本。下载解压后添加到 Windows 的系统环境变量的 PATH 中即可,不需安装。
  2. 验证Hugo是否安装成功:hugo version
2. 创建一个站点

创建一个博客新站点使用命令:hogo new site blog (其中blog为你的站点名字)
创建完成即生成你的博客目录,目录如下:

├─archetypes
├─content
├─data
├─layouts
├─static
├─themes
└─config.toml

配置你的 config.toml , 下面是我的配置:
demo预览

baseURL = "https://ohohhh.github.io/"
LanguageCode = "zh-CN"
HasCJKLanguage = true
title = "Ohohhh's blog"
theme = "blackburn"
author = "Ohohhh"
copyright = "© 2016. All rights reserved."
canonifyurls = true
paginate = 10

[indexes]
  tag = "tags"
  topic = "topics"

[params]
  BottomIntroduce = "Ohohhh's Blog"
  # Shown in the home page
  subtitle = "好好学习 天天向上"
  brand = "Ohohhh"
  googleAnalytics = "Your Google Analytics tracking ID"
  disqus = "Ohohhh"
  # CSS name for highlight.js
  highlightjs = "androidstudio"
  dateFormat = "02 Jan 2006, 15:04"

[menu]
  # Shown in the side menu.
  [[menu.main]]
    name = "Home"
    pre = "<i class='fa fa-home fa-fw'></i>"
    weight = 1
    identifier = "home"
    url = "/"
  [[menu.main]]
    name = "Posts"
    pre = "<i class='fa fa-list fa-fw'></i>"
    weight = 2
    identifier = "post"
    url = "/post/"
  [[menu.main]]
    name = "Tags"
    pre = "<i class='fa fa-tags fa-fw'></i>"
    weight = 3
    identifier = "tags"
    url = "/tags/"

[social]
  # Link your social networking accouns to the side menu
  # by entering your username or ID.
  weibo = "5954877907"
  twitter = "*"
  github = "Ohohhh"
3. 挑选一款主题

在Hugo的 主题网站 中挑选一款你喜欢的主题,克隆到 themes 目录下

cd themes
git clone https://github.com/yoshiharuyamashita/blackburn.gitt

4. 创建一篇文章

创建第一篇文章,放到 post 目录,方便之后生成聚合页面。

hugo new post/my_first_blog.md

打开 my_first_blog.md,默认内容为下:

---
title: "my_first_blog"
date: 2019-05-30T10:49:31+08:00
draft : true
---
文本内容

其中draft 表示是否是草稿文件,编辑完成后请将其改为 false,否则编译会跳过草稿文件。

5. 本地调试

在项目根目录下,通过 hugo server 命令可以使用 hugo 内置服务器调试预览博客。

hugo server --theme=blackburn --buildDrafts

其中 --theme 选项可以指定主题,–buildDrafts 包括标记为草稿
然后在浏览器里打开: http://localhost:1313 即可访问到你的博客

6. 部署到GitHub

如果你需要部署在 GitHub Pages 上,首先在GitHub上创建一个Repository,命名为:ohohhh.github.ioohohhh替换为你的github用户名的小写
在站点根目录执行 Hugo 命令生成最终页面:

hugo --theme=blackburn --buildDrafts --baseUrl=“https://ohohhh.github.io

注意:这里的 --baseUrl 一定是https://(Hugo中文文档里为http://),不然你部署后的博客会没有样式!

可看到根目录下多出 /public文件夹出来,该文件夹的内容即Hugo生成的整个静态网站。然后继续在你的站点根目录执行git 命令,添加远程仓库。

cd public
$ git init
$ git remote add origin git@github.com:Ohohhh/ohohhh.github.io.git
$ git add -A
$ git commit -m “first commit”
$ git push -u origin master

然后浏览器里访问:https://ohohhh.github.io/ 即可看到刚刚搭建的博客。

发布博客:

–新建博客markdown文件,并编辑博客内容(文件名为 **.md )
hugo new post/newBlog.md
–生成静态页面
hugo --theme=blackburn --buildDrafts --baseUrl=“https://ohohhh.github.io/
—发布
cd public
git add .
git commit -m “new blog added”
git push origin master

  • 3
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值