hextra/exampleSite/content/docs/advanced/customization.zh-cn.md

title	linkTitle
自定义 Hextra	自定义

Hextra 在 hugo.yaml 中提供了一些自定义选项来配置主题. 本页介绍了可用选项以及如何进一步自定义主题.

自定义 CSS

要添加自定义 CSS，我们需要在站点中创建一个文件 assets/css/custom.css. Hextra 将自动加载该文件, 比如自定义字体:

.content {
  font-family: "Times New Roman", Times, serif;
}

主题色

主题色可以通过设置 --primary-hue 变量来自定义：

:root {
  --primary-hue: 100deg;
}

代码高亮

代码高亮风格的详细信息可在 Chroma Styles Gallery 中找到. 可以使用以下命令生成样式表：

$ hugo gen chromastyles --style=github

可将生成的样式添加到自定义 CSS 文件中以覆盖默认代码高亮样式.

自定义 Script

你可以添加以下文件以自定义 script 添加到每页的 head 或 end.

layouts/partials/custom/head-end.html

自定义布局

可以在站点的 layouts 目录中创建同名文件来覆盖主题的默认布局. 例如，要覆盖文档的 single.html 布局，在站点中创建文件 layouts/docs/single.html.

如需或许更多信息, 转至 Hugo Templates.

进一步定制 Hextra

没有找到你想修改的东西？在 GitHub 上创建 Issues 或为 Hextra 贡献你的智慧!