hugo theme hamburg
v0.8.2
Hamburg は、keichi の vienna テーマに基づいた、Hugo のシンプルでクリーンなブログ テーマです。
私が誰かに伝えたい注目すべき機能は次のとおりです。
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テーマパラメータオリジナルの 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ディレクトリに複数のディレクトリを作成します。したがって、第 2 言語としてのドイツ語 ( languageCodeはde ) の場合、上記の例にはdata/de/authors/hauke96.tomlファイルも含まれます。
上記の設定を Google Analytics などで使用することも、独自の JavaScript スニペットを使用して行うこともできます。
カスタム JavaScript スニペットの場合はlayouts/partials/tracking.htmlファイルを作成し、必要なコードをこのファイルに入れる必要があります。ファイル (存在する場合) は、他の追跡メカニズムの隣のフッターに埋め込まれます。
私はこれを Piwik 分析ソフトウェアでテストしました。これは、 tracking.htmlに挿入した JavaScript または画像ベースの切り取りを提供します。
