Hugo 主题
Hugo 主题 Techdoc
Techdoc 是一个用于技术文档的 Hugo 主题。
- Hugo 主题页面：https://themes.gohugo.com.cn/themes/hugo-theme-techdoc/
- 演示站点：https://thingsym.github.io/hugo-theme-techdoc/
- 下载：https://github.com/thingsym/hugo-theme-techdoc
功能
- 现代、简洁的布局
- 响应式网页设计
- 文档菜单（选择菜单样式）
- 页面目录（可选）
- 主题颜色
- 编辑文档存储库的链接
- HTML 标题的标题链接
- 自定义短代码
- 带有剪贴板的代码高亮
- 警报面板
- 按钮
- 由 Algolia 提供支持的搜索短代码
- 开放图谱协议 (Open Graph)
- 使用 Google Analytics、Google Tag Manager 进行分析
屏幕截图
主题颜色
菜单样式
打开菜单
滑动菜单
编辑链接
入门指南
要求
Hugo 最低版本：0.120.0
默认 Markdown 解析器库 Goldmark 兼容
将 Hugo 主题作为 git 子模块安装到您的项目中
如果您安装了 git，您可以使用项目目录中的 git submodule 将 hugo-theme-techdoc 存储库作为子模块包含到您的核心存储库中。
cd your_project
git submodule add https://github.com/thingsym/hugo-theme-techdoc.git themes/hugo-theme-techdoc
有关更多信息，请阅读 Hugo 文档。
或将 Hugo 主题作为 Hugo 模块安装到您的项目中
如果您安装了 Go，您可以将 hugo-theme-techdoc 作为 Hugo 模块添加到您的站点，而不是作为 git 子模块。导航到您的 Hugo 项目根目录并编辑您的 hugo.toml
[module]
[[module.imports]]
path = 'github.com/thingsym/hugo-theme-techdoc'
然后，要安装/更新 hugo-theme-techdoc 模块，请运行
hugo mod get -u
或在您的项目中下载 Hugo 主题
如果您安装了 git，您可以在项目目录中的命令行界面中执行以下操作。
cd your_project/themes
git clone https://github.com/thingsym/hugo-theme-techdoc.git
配置
您可以在站点的 hugo.toml（或 hugo.yaml/hugo.json）中指定选项，以使用此主题的功能。
有关 hugo.toml 的示例，请参见 exampleSite 中的 hugo.toml。
更新 git 子模块的 Hugo 主题
git submodule update --remote
git add themes/hugo-theme-techdoc
git commit
目录布局
tree . -I node_modules
.
├── LICENSE.md
├── README.md
├── archetypes
│ └── default.md
├── compose.yml
├── exampleSite
│ └── ..
├── gulpfile.js
├── images
│ └── ..
├── layouts
│ ├── 404.html
│ ├── blog
│ │ ├── li.html
│ │ ├── list.html
│ │ ├── single.html
│ │ └── summary.html
│ ├── _default
│ │ ├── baseof.html
│ │ ├── list.algolia.json
│ │ ├── list.html
│ │ └── single.html
│ ├── index.html
│ ├── partials
│ │ ├── content-footer.html
│ │ ├── custom-css.html
│ │ ├── custom-head.html
│ │ ├── edit-meta.html
│ │ ├── edit-page.html
│ │ ├── footer.html
│ │ ├── global-menu.html
│ │ ├── head.html
│ │ ├── last-updated.html
│ │ ├── menu
│ │ │ ├── open-menu.html
│ │ │ └── slide-menu.html
│ │ ├── meta
│ │ │ ├── chroma.html
│ │ │ ├── google-analytics-async.html
│ │ │ ├── google-site-verification.html
│ │ │ └── tag-manager.html
│ │ ├── notification.html
│ │ ├── pagination.html
│ │ ├── powered.html
│ │ ├── prepend-body.html
│ │ ├── search.html
│ │ ├── sidebar-footer.html
│ │ ├── sidebar.html
│ │ ├── site-header.html
│ │ └── table-of-contents.html
│ ├── posts
│ │ ├── list.html
│ │ └── single.html
│ ├── shortcodes
│ ├── button.html
│ ├── code.html
│ ├── panel.html
│ └── search.html
├── package-lock.json
├── package.json
├── resources
├── src
│ ├── js
│ │ ├── code.js
│ │ ├── headerlink.js
│ │ ├── jquery.backtothetop
│ │ │ ├── jquery.backtothetop.js
│ │ │ └── jquery.backtothetop.min.js
│ │ ├── keydown-nav.js
│ │ ├── main.js
│ │ └── sidebar-menu.js
│ └── scss
│ ├── _component.scss
│ ├── _project.scss
│ ├── _structure.scss
│ ├── _variable.scss
│ ├── chroma.scss
│ ├── foundation
│ │ ├── _element.scss
│ │ ├── _index.scss
│ │ ├── _normalize.scss
│ │ ├── _reset.scss
│ │ └── _stack.scss
│ ├── function
│ │ ├── _calc-font-size.scss
│ │ ├── _calc-stack.scss
│ │ ├── _contrast-color.scss
│ │ ├── _index.scss
│ │ └── _strip-unit.scss
│ └── theme.scss
├── static
│ ├── css
│ │ ├── chroma.css
│ │ ├── chroma.min.css
│ │ ├── theme.css
│ │ └── theme.min.css
│ ├── images
│ └── js
│ └── bundle.js
├── theme.toml
└── webpack.config.js
预览站点
要预览您的站点，请运行 Hugo 的内置本地服务器。
hugo server -t hugo-theme-techdoc
在 https://#:1313 上浏览站点
将站点部署到 public_html 目录
hugo -t hugo-theme-techdoc -d public_html