Add Your Hugo Theme to the Showcase
A collection of all themes created by the Hugo community, including screenshots and demos, can be found at https://themes.gohugo.io. Every theme in this list will automatically be added to the theme site. Theme updates aren’t scheduled but usually happen at least once a week.
tl;dr
- Create your theme using
hugo new theme <THEMENAME>
; - Test your theme against https://github.com/spf13/HugoBasicExample *
- Add a
theme.toml
file to the root of the theme with all required metadata - Add a descriptive
README.md
to the root of the theme source - Add
/images/screenshot.png
and/images/tn.png
* If your theme doesn’t fit into the Hugo Basic Example
site, we encourage theme authors to supply a self-contained Hugo site in /exampleSite
.
See the Hugo Artist theme’s exampleSite for a good example.
Theme Requirements
In order to add your theme to the Hugo Themes Showcase, the following requirements need to be met:
theme.toml
with all required fields- Images for thumbnail and screenshot
- A good README file instructions for users
- Addition to the hugoThemes GitHub repository
Add Your Theme to the Repo
The easiest way to add your theme is to open up a new issue in the theme repository with a link to the theme’s repository on GitHub.
Create a theme.toml
File
theme.toml
contains metadata about the theme and its creator and should be created automatically when running the hugo new theme
. The auto-generated file is provided here as well for easy downloading:
name = ""
license = "MIT"
licenselink = "https://github.com/<YOURNAME>/<YOURTHEME>/blob/master/LICENSE.md"
description = ""
homepage = "https://example.com/"
tags = []
features = []
min_version = 0.19
[author]
name = ""
homepage = ""
# If porting an existing theme
[original]
name = ""
homepage = ""
repo = ""
The following fields are required:
name = "Hyde"
license = "MIT"
licenselink = "https://github.com/spf13/hyde/blob/master/LICENSE.md"
description = "An elegant open source and mobile first theme"
homepage = "http://siteforthistheme.com/"
tags = ["blog", "company"]
features = ["blog"]
min_version = 0.13
[author]
name = "spf13"
homepage = "http://spf13.com/"
# If porting an existing theme
[original]
author = "mdo"
homepage = "http://hyde.getpoole.com/"
repo = "https://www.github.com/mdo/hyde"
Images
Screenshots are used for previews in the Hugo Theme Gallery. Make sure that they have the right dimensions:
- Thumbnail should be 900px × 600px
- Screenshot should be 1500px × 1000px
- Media must be located in
/images/screenshot.png /images/tn.png
Additional media may be provided in the same directory.
Create a README File
Your theme’s README file should be written in markdown and saved at the root of your theme’s directory structure. Your README.md
serves as
- Content for your theme’s details page at https://themes.gohugo.io
- General information about the theme in your GitHub repository (i.e., it’s usual purpose)
Example README.md
You can download the following README.md
as an outline:
# Theme Title
**Need input from @digitalcraftsman on what could be added to this file.**