hugo最好用的静态网站生成器

Hugo是由Go语言实现的静态网站生成器。简单、易用、高效、易扩展、快速部署。

快速开始

安装Hugo

1. 二进制安装(推荐:简单、快速)

Hugo Releases 下载对应的操作系统版本的Hugo二进制文件(hugo或者hugo.exe)

Mac下直接使用 Homebrew 安装:

brew install hugo

2. 源码安装

源码编译安装,首先安装好依赖的工具:

设置好 GOPATH 环境变量,获取源码并编译:

$ export GOPATH=$HOME/go
$ go get -v github.com/spf13/hugo

源码会下载到 $GOPATH/src 目录,二进制在 $GOPATH/bin/

如果需要更新所有Hugo的依赖库,增加 -u 参数:

$ go get -u -v github.com/spf13/hugo

生成站点

使用Hugo快速生成站点,比如希望生成到 /path/to/site 路径:

$ hugo new site /path/to/site

这样就在 /path/to/site 目录里生成了初始站点,进去目录:

$ cd /path/to/site

站点目录结构:

  ▸ archetypes/
▸ content/
▸ layouts/
▸ static/
config.toml

创建文章

创建一个 about 页面:

$ hugo new about.md

about.md 自动生成到了 content/about.md ,打开 about.md 看下:

+++
date = "2015-10-25T08:36:54-07:00"
draft = true
title = "about" +++ 正文内容

内容是 Markdown 格式的,+++ 之间的内容是 TOML 格式的,根据你的喜好,你可以换成 YAML 格式(使用 --- 标记)或者 JSON 格式。

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

$ hugo new post/first.md

打开编辑 post/first.md

---
date: "2015-10-25T08:36:54-07:00"
title: "first" --- ### Hello Hugo 1. aaa
1. bbb
1. ccc

安装皮肤

皮肤列表 挑选一个心仪的皮肤,比如你觉得 Hyde 皮肤不错,找到相关的 GitHub 地址,创建目录 themes,在 themes 目录里把皮肤 git clone 下来:

# 创建 themes 目录
$ cd themes
$ git clone https://github.com/spf13/hyde.git

运行Hugo

在你的站点根目录执行 Hugo 命令进行调试:

$ hugo server --theme=hyde --buildDrafts --watch

使用 --watch 参数可以在修改文章内容时让浏览器自动刷新。

浏览器里打开: http://localhost:1313

部署

假设你需要部署在 GitHub Pages 上,首先在GitHub上创建一个Repository,命名为:coderzh.github.io (coderzh替换为你的github用户名)。

在站点根目录执行 Hugo 命令生成最终页面:

$ hugo --theme=hyde --baseUrl="http://coderzh.github.io/"

如果一切顺利,所有静态页面都会生成到 public 目录,将pubilc目录里所有文件 push 到刚创建的Repository的 master 分支。

$ cd public
$ git init
$ git remote add origin https://github.com/coderzh/coderzh.github.io.git
$ git add -A
$ git commit -m "first commit"
$ git push -u origin master

浏览器里访问:http://coderzh.github.io/

这个网站 免费教程 就是我使用hugo生成的。 这个网站模板是我自己写的(样式部分除外),大家如果有关于hugo的以及go 模板相关的问题可以问我。

hugo-最好用的静态网站生成器的更多相关文章

  1. 利用git+hugo+markdown 搭建一个静态网站

    利用git+hugo+markdown 搭建一个静态网站 一直想要有一个自己的文档管理系统: 可以很方便书写,而且相应的文档很容易被分享 很方便的存储.管理.历史记录 比较方面的浏览和查询 第一点用M ...

  2. jekyll 将纯文本转化为静态网站和博客 静态网站生成器

    jekyll 将纯文本转化为静态网站和博客 静态网站生成器 这个貌似对windows 支持不是很好~ 但是有支持,官方说不建议使用

  3. 关于开箱即用的文档静态网站生成器VuePress

    关于VuePress 一个由Vue驱动的静态文档网站生成框架,具有开箱即用的优点. 给项目添加.gitignore .gitignore是git用来排除目录的清单,我们把以下目录加入其中,以便每次操作 ...

  4. 使用 Java 和 Maven (JBake) 生成静态网站

    使用 JBake("mvn generate-resources")构建您的静态网站或博客.使用布局.宏和数据文件. 我们迁移了整个www.optaplanner.org网站(13 ...

  5. 静态内容生成器——Wyam

    (此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 题记:今天继续静态网站的话题,介绍我选用的一个使用.NET开发的静态内容生成器--Wyam. ...

  6. Gatsby上手指南 - 让你的静态网站用react来高逼格的写

    注意:Gatsby V2版本安装及使用问题请移步<Gastby V2安装过程中常见问题>,此文较旧,主要针对V1版Gatsby而介绍 前言 一直以来都是用之前比较流行的静态网站生成器Hex ...

  7. [技术翻译]使用Nuxt生成静态网站

    本周再来翻译一些技术文章,本次预计翻译三篇文章如下: 04.[译]使用Nuxt生成静态网站(Generate Static Websites with Nuxt) 05.[译]Web网页内容是如何影响 ...

  8. ECS7天实践进阶训练营Day1:使用阿里云ECS,快速搭建、管理VuePress静态网站

    一.概述 VuePress是2018年由尤雨溪发布的一个全新的基于Vue的静态网站生成器,它是一个非常轻量级的静态网站生成器.VuePress主要用于生成技术文档,其类似于Gitbook,我们可以用于 ...

  9. [tools]hugo&github构建静态网站/百度统计

    hugo/github构建网站基本原理 1.hugo是一个静态化的工具,你写md,然后他把md转换成对应样式的html, 2.并给html嵌入百度统计的script.然后你将html放到github上 ...

随机推荐

  1. JavaScript字符串函数大全

    JS自带函数concat将两个或多个字符的文本组合起来,返回一个新的字符串.var a = "hello";var b = ",world";var c = a ...

  2. SSH服务器拒绝了密码,xshell连不上虚拟机怎么办

    用Xshell链接虚拟机的时候,出现下面情况: 这是sshd的设置不允许root用户用密码远程登录 解决方案: 修改 vim /etc/ssh/sshd_config 找到# Authenticati ...

  3. Armstrong数

    题目描述 在三位的整数中,例如153可以满足1^3 + 5^3 + 3^3 = 153,这样的数称之为Armstrong数.将所有的Armstrong数按小到大排序,试写出一程序找出指定序号的三位Ar ...

  4. beeline vs hive cli

    近期,大数据开发环境升级为cloudera 5.3. 配套的hive版本升级为0.13.1.可以使用心仪已久的分析开窗函数了.但在使用的过程中发现一些问题,仅记于此. 1.在使用hive命令的时候,发 ...

  5. Office文件上传自动生成缩略图

    来源:微信公众号CodeL 前不久产品经理提出一个X的需求,说上传office文件的时候需要将首页自动截图,用于显示文件列表的时候将文件第一页缩略图展示给用户.实现的方式有多种,这里给大家介绍一个简单 ...

  6. 【Android Demo】悬浮窗体实现

    突然对悬浮窗体感兴趣,查资料做了个小Demo,效果是点击按钮后,关闭当前Activity,显示悬浮窗口,窗口可以拖动,双击后消失.效果图如下: 它的使用原理很简单,就是借用了WindowManager ...

  7. 分享十个JavaScript在线调试工具

    测试Javascript可能是网页开发中最让人忧伤的工作.这里我找一些比较好的工具来帮助大家进行测试工作.这10款是我精选的基于浏览器的JavaScript在线调试工具,希望你们对你们有用. 1.Op ...

  8. tarjan算法求割点cojs 8

    tarjan求割点:cojs 8. 备用交换机 ★★   输入文件:gd.in   输出文件:gd.out   简单对比时间限制:1 s   内存限制:128 MB [问题描述] n个城市之间有通讯网 ...

  9. Remote Displayer for Android

    应用截图: 作者:sunrain_hjb      QQ:2157825357                 Email:sunrain_hjb@aliyun.com 版本:1.0.188     ...

  10. ZOJ 3233 Lucky Number --容斥原理

    这题被出题人给活活坑了,题目居然理解错了..哎,不想多说. 题意:给两组数,A组为幸运基数,B组为不幸运的基数,问在[low,high]区间内有多少个数:至少被A组中一个数整除,并且不被B中任意一个数 ...