如何指定 Hugo 网站主题
2024-05-25 · li3huo
Hugo 提供了大量可选主题 供我们使用。虽然适配工作有一定成本，但这个付出是值得的。这次总结一下如何快速切换适配好的主题。
查看 hugo server 命令行工具文档，提供了 --theme 参数，用来指定启动时使用的主题，例如
hugo server --theme hugo-book
Introduction
如何在 Hugo 中创建新主题
2014-09-28 · Michael Henderson
Introduction #
本教程将展示如何在 Hugo 中创建一个简单的主题。我假设你熟悉 HTML、bash 命令行，并且你很熟悉使用 Markdown 来格式化内容。我将解释 Hugo 如何使用模板以及如何组织模板以创建主题。我不会介绍如何使用 CSS 来设置主题样式。
...Hugo Book 主题配置指南
2024-05-26 · li3huo
参考资料 #
...Update Google Analytics to GA4
2024-05-23 · li3huo
在官网找到 Google Analytics 4 Property Setup Assistant, 点击确认后出现 You have successfully connected your properties.
Learn more about Google Analytics 4 properties
...Getting Started with Hugo
2024-02-02 · li3huo
Hugo Front matter
...Buttons
· li3huo
Buttons # Buttons are styled links that can lead to local page or external link. Example # {{< button relref="/" [class="..."] >}}Get Home{{< /button >}} {{< button href="https://github.com/alex-shpak/hugo-book" >}}Contribute{{< /button >}} Get Home Contribute
Columns
· li3huo
Columns # Columns help organize shorter pieces of content horizontally for readability. {{< columns >}} <!-- begin columns block --> # Left Content Lorem markdownum insigne... <---> <!-- magic separator, between columns --> # Mid Content Lorem markdownum insigne... <---> <!-- magic separator, between columns --> # Right Content Lorem markdownum insigne... {{< /columns >}} Example # Left Content # Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! ...
Details
· li3huo
Details # Details shortcode is a helper for details html5 element. It is going to replace expand shortcode. Example # {{< details "Title" [open] >}} ## Markdown content Lorem markdownum insigne... {{< /details >}} {{< details title="Title" open=true >}} ## Markdown content Lorem markdownum insigne... {{< /details >}} Title Markdown content # Lorem markdownum insigne…
Expand
· li3huo
Expand # Expand shortcode can help to decrease clutter on screen by hiding part of text. Expand content by clicking on it. Example # Default # {{< expand >}} ## Markdown content Lorem markdownum insigne... {{< /expand >}} Expand ↕ Markdown content # Lorem markdownum insigne… With Custom Label # {{< expand "Custom Label" "..." >}} ## Markdown content Lorem markdownum insigne... {{< /expand >}} Custom Label ... Markdown content # Lorem markdownum insigne. ...
Hints
· li3huo
Hints # Hint shortcode can be used as hint/alerts/notification block. There are 3 colors to choose: info, warning and danger. {{< hint [info|warning|danger] >}} **Markdown content** Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa {{< /hint >}} Example # Markdown content Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa Markdown content ...