Hugo baseof.html Template Boilerplate Configuration
September 10, 2017Setup Title, RSS, Language, Meta, etc.
Edit layouts/_default/baseof.html
. Below is a sample of the template file.
<!DOCTYPE html>
<html lang="{{ with .Site.LanguageCode }}{{ . }}{{ else }}en{{ end }}">
<head>
<meta charset="utf-8">
{{ .Hugo.Generator }}
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>{{ block "title" . }}{{ with .Title }}{{ . }} | {{ end }}{{ .Site.Title }}{{ end }}</title>
{{ if .RSSLink }}
<link href="{{ .RSSLink }}" rel="alternate" type="application/rss+xml" title="{{ if .Title }}{{ .Title }} - {{ end }}{{ .Site.Title }}" />
{{ end }}
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<link href="/css/local.css" rel="stylesheet">
<meta property="description" content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end }}" />
{{- partial "site-opengraph.html" . -}}
{{- partial "site-twittercard.html" . -}}
{{- partial "site-schema.html" . -}}
{{- partial "site-analytics.html" . -}}
</head>
<body>
{{ block "nav" . }}{{ partial "site-nav.html" . }}{{ end }}
{{ block "header" . }}{{ end }}
<main role="main" class="container">
{{ block "test" . }}{{ end }}
{{ block "main" . }}{{ end }}
</main>
{{ block "footer" . }}{{ partial "site-footer.html" . }}{{ end }}
{{ block "scripts" . }}{{- partial "site-scripts.html" . -}}{{ end }}
{{ block "deferscripts" . }}{{ end }}
</body>
</html>
Language
Template for language.
<html lang="{{ with .Site.LanguageCode }}{{ . }}{{ else }}en{{ end }}">
...
</html>
Language configuration in config.toml
.
languageCode = "en"
Title
Template for title. It will show page title followed by site title, e.g. Hugo baseof.html Template Boilerplate Configuration | Lua Software Code
.
<html lang="en">
<head>
<title>{{ block "title" . }}{{ with .Title }}{{ . }} | {{ end }}{{ .Site.Title }}{{ end }}</title>
...
<head>
...
</html>
Title configuration in config.toml
.
title = "Lua Software Code"
You can set home
page’s title at content/_index.md
.
---
title: "HOWTO for Programmer"
---
Site RSS
Template for RSS link.
<html lang="en">
<head>
...
{{ if .RSSLink }}
<link href="{{ .RSSLink }}" rel="alternate" type="application/rss+xml" title="{{ if .Title }}{{ .Title }} - {{ end }}{{ .Site.Title }}" />
{{ end }}
...
</head>
...
</html>
Language, copyright and author configuration in config.toml
.
languageCode = "en"
copyright = "This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License."
[author]
name = "Desmond Lua"
RSS is automatically generated for Site, Section and Taxanomy (Tags and Categories). Refer to the RSS Template code used by Hugo.
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
<link>{{ .Permalink }}</link>
<description>Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}</description>
<generator>Hugo -- gohugo.io</generator>{{ with .Site.LanguageCode }}
<language>{{.}}</language>{{end}}{{ with .Site.Author.email }}
<managingEditor>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Author.email }}
<webMaster>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</webMaster>{{end}}{{ with .Site.Copyright }}
<copyright>{{.}}</copyright>{{end}}{{ if not .Date.IsZero }}
<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
{{ with .OutputFormats.Get "RSS" }}
{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
{{ end }}
{{ range .Data.Pages }}
<item>
<title>{{ .Title }}</title>
<link>{{ .Permalink }}</link>
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
<guid>{{ .Permalink }}</guid>
<description>{{ .Summary | html }}</description>
</item>
{{ end }}
</channel>
</rss>`
You can overwrite RSS templates at the following locations.
Main RSS
- /layouts/rss.xml
- /layouts/_default/rss.xml
Section RSS
- /layouts/section/
.rss.xml - /layouts/_default/rss.xml
Taxonomy RSS
- /layouts/taxonomy/
.rss.xml - /layouts/_default/rss.xml
Meta Description
Template for meta description. It use the description from the following sources and priority.
.Desceiption
(page’s description).Summary
(summary generated from page’s content).Site.Params.description
(site’s description)
<html lang="en">
<head>
...
<meta property="description" content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end }}" />
...
</head>
...
</html>
Description configuration in config.toml
.
[params]
description = "Tutorials and snippets for programming languages, frameworks, tools, etc."
References
- android
- android-ktx
- android-studio
- bootstrap
- coroutines
- crashlytics
- css
- dagger2
- datastore
- eslint
- firebase
- flask
- fontawesome
- git
- glide
- google-app-engine
- google-drive
- google-maps
- google-places
- google-play
- hugo
- java
- java-time
- javascript
- kotlin
- lets-encrypt
- linux
- markdown
- moshi
- nginx
- npm
- pip
- python
- room
- rxjava
- selenium
- ssl
- static-site-generator
- ubuntu
- unit-test
- uwsgi
- vue-cli
- vuejs
- web-development
- web-hosting
- webpack
- windows
- workmanager