hugo-最好用的静态网站生成器
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-最好用的静态网站生成器的更多相关文章
- 利用git+hugo+markdown 搭建一个静态网站
利用git+hugo+markdown 搭建一个静态网站 一直想要有一个自己的文档管理系统: 可以很方便书写,而且相应的文档很容易被分享 很方便的存储.管理.历史记录 比较方面的浏览和查询 第一点用M ...
- jekyll 将纯文本转化为静态网站和博客 静态网站生成器
jekyll 将纯文本转化为静态网站和博客 静态网站生成器 这个貌似对windows 支持不是很好~ 但是有支持,官方说不建议使用
- 关于开箱即用的文档静态网站生成器VuePress
关于VuePress 一个由Vue驱动的静态文档网站生成框架,具有开箱即用的优点. 给项目添加.gitignore .gitignore是git用来排除目录的清单,我们把以下目录加入其中,以便每次操作 ...
- 使用 Java 和 Maven (JBake) 生成静态网站
使用 JBake("mvn generate-resources")构建您的静态网站或博客.使用布局.宏和数据文件. 我们迁移了整个www.optaplanner.org网站(13 ...
- 静态内容生成器——Wyam
(此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 题记:今天继续静态网站的话题,介绍我选用的一个使用.NET开发的静态内容生成器--Wyam. ...
- Gatsby上手指南 - 让你的静态网站用react来高逼格的写
注意:Gatsby V2版本安装及使用问题请移步<Gastby V2安装过程中常见问题>,此文较旧,主要针对V1版Gatsby而介绍 前言 一直以来都是用之前比较流行的静态网站生成器Hex ...
- [技术翻译]使用Nuxt生成静态网站
本周再来翻译一些技术文章,本次预计翻译三篇文章如下: 04.[译]使用Nuxt生成静态网站(Generate Static Websites with Nuxt) 05.[译]Web网页内容是如何影响 ...
- ECS7天实践进阶训练营Day1:使用阿里云ECS,快速搭建、管理VuePress静态网站
一.概述 VuePress是2018年由尤雨溪发布的一个全新的基于Vue的静态网站生成器,它是一个非常轻量级的静态网站生成器.VuePress主要用于生成技术文档,其类似于Gitbook,我们可以用于 ...
- [tools]hugo&github构建静态网站/百度统计
hugo/github构建网站基本原理 1.hugo是一个静态化的工具,你写md,然后他把md转换成对应样式的html, 2.并给html嵌入百度统计的script.然后你将html放到github上 ...
随机推荐
- Effective Java 75 Consider using a custom serialized form
Principle Do not accept the default serialized form without first considering whether it is appropri ...
- docker-1 初识docker
五分钟认识docker 什么是docker? 把他想象成一个用了一种新颖方式实现的超轻量虚拟机,在大概效果上也是正确的.当然在实现的原理和应用上还是和VM有巨大差别的,并且专业的叫法是应用容器(App ...
- javascript元素绑定事件
js元素绑定事件 想给一个元素绑定一个方法之后,在绑定一个方法而且不被覆盖 window.onload = function () { alert('a'); } window.onlaod=fu ...
- 虚拟机ping不通主机,但是主机可以ping通虚拟机(转载)
我在Windows7系统安装了虚拟机,通过虚拟机安装了Ubuntu13.04,我设置的主机与虚拟机的连接方式是桥接,安装好后,发现虚拟机ping不通主机,但是主机可以ping通虚拟机. 我的操作是:关 ...
- c# 常用正则
"^\d+$" //非负整数(正整数 + 0) "^[0-9]*[1-9][0-9]*$" //正整数 "^((-\d+)|(0+))$" ...
- MAVEN整理(乘国庆还有时间,停下来整理一下)
昨天写下了这篇博客(http://www.cnblogs.com/hzmark/p/131003Release.html),今天有时间,就这里一下第一篇内容. 换工作公司开发平台: WINDOWS+V ...
- linux内核宏container_of前期准备之gcc扩展关键字typeof
typeof基本介绍 typeof(x) 这是它的使用方法,x可以是数据类型或者表达式.它的作用时期和sizeof类似,就是它是在编译器从高级语言(如C语言)翻译成汇编语言时起作用,这个很重要,稍后会 ...
- [转]angularjs 设置全局变量的3种方法
本文转自:http://blog.51yip.com/jsjquery/1601.html angularjs自身有二种,设置全局变量的方法,在加上js的设置全局变量的方法,总共有三种.要实现的功能是 ...
- runc kill 和 delete流程分析
runc kill // kill sends the specified signal (default: SIGTERM) to the container's init process 1.ru ...
- 2014 Super Training #4 D Paint the Grid Again --模拟
原题:ZOJ 3780 http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3780 刚开始看到还以为是搜索题,没思路就跳过了.结 ...