HUGO 目录详解,创建自己的网站系统

原文:https://ichochy.com/posts/blog/20200810.html

HUGO 是一套模版静态化的系统,了解其目录结构有助于创建我们的网站系统

目录结构

Hyde主题为例,完整的目录结构如下:

iChochy
├── archetypes                      内容模版目录
│   └── default.md                  模版文件
├── config.toml                     配置文件
├── content                         内容目录
├── data                            数据目录
├── layouts                         网站模版目录
├── static                          静态文件目录
└── themes                          主题目录
    └── hyde                        Hyde主题目录
        ├── CHANGELOG.md            
        ├── LICENSE.md              
        ├── README.md
        ├── archetypes              内容模版
        │   └── default.md
        ├── go.mod
        ├── images
        │   ├── screenshot.png
        │   └── tn.png
        ├── layouts                 网站模版
        │   ├── 404.html            404面目模版
        │   ├── _default            默认模版目录
        │   │   ├── baseof.html     基础模版
        │   │   ├── list.html       列表页面模版
        │   │   └── single.html     单页面模版
        │   ├── index.html          首页模版
        │   └── partials            模块模版目录
        │       ├── head.html       HEAD模块模版
        │       ├── head_fonts.html
        │       ├── hook_head_end.html
        │       └── sidebar.html
        ├── static                  静态目录
        │   ├── apple-touch-icon-144-precomposed.png
        │   ├── css
        │   │   ├── hyde.css
        │   │   ├── poole.css
        │   │   ├── print.css
        │   │   └── syntax.css
        │   └── favicon.png
        └── theme.toml              主题配置文件

archetypes

内容模版目录,通过内容模版,使用hugo new命令创建新的内容文件

default.md 内容模版

---
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
categories: 
        - iChochy
tags: 
        - iChochy
---

使用命令:hugo new posts/iChochy.md,生成内容文件 content/posts/iChochy.md

---
title: "iChochy"
date: 2020-08-10T18:13:25+08:00 
categories: 
        - iChochy 
tags: 
        - iChochy 
---

config.toml

项目的配置文件,列举些常用的参数。如下:

# 基础参数,通过.Site.xxxx获取参数
# 网站标题
title = "回忆中的明天"
# 域名地址
baseURL = "https://ichochy.com/"
# 主题名称
theme = "hyde"
# 网站的语言代码
languageCode = "zh_CN"
# 启用以将相对URL变为绝对URL
canonifyURLs = false
# Hugo 生成静态站点的目录
publishDir = "docs"
# 启用生成robots.txt文件
enableRobotsTXT = false
# 启用自动检测内容中的中文/日语/韩语,让.Summary和.WordCount对于CJK语言正确运行
hasCJKLanguage = false
# 指定.Summary 的长度
summaryLength = 70
# 默认分页数
paginate = 10
# 启用.html后缀地址,默认URL为/filename/,启用为/filename.html
uglyurls = false

# 自定义参数,通过.Site.Params.xxxx获取参数
[params]
  postDir = "posts"
  layoutReverse = false
  copyright = "iChochy"
  description = "码农小站,写点Java、Swift和感悟"

# 菜单参数,通过.Site.Menus.main获取参数
# Name为菜单名称、Weight为菜单排序参数、URL为菜单名称
[Menus]
  main = [
      {Name = "Categories", Weight = 1, URL = "/categories/"},
      {Name = "Tags", Weight = 2, URL = "/tags/"},
      {Name = "Links", Weight = 3, URL = "/links/"},
      {Name = "About", Weight = 4, URL = "/about/"},
      {Name = "Feedback", Weight = 5, URL = "/feedback/"}
  ]

content

内容目录,网站的MD源文件,通过对应的模版生成静态文件

data

数据目录,存储结构数据,可以用YAMLJSONTOML格式编写数据文件,可用.Site.Data.xxxx的方式来获取数据

layouts

模版目录,以.html文件形式存储模板,这些模板指定如何将内容目录中的源文件呈现到静态网站中
模版包括:主页模版、单页模板、列表模版、分类模版、模块模版等

static

静态文件目录,存储所有静态内容,如:Image,CSS,JavaScript等
当Hugo建立您的网站时,静态目录内的所有文件均按原样复制生成,可有来存储效验文件、CNAME文件等

打赏

Sponsor