Theme Configuration

Mon, 20 Jan 2025 00:00:00 +0000

This post covers all configuration options available in the Mono theme. For a getting started guide, see Getting Started with Mono.

Theme Configuration

Theme-wide settings are specified in hugo.toml. This file controls the overall behavior and appearance of Mono.

Site Parameters

The [params] section defines site metadata, features, and appearance:

toml
[params]
 author = "Your Name"
 description = "Site description for SEO"

 # Features
 showToC = true # Site-wide Table of Contents (override per-page)
 show_updated = true # Show visible "Updated" line when lastmod differs from date
 dateFormat = "Jan 2, 2006" # Go reference layout applied to post dates

 # Home page
 homePostCount = 3 # Number of recent posts on the home page
 homeProjectCount = 3 # Number of projects on the home page

 # SEO
 favicon = "images/favicon.svg"
 og_image = "images/og.png" # Default Open Graph image (override per-page)

 # Math (KaTeX only). Leave off to opt in per-page via `math: true` front matter.
 katex = false

 # Search
 enableSearch = true # Show header search icon and build /search/

 # Custom assets
 customCSS = ["css/custom.css"]
 customJS = ["js/custom.js"]

Parameter	Description
`author`	Displayed in footer and meta tags. Can be overridden per-page via front matter.
`description`	SEO meta description fallback when pages don’t specify one
`favicon`	Path relative to `static/` folder
`og_image`	Default social sharing image. Can be overridden per-page via front matter.
`homePostCount` / `homeProjectCount`	Number of items shown on the home page (default 3)
`customCSS`	CSS files in `assets/css/` (processed by Hugo)
`customJS`	JS files in `static/js/` (served as-is)

Language

Mono includes translations for UI elements in five languages. Set the default language at the top level of hugo.toml:

Projects Showcase

Wed, 25 Dec 2024 00:00:00 +0000

Mono includes a projects showcase that displays work in an organized, card-based layout. Unlike blog posts, projects are defined in a single data file for easy management.

Setting Up Projects

Create data/projects.toml to define projects. The file organizes projects into sections (categories) containing items (individual projects):

toml
[[section]]
 name = "Open Source"
 description = "Projects I maintain and contribute to"

 [[section.items]]
 title = "My App"
 description = "A useful application"
 url = "https://github.com/username/my-app"
 icon = "/images/projects/my-app.svg"

 [[section.items]]
 title = "CLI Tool"
 description = "A command-line utility"
 url = "https://github.com/username/cli-tool"
 symbol = "CLI"

[[section]]
 name = "Client Work"
 description = "Selected professional projects"

 [[section.items]]
 title = "Portfolio Site"
 description = "Personal website built with Hugo"
 url = "https://example.com"
 symbol = "WEB"

Each section has a name (required) and optional description. Each item requires title, description, and url. For the visual identifier, provide either an icon (path to an image, ideally SVG) or a symbol (2-3 character text fallback). If neither is specified, “PRJ” is used as the default.

Configuration on Mono

Theme Configuration