Hugo 主题

上一页/下一页： 所有主题

hello-friend-ng

一个简单的 Hugo 主题。就是这样。

下载
hello-friend-ng

Hello Friend NG

Hello Friend NG

基本信息

此主题深受 hello-friend 和 hermit 的启发。非常感谢他们出色的工作。

目录

  • 功能
  • 如何开始
  • 如何配置
  • 更多
    • 内置短代码
      • 图片
    • 代码高亮
    • 网站图标
    • 音频支持
  • 社交图标
  • 已知问题
  • 如何编辑主题
  • 更新日志
  • 赞助
  • 许可证

功能

  • 主题：深色/浅色模式，取决于您的系统偏好或用户的选择
  • 得益于 Rasmus Andersson 制作的 Inter 字体，带来极佳的阅读体验
  • 得益于 PrismJS，带来良好的代码高亮
  • 使用 Hugo 工具轻松修改主题
  • 完全响应式
  • 支持文章中的音频（感谢 @talbotp）
  • 内置（可启用/禁用）多语言菜单
  • 支持社交图标
  • 支持分享按钮
  • 支持 Commento
  • 支持 Plausible (感谢 @Joffcom)
  • 支持 utterances 评论系统

如何开始

您可以手动下载主题，前往 https://github.com/rhazdon/hugo-theme-hello-friend-ng.git 并将其粘贴到根目录中的 themes/hello-friend-ng。

您也可以将其直接克隆到您的 Hugo 文件夹中

git clone https://github.com/rhazdon/hugo-theme-hello-friend-ng.git themes/hello-friend-ng

如果您不想进行任何激烈的更改，这是最佳选择，因为您可以在有新更新时获得它们。为此，将其作为 git 子模块包含

git submodule add https://github.com/rhazdon/hugo-theme-hello-friend-ng.git themes/hello-friend-ng

如何配置

该主题不需要任何高级配置。只需复制以下配置文件。要查看所有可能的配置，请查看文档。注意：还有更多选项可以配置。请查看 exampleSite 中的 config.toml。

baseurl      = "localhost"
title        = "My Blog"
languageCode = "en-us"
theme        = "hello-friend-ng"
paginate     = 10

[params]
  dateform        = "Jan 2, 2006"
  dateformShort   = "Jan 2"
  dateformNum     = "2006-01-02"
  dateformNumTime = "2006-01-02 15:04"

  # Subtitle for home
  homeSubtitle = "A simple and beautiful blog"

  # Set disableReadOtherPosts to true in order to hide the links to other posts.
  disableReadOtherPosts = false

  # Enable sharing buttons, if you like
  enableSharingButtons = true
  
  # Show a global language switcher in the navigation bar
  enableGlobalLanguageMenu = true

  # Metadata mostly used in document's head
  description = "My new homepage or blog"
  keywords = "homepage, blog"
  images = [""]

[taxonomies]
    category = "blog"
    tag      = "tags"
    series   = "series"

[languages]
  [languages.en]
    title = "Hello Friend NG"
    keywords = ""
    copyright = '<a href="https://creativecommons.org/licenses/by-nc/4.0/" target="_blank" rel="noopener">CC BY-NC 4.0</a>'
    readOtherPosts = "Read other posts"

  [languages.en.params]
    subtitle  = "A simple theme for Hugo"

    [languages.en.params.logo]
      logoText = "hello friend ng"
      logoHomeLink = "/"
    # or
    #
    # path = "/img/your-example-logo.svg"
    # alt = "Your example logo alt text"

  # And you can even create generic menu
  [[menu.main]]
    identifier = "blog"
    name       = "Blog"
    url        = "/posts"

更多内容

内置短代码

当然，您可以使用 Hugo 的所有默认短代码 (https://gohugo.com.cn/content-management/shortcodes/)。

图片

属性

  • src（必需）
  • alt（可选）
  • position（可选，默认值：left，选项：[left, center, right]）
  • 样式

示例

{{< image src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" >}}

代码高亮

默认情况下，主题使用 PrismJS 为您的代码语法着色。您需要做的就是像这样包装您的代码

``` html
  // your code here
```

网站图标

请查看文档。

音频支持

您写了一篇文章并录制了它？或者您是否有想要放在特定文章中的特别音乐？那么您现在可以毫不费力地做到这一点。

在您的文章中添加到您的 front matter 部分

audio: path/to/file.mp3

社交图标：

提供多种社交图标，可以像这样进行配置

[[params.social]]
  name = "<site>"
  url = "<profile_URL>"

请查看此可用图标选项列表。

如果您需要其他图标，只需打开一个 issue 或创建一个 pull request，并附上您想要的图标。 :)

已知问题

Hugo 中存在一个错误，有时会导致主页无法正确呈现。原因是空的分类部分。相关 issue 工单：!14 !59。

要么您将其完全注释掉，要么您在其中写入以下内容

[taxonomies]
  tag      = "tags"
  category = "categories"

如何编辑主题

直接编辑即可。您不需要任何 node 相关的东西。;)

赞助

如果您喜欢我的作品，并且认为这个项目值得支持，请
Buy Me A Coffee

许可协议

版权所有 © 2019-2021 Djordje Atlialp

此主题基于 MIT 许可证发布。有关其他许可信息，请查看原始主题的许可。

另请参阅