汉堡是 Hugo 的一个简单干净的博客主题,基于 keichi 的维也纳主题。
我会告诉别人的显着特征是:
在您的hugo站点目录中,运行:
git clone https://github.com/hauke96/hugo-theme-hamburg.git themes/hamburg
主题现在应该位于themes/hamburg/
中。
您可以在站点的config.toml
(或config.yaml
/ config.json
)中指定以下选项以使用此主题的功能:
baseurl = " http://your-site.com "
defaultContentLanguage = " en "
defaultContentLanguageInSubdir = " true "
title = " Your site title "
theme = " hamburg "
[ params ]
# Short subtitle/tagline. This is displayed in the header.
themecolor = " #hexcolor " # Defines the tab color in Chrome for Android.
# To load additional CSS styles
customCSS = [ ' hamburg.css ' ]
# Show this very user-friendly and absolutely not annoying GDPR notice at the bottom of the page
ShowGDPRNotice = true
subtitle = " The great example site of the hugo-hamburg-theme "
# Since 0.57.0 there's the concept of "main sections". The files for the section "posts" are in "./content/posts/".
mainSections = [ " posts " ]
[ languages ]
[ languages . en ]
languageCode = " en "
languageName = " English "
subtitle = " A simple subtitle "
# Copyright notice. This is displayer in the footer.
copyright = " © some license "
[ languages . en . menu ]
[[ languages . en . menu . main ]]
name = " About "
identifier = " about "
url = " pages/about "
[ languages . de ]
languageCode = " de "
languageName = " Deutsch "
subtitle = " Ein einfacher Untertitel "
copyright = " © eine Lizenz "
[ languages . de . menu ]
[[ languages . de . menu . main ]]
name = " Über "
identifier = " about "
url = " pages/about "
vienna
主题参数到目前为止,我还没有使用原始维也纳主题中的一些其他参数。其中大多数可能不再起作用,因此不能保证:
[ params ]
# Social accounts. Link to these accounts are displayed in the header and
# footer.
twitter = " Your Twitter username "
github = " Your GitHub username "
gitlab = " Your GitLab username "
linkedin = " Your LinkedIn username "
googleplus = " Your Google+ user id "
facebook = " Your Facebook username "
reddit = " Your Reddit username "
hackernews = " Your Hacker News username "
stackoverflow = " Your Stackoverflow user id (number) "
keybase = " Your keybase.io username "
instagram = " Your Instagram username "
# Disqus shortname
disqus = " Your disqus shortname "
# Google Analytics API key.
ga_api_key = " Your Google Analytics tracking id "
# Mixpanel API key.
mixpanel_api_key = " Your Mixpanel API key "
您可以在帖子或页面的标题中设置一些选项:
# The date will be at the bottom of the page at the "Posted on ..." label
date = " 2018-08-13T15:38:27+02:00 "
title = " Erster Eintrag "
draft = true
author = " hauke "
# The summary will be shown at the start page or other page/post lists
summary = " Dies ist nur ein Testbeitrag um die Website zu testen. "
# This will ensure that the date is not printed
noshowdate = true
有一些简单的短代码可以让事情变得更容易。
创建一个指向标签页的简单链接:
I like {{< linkTag veggy-food "yummi vegetarian food" >}}.
包含图像并在单击时在新选项卡中打开它们:
{{< img "photo.png" "What a lovely picture" >}}
创建到给定图像的链接
{{< imgUrl "photo.png" "link text" >}}
将图像缩放到给定大小并像简码img
一样嵌入它。
{{< imgUrl "photo.png" "What a lovely picture" "500x" >}}
(此图像宽度缩放为 500 像素,高度自动确定)
该主题将根据页面的语言代码读取作者的信息。
要支持多个作者,请创建data/<lang>/authors/name.toml
文件(例如data/en/authors/hauke96.toml
)。该文件包含有关作者的信息:
name = " Your name "
avatar = " /images/avatar.jpg "
contact = " mailto:[email protected] "
bio = " Something about you "
要支持多种语言,请在data
目录中创建多个目录。因此,对于德语作为第二语言( languageCode
将是de
),上面的示例还将有一个data/de/authors/hauke96.toml
文件。
您可以将上述配置与 Google Analytics 等一起使用,或使用您自己的 JavaScript 片段来执行此操作。
对于自定义 JavaScript 代码片段,您必须创建一个layouts/partials/tracking.html
文件并将必要的代码放入该文件中。该文件(如果存在)将嵌入到其他跟踪机制旁边的页脚中。
我使用 Matomo 分析软件对此进行了测试,该软件提供了一个 JavaScript 或基于图像的片段,我将其放入tracking.html
中。