1. 安装 Hugo

从 Hugo 项目主页下载 Releases 文件,解压 hugo.exe 文件到 C:\Windows\System32 目录下。

2. 创建站点

  1. hugo new site mysite

新的站点文件夹 mysite 就自动生成到了当前目录下:

在执行完 hugo new site 命令后你会得到一个包含以下文件的目录。

  1. .
  2. ├── archetypes/
  3. ├── config.toml
  4. ├── content/ # 储存网站的所有文章内容
  5. ├── data/
  6. ├── layouts/ # 全局样式,优先级高于主题下的 layouts 文件夹
  7. ├── static/ # 静态文件,优先级高于主题下的 static 文件夹
  8. └── themes/ # 主题目录

3. 新建页面和文章

新建一个 about 页面:

  1. hugo new about.md

about.md 自动生成到了 content/about.md,内容如下:

  1. ---
  2. title: "About"
  3. date: 2020-04-07T22:05:28+08:00
  4. draft: true
  5. ---

创建第一篇文章,放到 post 目录:

  1. hugo new post/myfirst.md

myfirst.md 自动生成到了 content/post/myfirst.md,内容如下:

  1. ---
  2. title: "Myfirst"
  3. date: 2020-04-07T22:05:28+08:00
  4. draft: true
  5. ---

其中 draft: true 表示为草稿文件,正式发布前需将值修改为 false,或者直接删除 draft 整个参数,否则正式发布时不会生成文章。

4. 安装主题

Hugo 主题列表 或从 Github 下载一款主题,解压到 theme 目录下:

  • 通过命令行的方式使用主题:hugo -t 主题目录名
  • 通过在 config.toml 配置使用:theme = "主题目录名"

5. 编译输出(构建 Hugo 网站)

在 Hugo 网站文件夹的根目录下,执行 hugo 命令来构建。

  1. hugo

编译输出的静态 HTML 文件,默认会保存到 public 目录。

6. 启动实时预览(本地预览网站效果)

写一篇文章生成一次会很繁琐,可以通过启动网站预览,实时监控页面的更改并刷新页面。

  1. hugo server -D

参数: -D 输出包括标记为 draft: true 的草稿文章

默认地址为 http://localhost:1313 如果 1313 端口被占用,会随机使用其他空端口。

参考阅读

Hugo 博客中文指南(基础教程)的更多相关文章

  1. 赫然:Windows Live Writer 批量博客更新软件使用教程

    http://www.wocaoseo.com/thread-144-1-1.html 推广人员需要使用多个博客,一个一个登陆更新是很麻烦的事情,网上的桌面批量更新博客软件也不少,今天在此推荐大家使用 ...

  2. 【hugo】- hugo 博客 添加鼠标单击特效

    hugo 博客 监听鼠标点击事件,添加动画效果 js下载 链接:https://pan.baidu.com/s/1SZu76WdEXRxLCfqJ2lbbtQ 密码:r056 移入hugo博客中 打开 ...

  3. 强大博客搭建全过程(1)-hexo博客搭建保姆级教程

    1. 前言 本人本来使用国内的开源项目solo搭建了博客,但感觉1核CPU2G内存的服务器,还是稍微有点重,包括服务器内还搭建了数据库.如果自己开发然后搭建,耗费时间又比较多,于是乎开始寻找轻量型的博 ...

  4. Hexo+Github: 博客网站搭建完全教程(看这篇就够了)

    本篇教程首次发布在个人博客:sunhwee.com,想要获得最佳阅读体验,欢迎前往,建议用电脑查看教程文档. # 阅读须知 注意,这篇文章篇幅较长,主要针对新手,每一步很详细,所以可能会显得比较啰嗦, ...

  5. 怎么在阿里云搭建一个WordPress博客(超详细教程)

    想以正确的方式启动一个 WordPress 博客吗?我知道,这可能是一个令人恐惧的想法 -- 其实你并不孤单.但是,在帮助很多用户创建博客之后,我决定编写一份详细的指南,让任何没有技术知识的人都能拥有 ...

  6. 给 hugo 博客添加搜索功能

    起因 我的博客使用了 hugo 作为静态生成工具,自带的主题里也没有附带搜索功能.看来,还是得自己给博客添加一个搜索功能. 经过多方查找,从 Hugo Fast Search · GitHub 找到一 ...

  7. 渣渣小本求职复习之路每天一博客系列——数据库基础(MySQL)(5)

    前情回顾:昨天学习了MySQL中索引的设计与使用,还了解了一些常见的SQL注入攻击的手段以及防范方法,一般来说,在面试的时候如果不是要求比较高,基本就够用了. 今天碰见一个拿了TP-LINK的offe ...

  8. Node.js的开源博客系统Ghost搭建教程

    准备工作 Node.js版本:0.10.x.0.12.x.4.2.x.安装步骤可参考:Node.js环境搭建 Ghost版本:0.7.4:中文集成版(33.6M),中文标准版(3.39M),英文原版( ...

  9. Ubuntu搭建hugo博客

    自己搭建了一个博客用hugo,后因自己搭建的博客上传文章,搞一些东西不方便,就创建了现在这个博客,不过还是把如何搭建hugo的过程记录以下. Ubuntu下的操作 1. 下载Git 打开终端 Ctrl ...

随机推荐

  1. [译] ConstraintLayout 可视化[Design]编辑器(这到底是什么)[第四部分]

    原文地址:Testing Views in Isolation with Espresso 原文作者:Ataul Munim 译文出自:掘金翻译计划 译者:yazhi1992 校对者:lovexiao ...

  2. 使用pdf2htmlEX将pdf文件转为html

    https://github.com/coolwanglu/pdf2htmlEX 参考github文档,转换出来的的效果貌似很好,可以参考OFFICE 文档转换为html在线预览. pdf2swf 和 ...

  3. 使用@Param注解

    1,使用@Param注解 当以下面的方式进行写SQL语句时: @Select("select column from table where userid = #{userid} " ...

  4. 自动化运维工具-Ansible之1-基础

    自动化运维工具-Ansible之1-基础 目录 自动化运维工具-Ansible之1-基础 Ansible 基本概述 定义 特点 架构 工作原理 任务执行模式 命令执行过程 Ansible 安装 Ans ...

  5. SonarQube学习(三)- 项目代码扫描

    一.前言 元旦三天假,两天半都在玩86版本DNF,不得不说,这个服真的粘度太高了,但是真的很良心. 说明: 注册账号上线100w点券,一身+15红字史诗装备以及+21强化新手武器.在线泡点一分钟888 ...

  6. CentOS7搭建svn部署项目

    一.安装SVN[root@client ~]# yum install -y subversion查看安装了哪些文件[root@client ~]# rpm -ql subversion/etc/su ...

  7. C++语言基础——01一切的开始

    环境准备 集成开发环境(Integrated Development Environment,IDE) 竞赛中最常见的是Dev-C++,平时练习采用其他IDE也可,使用方法都是类似的. 编译器 推荐使 ...

  8. Flink SQL结合Kafka、Elasticsearch、Kibana实时分析电商用户行为

    body { margin: 0 auto; font: 13px / 1 Helvetica, Arial, sans-serif; color: rgba(68, 68, 68, 1); padd ...

  9. python学习笔记 | selenium各浏览器驱动下载地址

    Chrome http://chromedriver.storage.googleapis.com/index.html 不同的Chrome的版本对应的chromedriver.exe 版本也不一样, ...

  10. Python+Docker+Flask+pyecharts实现数据可视化

    1.数据加工pyecharts图实现: 数据源:本地CSV文件 ps:由于是跟生产环境做交互,生产环境指标由HSQL加工,使用存储过程挂后台定时运行,后使用python实现导出及定时分发,本地pyth ...