内容管理总览

目录

了解如何在 FixIt 主题中快速,直观地创建和组织内容。

内容组织

以下是一些方便你清晰管理和生成文章的目录结构建议:

  • 保持博客文章存放在 content/posts 目录,例如:content/posts/my-first-post.md
  • 保持简单的静态页面存放在 content 目录,例如:content/about.md
  • 使用 _index.md 翻译列表页面标题等,例如:content/posts/_index.md
  • 本地资源组织

有三种方法来引用 图片音乐 等本地资源:

  1. 使用 捆绑页面 (Page bundles) 中的 页面资源。 你可以使用适用于 Resources.GetMatch 的值或者直接使用相对于当前页面目录的文件路径来引用页面资源。
  2. 将本地资源放在 assets 目录中,默认路径是 /assets。 引用资源的文件路径是相对于 assets 目录的。
  3. 将本地资源放在 static 目录中,默认路径是 /static。 引用资源的文件路径是相对于 static 目录的。

引用的优先级符合以上的顺序。

提示

推荐使用 CoverView 来为你的文章生成精美的封面图片。

  • 在线工具:无需安装软件,在浏览器中即可使用
  • 🎨 多种模板:提供多种预设模板和自定义选项
  • 📐 适配主题:完美适配 FixIt 主题的设计风格
  • 🚀 快速生成:一键下载快速生成封面

项目地址:Lruihao/CoverView

页面模板

一般情况,你不需要设置 typelayout 参数,因为 HugoFixIt 会帮你选择。但是一些特殊情况你需要明确指定模板。

其他目录的文章

有时候你可能需要把一些文章单独放在一个目录中,而不是 content/posts 目录。这时你需要在文章的 Front matter 中设置 type: posts 参数。

例如,把所有文档的文章放在 content/documentation 目录,这里面的文章都使用 posts 模板:

1
2
3
4
5
---
title: 内容管理总览
date: 2024-04-06T12:57:26+08:00
type: posts
---

提示

你可以在 content/documentation/_index.md 中设置 cascade.params.type 参数为 posts,这样 content/documentation 目录下的所有文章都会使用 posts 模板。

1
2
3
4
5
6
---
title: 主题文档
cascade:
  params:
    type: posts
---

友情链接

FixIt 0.2.12 | 新增

在 Front matter 中设置 layout: friends,并在 yourSite/data/ 目录下创建 friends.yml,其内容格式如下:

1
2
3
4
5
# 朋友/站点信息例子
- nickname: 朋友名字
  avatar: 朋友头像
  url: 站点链接
  description: 对朋友或其站点的说明
技巧

你可以使用以下命令快速创建友情链接页面:

1
hugo new content friends/index.md

搜索结果

FixIt 0.3.16 | 新增

详见 CSE 支持

项目页面

这是一个额外的主题组件,具体请查看 hugo-fixit/component-projects

Front matter

这部分内容在 Front matter 中介绍。

内容摘要

FixIt 主题使用内容摘要在主页中显示大致文章信息。Hugo 支持生成文章的摘要。

文章摘要预览
文章摘要预览

自动摘要拆分

默认情况下,Hugo 自动将内容的前 70 个单词作为摘要。

你可以通过在网站配置中设置 summaryLength 来自定义摘要长度。

如果你要使用 CJK中文/日语/韩语 语言创建内容,并且想使用 Hugo 的自动摘要拆分功能,请在网站配置中将 hasCJKLanguage 设置为 true

手动摘要拆分

另外,你也可以添加 <!--more--> 摘要分割符来拆分文章生成摘要。

摘要分隔符之前的内容将用作该文章的摘要。

注意

请小心输入 <!--more-->,即全部为小写且没有空格。

Front matter 摘要

你可能希望摘要不是文章开头的文字。在这种情况下,你可以在文章 Front matter 的 summary 变量中设置单独的摘要。

使用文章描述作为摘要

你可能希望将文章 Front matter 中的 description 变量的内容作为摘要。

你仍然需要在文章开头添加 <!--more--> 摘要分割符。将摘要分隔符之前的内容保留为空。然后 FixIt 主题会将你的文章描述作为摘要。

比较

每种摘要类型都有不同的特点:

类型优先级渲染 Markdown渲染 Shortcodes使用 <p> 换行
手动摘要1✔️✔️✔️
Front matter2✔️
自动摘要3✔️✔️✔️
  1. 如果文章中有 <!--more--> 摘要分隔符,但分隔符之前没有内容,则使用描述作为摘要。
  2. 如果文章中有 <!--more--> 摘要分隔符,则将按照手动摘要拆分的方法获得摘要。
  3. 如果文章 Front matter 中有摘要变量,那么将以该值作为摘要。
  4. 按照自动摘要拆分方法。

提示

如果你想要纯文本摘要,可以设置 params.summary_plainify 或者 Front matter summary_plainify

Markdown 语法

这部分内容在 Markdown 基本语法页面Markdown 扩展语法页面 中介绍。

Shortcodes

这部分内容在 Shortcodes 页面 中介绍。

内容加密

这部分内容在 内容加密页面 中介绍。

URL 管理

Hugo 有一个强大的 URL 管理系统,详见 Hugo URL 管理

多语言和 I18n

FixIt 主题完全兼容 Hugo 的多语言模式,并且支持在网页上切换语言。

语言切换
语言切换

兼容性

语言Hugo 代码HTML lang 属性主题文档
英语enen
简体中文zh-cnzh-CN
繁体中文zh-twzh-TW
法语frfr
波兰语plpl
巴西葡萄牙语pt-brpt-BR
意大利语itit
西班牙语eses
德语dede
塞尔维亚语srsr
俄语ruru
罗马尼亚语roro
越南语vivi
印地语hihi
日语jaja
韩语koko
阿拉伯语arar
波斯语fafa
乌尔都语urur

基本配置

学习了 Hugo 如何处理多语言网站 之后,请在站点配置中定义你的网站语言。

例如,一个支持英语,中文和法语的网站配置:

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
# [en, zh-cn, fr, pl, ...] 设置默认的语言
defaultContentLanguage = "zh-cn"

[languages]

[languages.en]
weight = 1
title = "My Hugo FixIt Site"
locale = "en"
label = "English"

[[languages.en.menu.main]]
identifier = "posts"
pre = ""
post = ""
name = "Posts"
url = "/posts/"
title = ""
weight = 1

[[languages.en.menu.main]]
identifier = "tags"
pre = ""
post = ""
name = "Tags"
url = "/tags/"
title = ""
weight = 2

[[languages.en.menu.main]]
identifier = "categories"
pre = ""
post = ""
name = "Categories"
url = "/categories/"
title = ""
weight = 3

[languages.zh-cn]
weight = 2
title = "我的 Hugo FixIt 网站"
# 网站语言,仅在这里 CN 大写
locale = "zh-CN"
label = "简体中文"
# 是否包括中日韩文字
hasCJKLanguage = true

[[languages.zh-cn.menu.main]]
identifier = "posts"
pre = ""
post = ""
name = "文章"
url = "/posts/"
title = ""
weight = 1

[[languages.zh-cn.menu.main]]
identifier = "tags"
pre = ""
post = ""
name = "标签"
url = "/tags/"
title = ""
weight = 2

[[languages.zh-cn.menu.main]]
identifier = "categories"
pre = ""
post = ""
name = "分类"
url = "/categories/"
title = ""
weight = 3

[languages.fr]
weight = 3
title = "Mon nouveau site Hugo FixIt"
locale = "fr"
label = "Français"

[[languages.fr.menu.main]]
identifier = "posts"
pre = ""
post = ""
name = "Postes"
url = "/posts/"
title = ""
weight = 1

[[languages.fr.menu.main]]
identifier = "tags"
pre = ""
post = ""
name = "Balises"
url = "/tags/"
title = ""
weight = 2

[[languages.fr.menu.main]]
identifier = "categories"
name = "Catégories"
pre = ""
post = ""
url = "/categories/"
title = ""
weight = 3

然后,对于每个新页面,将语言代码附加到文件名中。

单个文件 my-page.md 需要分为三个文件:

  • 英语:my-page.en.md
  • 中文:my-page.zh-cn.md
  • 法语:my-page.fr.md

注意

使用 Front Matter 参数 也可以翻译 URL。

RTL 语言支持

对于阿拉伯语、波斯语等 RTL(从右到左)语言,需要在语言配置中将 direction 参数设置为 "rtl"。主题会通过 HTML dir 属性自动应用正确的文本方向。

1
2
3
4
5
6
[languages.ar]
weight = 4
title = "موقعي Hugo FixIt"
locale = "ar"
label = "العربية"
direction = "rtl"

注意

LTR 语言无需设置 direction 参数,默认值即为 "ltr"

在线演示请参见 RTL 测试的 英文版阿拉伯语版 进行对比。

修改默认的翻译字符串

翻译字符串用于在主题中使用的常见默认值。 目前提供 一些语言 的翻译,但你可能自定义其他语言或覆盖默认值。

要覆盖默认值,请在你项目的 i18n 目录中创建一个新文件 i18n/<languageCode>.toml,并从 themes/FixIt/i18n/en.toml 中获得提示。

另外,由于你的翻译可能会帮助到其他人,请花点时间通过 创建一个 PR 来贡献主题翻译,谢谢!

自动翻译

通过 自动翻译 组件,你只需少量的配置,就可以使单语言站点自动翻译为多种语言。

自动翻译
自动翻译为多种语言

提示

这是一个额外的主题组件,具体请查看 hugo-fixit/cmpt-translate


相关内容

Buy me a coffee
Lruihao 支付宝支付宝
Lruihao 微信微信

发现新版本

当前站点有新版本可用。