hugo toigian
1.0.0
使用 Tailwind CSS 的最小 Hugo 主题
Toigian-Tối giản（越南语）：极简主义（英语）免责声明：我不是前端开发人员，只是一个喜欢调整东西的人，所以我的代码可能不漂亮/干净。我尝试学习 Tailwind CSS，hugo-toigian 就是结果。
这些屏幕截图可能已过时。查看演示网站以获取最新信息。
| 黑暗的 | 光 |
|---|---|
tối giản ）设计。深受 mellow.dev 的启发。git 、 npm 。snap install hugo --channel=extendedpostcss-cli JavaScript 包（ npm install -g postcss postcss-cli ）以及使用的任何 PostCSS 插件（例如， npm install -g autoprefixer ）。如果您使用 Hugo Snap 软件包，则需要在 Hugo 站点目录中本地安装 PostCSS 和插件，例如，不带 -g 标志的npm install postcss-cli 。 hugo new site hugo-example-site
cd hugo-example-site
git initgit submodule add https://github.com/ntk148v/hugo-toigian.git themes/hugo-toigian cd themes/hugo-toigian
npm installconfig.toml文件中的主题。 theme = " hugo-toigian "hugo server -DF --disableFastRenderhugo --environment production --minify您可以将一些配置选项添加到 config.toml 文件中。
baseURL = ' http://example.org/ '
languageCode = ' en-us '
title = ' Toigian '
theme = " hugo-toigian "
themesDir = " ../.. "
# (Optional) If you provide a Disqus shortname, comments will be enabled on
# all pages.
# disqusShortname = "my-site"
[ params ]
# (Optional, default true): Controls table of contents visibility on right side of pages.
# Start and end levels can be controlled with markup.tableOfContents setting.
toc = true
# (Optional, default true) Enables comments template on pages
# By default partials/docs/comments.html includes Disqus template
# See https://gohugo.io/content-management/comments/#configure-disqus
# Can be overwritten by same param in page frontmatter
comments = true
[ params . author ]
name = " Kien Nguyen-Tuan "
email = " [email protected] "
[ markup ]
defaultMarkdownHandler = " goldmark "
# By default, Goldmark trims unsafe outputs which might prevent some shortcodes from rendering.
# It is recommended to set markup.goldmark.renderer.unsafe=true if you encounter problems.
[ markup . goldmark ]
[ markup . goldmark . renderer ]
unsafe = true # Enable user to embed HTML snippets in Markdown content.
[ markup . highlight ]
codeFences = true
guessSyntax = true
lineNos = false
noClasses = false
tabWidth = 4
[ markup . tableOfContents ]
startLevel = 2
endLevel = 4
ordered = true
# The left side navbar at the top
[ menu ]
[[ menu . nav ]]
name = " About "
url = " /about "
weight = 2
[[ menu . nav ]]
name = " Posts "
url = " /posts "
weight = 3您可以在各个页面的前面指定其他参数。
# Your posts tags
tags = [ ]
# If you have enabled comments for the site, you can disable it for specific pages
comment = true查看短代码。
layouts/partials/中主题的组件。| 空部分 | 放置 | 用法 |
|---|---|---|
layouts/partials/custom/head.html | 关闭<head>标签之前 | 添加自定义 css/js |
layouts/partials/custom/content-before.html | 页面内容之前 | |
layouts/partials/custom/content-after.html | 页面内容之后 | |
layouts/partials/font.html | 导入自定义字体 |
| 文件 | 描述 |
|---|---|
assets/css/custom.css | 自定义或覆盖 css 样式 |
例如，您不喜欢所选的字体 (Inconsolata)，并且想要使用自己选择的字体，请按照以下步骤操作：
layouts/partials/font.html来导入你的字体： <!-- load Inter and Overpass fonts -->
< link rel =" preconnect " href =" https://fonts.googleapis.com " />
< link rel =" preconnect " href =" https://fonts.gstatic.com " crossorigin />
< link
href =" https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&family=Overpass:wght@400;500&display=swap "
rel =" stylesheet "
/>assets/css/custom.css ： // change the default mono font to Overpass
:root {
--font-mono : " Overpass " ;
--font-serif : " Inter " ;
}如您所知，我不是前端开发人员。因此，如果您发现任何错误或想要改进，请毫不犹豫地提出问题/拉取请求。
主要目标是：
如果您发现缺少配置或自定义选项，请随时提出问题。
